Reputation: 7575
im using themes in an app im doing, and need a global css/img/js folder
i have tried using app/webroot as this folder, but cant get any css from a theme to show the images.
I have a setup like :: /app/views/themed/my_theme/webroot/css/file.css
With some css that looks like:
...
body{
background-image: url('../img/file.jpg');
}
...
if i have the image in /app/views/themed/my_theme/webroot/img/file.jpg
everything works 100% but when i put the image in /app/webroot/img/file.jpg
it will not show. i have tried all sorts of combinations for the
i have also tried using a plugin dir like app/plugins/my_plugin/webroot/img/file.jpg
but the various paths ive tried will not show the image either.
any ideas how i can get the image to show? i dont mind if its for webroot/ or in plugins/xyz/, just as long as i can use the same image in many different themes with out having to duplicate the images
when the image is in /webroot/img i can use the full path like url(http://locahost/my_app/img/file.jpg)
and it works.
things that dont work
url("img/file.jpg")
url("/img/file.jpg")
url("../img/file.jpg")
url("/../img/file.jpg")
url("../../img/file.jpg")
thanks.
Upvotes: 0
Views: 2529
Reputation: 7525
I have not tried that but the cookbook says:
If you want to keep your theme assets inside app/webroot it is recommended that you rename app/webroot/themed to app/webroot/theme.
Upvotes: 0
Reputation: 96
CSS has urls for images relative to the path it is placed in.
CSS files from my_theme are linked like site.com/theme/my_theme/css/style.css in the browser. So if you want to use an image from app/webroot/img in your theme's CSS, use url(../../../img/image.png)
Upvotes: 1
Reputation: 144
In your CSS file
body{
background-image: url('/img/file.jpg');
}
This will use the root area to find the image in /app/webroot/img/file.jpg
Upvotes: 3