Page 1 of 1

[solved] Location of images called from a stylesheet

Posted: Mon Oct 31, 2011 2:10 am
by GaryF
Hi all,
I have been experimenting with CMSMS over past couple of days, and gradually working through converting an experimantal template.

Is there a specific location where the images are placed within the directory structure?
The original CSS calls the images as;
background: url(images/welcome.jpg) no-repeat;

And why is the location/path of the stylesheet (when looking at the HTML code) like this;
<link rel="stylesheet" type="text/css" href="http://xxxxxxxxxxxxxx.com.au/cmsms/tmp/ ... 3b62.css"/>

I can make the images display if I adjust the image paths within the CSS template to;
background: url(../../images/welcome.jpg) no-repeat;
But I don't want to go through the entire CSS and change the paths if I don't have to.

I have installed the current version 1.10

Regards,
Gary
Melbourne

Re: Location of images called from a stylesheet

Posted: Mon Oct 31, 2011 7:45 am
by uniqu3
And why is the location/path of the stylesheet (when looking at the HTML code) like this;
<link rel="stylesheet" type="text/css" href="http://xxxxxxxxxxxxxx.com.au/cmsms/tmp/ ... 3b62.css"/>
Stylesheets are cached in a temporary file and saved to /tmp/cache, thats why path looks like that.
Is there a specific location where the images are placed within the directory structure?
No, it is up to you how you prefer it, just make sure your path in stylesheet is correct.
If you look at default themes you will see that /uploads/SomeFolder is used.
I usually prefer same structure to keep my Template files separated from everything else /uploads/SomeTemplateName.

In your stylesheet you can then use background: url #f00 ([[uploads_url]]/SomeTemplateName/some-image.gif);

To make it easier for you, you can also assign your path to a variable on top of stylesheet like

Code: Select all

[[capture assign='my_path']][[uploads_url]]/SomeFolder[[/capture]]

.... thne use it

#some-id {
  background: #f00 url([[$my_path]]/my-image.gif);
}

Re: Location of images called from a stylesheet

Posted: Mon Oct 31, 2011 8:42 am
by GaryF
Is there a specific location where the images are placed within the directory structure?
uniqu3 wrote:No, it is up to you how you prefer it, just make sure your path in stylesheet is correct.
If you look at default themes you will see that /uploads/SomeFolder is used.
I usually prefer same structure to keep my Template files separated from everything else /uploads/SomeTemplateName.

In your stylesheet you can then use background: url #f00 ([[uploads_url]]/SomeTemplateName/some-image.gif);

To make it easier for you, you can also assign your path to a variable on top of stylesheet like

Code: Select all

[[capture assign='my_path']][[uploads_url]]/SomeFolder[[/capture]]

.... thne use it

#some-id {
  background: #f00 url([[$my_path]]/my-image.gif);
}
I didn't see reference to "[[capture assign]] [[/capture]]" within the docs which I read. Thanks, Works now.

Gary ;)