We moved to new unified forum!

Please post all new support queries in our New Forum.

T3 Community Discussion & Support

Let's build the best free Joomla template framework, together!
Subscribe via RSS  Subscribe via email
Recent
Categories
Tags
Users
Badges
View Replies (6)

Resolved Local folder path repeats when using background image in LESS

0
Votes
Undo
  1. Francisco Diaz
    Francisco Diaz
  2. General Discussion
  3. Monday, 29 September 2014
  4.  Subscribe via email
Hello everyone,

I am a new member here I hope that will also be able to help others too!!!

I am working on a new site where I am adding some custom layouts over Framework V2.3.2 and T3 Bs3 Blank V2.1.6, all seems to work fine keeping changes under the '/local/' folders.:D

I am using LESS to customise styles and they also work well,:)

:o :( - HERE is where I am having an issue, I am adding a background images to one of my areas in LESS files, the image are physically saved in ..../local/images/images.jpg and here is my LESS code.



	 .magia-bg{

		width:100%;

		background-image: url('../images/magia-bg-top.jpeg');

		background-repeat: no-repeat;

		background-position: left;

		background-attachment: fixed;

	 }


Once the page is reloaded and LESS file has been processed, the image is not shown, when I inspect the element the css results shows that the <blockquote>local folder is repeated in the path</blockquote>, like so:

background-image: url("../../../templates/t3_bs3_blank/local/local/images/magia-bg-top.jpeg");


<blockquote>And it should be:</blockquote>

background-image: url("../../../templates/t3_bs3_blank/local/images/magia-bg-top.jpeg");


Has anyone had the some issue? I would appreciate any help on this matter.

I thank you very much.
Regards
F Diaz
Attachments (1)
T3_LESS_t3_bs3_blank_LOCALFOLDER.PNG T3_LESS_t3_bs3_blank_LOCALFOLDER.PNG
  1. less
  2. image
  3. template customization
  4. css
  Calle Juan Millares Carlo, 35010 Las Palmas de Gran Canaria, Las Palmas, Spain
Visit 
Comment
There are no comments made yet.
Responses (6)
Gardner Luna
Gardner Luna
Hole-in-One The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
You're welcome @Francisco Diaz. Let me know if you have any concern.

Gardner.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 1
Francisco Diaz
Francisco Diaz
Accepted Answer Pending Moderation
0
Votes
Undo
Thanks you very much
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 2
Gardner Luna
Gardner Luna
Hole-in-One The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
Yeah, there are multiple ways to implement that :)
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 3
Chamira Athauda
Chamira Athauda
Sherlock Holmes
Accepted Answer Pending Moderation
0
Votes
Undo
Hello Francisco,

You can create another global variable, something like:
@t3-root-image-path:            "../../../images";


And use it like this in the LESS files:

background:url( "@{t3-root-image-path}/design/bkg.png" ) repeat; )


It is easier to manage as the path is defined in one place and the path can be manipulated until you get it right!
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 4
Francisco Diaz
Francisco Diaz
Accepted Answer Pending Moderation
0
Votes
Undo
Hello Gardner Luna,

Thank you very much. As I was trying your solution I also changed the URL path in LESS from:

url('../images/magia-bg-top.jpeg');


TO

url('../../images/magia-bg-top.jpeg');


Finally did not need to move the image to "templates/t3_bs3_blank/images"

The framework adds the "local" folder to the compiled css in the image path. As I went up two levels to reach the images folders in the root of the template, as you stated, the framework added the local part and css takes me back to images in local folder.

At least meanwhile I work with the images I was testing.

I hope this will help others.

Thanks Again for your help
Regards
  Calle Juan Millares Carlo, 35010 Las Palmas de Gran Canaria, Las Palmas, Spain
Visit 
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 5
Gardner Luna
Gardner Luna
Hole-in-One The Voice
Accepted Answer Pending Moderation
0
Votes
Undo
Hi Francisco Diaz,

Please put the image in the templates/t3_bs3_blank/images and the issue will be fixed.

Gardner.
Comment
There are no comments made yet.
  1. more than a month ago
  2. General Discussion
  3. # 6
  • Page :
  • 1


There are no replies made for this post yet.
However, you are not allowed to reply to this post.