Different Images for Different Sub Category in Prestashop

In some prestashop template, there is a header images used to give more nuance to the template. But the problem with that is the header images is static, meaning that one header image for all sub categories that you have in your prestashop store.

This also problem for me, because what i want is to have different sub category images for different sub category according by the product on the sub category. Here is a quick how to have different images.

1. Depend on your method to insert images to the header, are you using tag or css ?

If you are using an  tag, and you have an image for every subcategory, you can simply use the following code in header.tpl :

<img src="{$img_dir}header{$smarty.get.id_category}.jpg" />

Then you would put header.jpg, header13.jpg, header14.jpg and header15.jpg in the img directory of your theme's directory.

If you need only a few header images to be different and the rest will use the default image, you'll need to use the following code in header.tpl instead :

<img src="{$img_dir}header{if $smarty.get.id_category == 13 OR $smarty.get.id_category == 14 OR $smarty.get.id_category == 15}{$smarty.get.id_category}{/if}.jpg" />

 If you are using CSS to display your images, you'll need to add a class to container of the image using the following code :

{if $smarty.get.id_category} class="cat{$smarty.get.id_category}"{/if}

Then you can use the following code in global.css to display the different images :

.cat13 { background: url(../img/header13.jpg); }
.cat14 { background: url(../img/header14.jpg); }
.cat15 { background: url(../img/header15.jpg); }