Jump to content

[SOLVED] Change background H1 Category and product overview page


Recommended Posts

{*

* 2007-2011 PrestaShop

*

* NOTICE OF LICENSE

*

* This source file is subject to the Academic Free License (AFL 3.0)

* that is bundled with this package in the file LICENSE.txt.

* It is also available through the world-wide-web at this URL:


* If you did not receive a copy of the license and are unable to

* obtain it through the world-wide-web, please send an email

* to [email protected] so we can send you a copy immediately.

*

* DISCLAIMER

*

* Do not edit or add to this file if you wish to upgrade PrestaShop to newer

* versions in the future. If you wish to customize PrestaShop for your

* needs please refer to http://www.prestashop.com for more information.

*

*  @author PrestaShop SA <[email protected]>

*  @copyright  2007-2011 PrestaShop SA

*  @version  Release: $Revision: 8544 $

*  @license    http://opensource.org/licenses/afl-3.0.php  Academic Free License (AFL 3.0)

*  International Registered Trademark & Property of PrestaShop SA

*}

 

{include file="$tpl_dir./breadcrumb.tpl"}

{include file="$tpl_dir./errors.tpl"}

 

{if isset($category)}

{if $category->id AND $category->active}

 

<h1>

{strip}

{$category->name|escape:'htmlall':'UTF-8'}

{$categoryNameComplement|escape:'htmlall':'UTF-8'}

<span class="category-product-count">

{include file="$tpl_dir./category-count.tpl"}

</span>

{/strip}

</h1>

 

{if $scenes}

<!-- Scenes -->

{include file="$tpl_dir./scenes.tpl" scenes=$scenes}

{else}

<!-- Category image -->

{if $category->id_image}

<div class="align_center">

<img src="{$link->getCatImageLink($category->link_rewrite, $category->id_image, 'category')}" alt="{$category->name|escape:'htmlall':'UTF-8'}" title="{$category->name|escape:'htmlall':'UTF-8'}" id="categoryImage" width="{$categorySize.width}" height="{$categorySize.height}" />

</div>

{/if}

{/if}

 

{if $category->description}

<div class="cat_desc"><h2>{$category->description}</h2></div>

{/if}

{if isset($subcategories)}

<!-- Subcategories -->

<div id="subcategories">

<h3>{l s='Subcategories'}</h3>

<ul class="inline_list">

{foreach from=$subcategories item=subcategory}

<li>

<a href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}" title="{$subcategory.name|escape:'htmlall':'UTF-8'}">

{if $subcategory.id_image}

<img src="{$link->getCatImageLink($subcategory.link_rewrite, $subcategory.id_image, 'medium')}" alt="" width="{$mediumSize.width}" height="{$mediumSize.height}" />

{else}

<img src="{$img_cat_dir}default-medium.jpg" alt="" width="{$mediumSize.width}" height="{$mediumSize.height}" />

{/if}

</a><br />

<a href="{$link->getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}">{$subcategory.name|escape:'htmlall':'UTF-8'}</a>

</li>

{/foreach}

</ul>

<br class="clear"/>

</div>

{/if}

 

{if $products}

{include file="$tpl_dir./product-compare.tpl"}

{include file="$tpl_dir./product-sort.tpl"}

{include file="$tpl_dir./product-list.tpl" products=$products}

{include file="$tpl_dir./product-compare.tpl"}

{include file="$tpl_dir./pagination.tpl"}

{elseif !isset($subcategories)}

<p class="warning">{l s='There are no products in this category.'}</p>

{/if}

{elseif $category->id}

<p class="warning">{l s='This category is currently unavailable.'}</p>

{/if}

{/if}

Link to comment
Share on other sites

That worked, now for the grey colour. This is the CSS file of category :

 

/* category.tpl */
body#category #subcategories li { height: 136px; width: 108px; margin-right: 3px }
div.cat_desc { margin: 0 1em }
body#category div#subcategories .inline_list a img { display: inline }
#category img#categoryImage { margin-top: 1em }
.cat_desc h2 {font-size:12px; background:none; text-decoration:none; text-transform:none; font-weight:normal; display:block; clear:both; overflow:hidden; height:auto;}
Link to comment
Share on other sites

if you want to re move background from title you have to remove background param from h1 style

h1 {
font-size: 1.1em;
line-height: 1.6em;
padding-left: 0.5em;
margin: 0.5em 0;
text-transform: uppercase;
font-weight: bold;
color: #374853;
background: transparent url('http://www.slaapzakken-discounter.nl/themes/prestashop/css/../img/title_bg.png') no-repeat top left;
height: 21px;
}
Link to comment
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now
×
×
  • Create New...