[Solved] Enabling Smart cache CCC removes background image

[mowax]

When I enable Smart cache CCC for CSS, the background image of my theme is replaced by giant question marks.

 

Please see images attached showing before and after enabling CCC.

 

I am using Prestashop 1.5.4.1 with the default theme. I added the background image url on line 111 of theme/css/global.css as follows:

 

body{

 

font:normal 11px/14px Arial, Verdana, sans-serif;

 

color:#222;

 

background:#fff url('/img/gifs/header-bg.gif') repeat-x;

 

}

 

 

Is this function just not working or is there another way of adding a background that will compress properly?

 

Thanks for any ideas

Edited July 30, 2013 by duratex (see edit history)

[NemoPS]

Hi,

can you perhaps link the website and turn ccc on?

[Sharak]

Change background url. Should be: background: #fff url('../img/gifs/header-bg.gif') repeat-x;

For that configuration header-bg.gif file should be placed in /themes/<your_theme>/img/gifs/

[mowax]

Thank you Sharak, it works right nice!

[Sharak]

Just try not to use url starting with / in your css files, cause that's what mess up with ccc enabled. Just to be clear, let's say you have to use in your style.css image1.jpg and image2.jpg located as follows:

\css
  style.css
  \img
	    image1.jpg
\img
  image2.jpg

 

Correct url should be 'img/image1.jpg' and '../img/image2.jpg'

[omgzhobbs]

Change background url. Should be: background: #fff url('../img/gifs/header-bg.gif') repeat-x;

For that configuration header-bg.gif file should be placed in /themes/<your_theme>/img/gifs/

 

 

Sorry to post in a old topic, but I just wanted to check something, in regards to a header image I notice the URL is different.

I have a module which adds a search box to every page at the top, and I want the background colour to be an image instead, however using ../img etc or img/ etc both appear with a broken image..

 

The location of the css file would be this;

/themes/zappies/css/modules

and the image is here;

 

/themes/zappies/img

 

 

How would I put the image in the CSS without it breaking?

[PascalVG]

I expect you have to go back two folders (from /themes/zappies/css/modules to /themes/zappies/), then go into img, so:

 

../../img/

 

Give it a try,

pascal

[Sharak]

If it's css for module than it can't be in /themes/zappies/css/modules as this won't override .css file from /modules/your_module/

Instead it should be placed in /themes/zappies/css/modules/your_module/

Now to show image from /themes/zappies/img/ you should use background: url(../../../img/your_image.png) but easier way is to place image in the same location as your .css file and use background: url(your_image.png)