Jump to content
  • Checkout
  • Login
  • Get in touch


The e-commerce.

Change background based on cPath=


Recommended Posts

I have a live site and would like to add the function where the background changes based on which category of products I am in. I have done something similar with a banner image at the top that changes based on the category the user is visiting. Any ideas on the best way to do this?

Link to comment
Share on other sites

For making the functionality where the background changes based on which category of products, you need different template or style sheet css for different categories. Then you can call them in <head></head> section, according to matching category and background design.


You can check file in catalog > includes > template_top.php

<link rel="stylesheet" type="text/css" href="stylesheet.css" />


You can call different file stylesheet.css for different categories. Hope you got answer. Otherwise, feel free to ask from me.

Link to comment
Share on other sites

If you know the cPath at the point where a page or part of a page (box) is rendered, you could override the .css background-image file with a style="background: <color> url('path/filename');" added to the <body> or <div>. This might be easier than trying to call a different .css file if all you want to change is the image. The problem with multiple .css files is that you have to be careful to remember to maintain them in parallel, whereas with a style tag to override the color and image in one place, there are fewer problems likely. If you want this done in a number of places, you could make an include file background_image($cPath) to return the style attribute (or just the color and image, to add to any existing style) as a string.

Link to comment
Share on other sites

I would do something like this in template_top.php, ensuring that these lines of code are placed AFTER the existing call to stylesheet.css;


if (file_exists(DIR_FS_CATALOG . $current_category_id . '.css')) {
 echo '<link rel="stylesheet" type="text/css" href="' . $current_category_id . '.css" />';


That code may not be exactly right, but gives the general idea.


If you are on index.php?cPath=12_45


then the stylesheet should be called 45.css as 45 is the current_category_id.

In that stylesheet, add your .css as appropriate.

Link to comment
Share on other sites


This topic is now archived and is closed to further replies.

  • Create New...