add images to Subcategories links

[owas]

I cant seem to find anyway so that rather than my subcategories are just links at the top of the parent page they are images (boxes) on the page.
So like on this page http://flubbertoys.co.uk/prestashop/category.php?id_category=9 rather than have the six links for subcategories they are images displayed the same way as the products are on this page.

ta
Owain

[razaro]

Make sure in Back office your categories and subcategories have images.
Then you need to make changes in category.tpl in your theme folder,next code is from default theme

    <!-- Subcategories -->

{l s='Subcategories'}

       {foreach from=$subcategories item=subcategory}

getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}" title="{$subcategory.name|escape:'htmlall':'UTF-8'}">
                   {if $subcategory.id_image}
getCatImageLink($subcategory.link_rewrite, $subcategory.id_image, 'medium')}" alt="" />
                   {else}

                   {/if}



getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}">{$subcategory.name|escape:'htmlall':'UTF-8'}

       {/foreach}




   {/if}

And apply css to mach you site

[owas]

ta for this not sure what you mean apply css for your site, I copied the code in to the category.tpl but this just stops any products or subcatogery links/images showing.
ta
Owain

[razaro]

Sorry i didn't copy first line :red: , put

   {if isset($subcategories)}

before

    <!-- Subcategories -->

And rest from previous post.
Same code you have in in themes\prestashop\category.tpl.

And i meant if needed change css to match your website theme .

[owas]

dosent work

http://flubbertoys.co.uk/prestashop/category.php?id_category=9

here is the page before I put your code maybe it something else?

thank you for your help though

heres the page before I put your code in...

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

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

       {$category->name|escape:'htmlall':'UTF-8'}
{$nb_products|intval} {if $nb_products>1}{l s='products'}{else}{l s='product'}{/if}


   {if $scenes}
       <!-- Scenes -->
       {include file=$tpl_dir./scenes.tpl scenes=$scenes}
   {else}
       <!-- Category image -->
       {if $category->id_image}
getCatImageLink($category->link_rewrite, $category->id_image, 'category')}" alt="{$category->name|escape:'htmlall':'UTF-8'}" title="{$category->name|escape:'htmlall':'UTF-8'}" id="categoryImage" />
       {/if}
   {/if}

   {if $category->description}
{$category->description}
   {/if}
   {if isset($subcategories)}
   <!-- Subcategories -->

{l s='Subcategories'}

       {foreach from=$subcategories item=subcategory}

               {* getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}" title="{$subcategory.name|escape:'htmlall':'UTF-8'}">
                   {if $subcategory.id_image}
getCatImageLink($subcategory.link_rewrite, $subcategory.id_image, 'medium')}" alt="" />
                   {else}

                   {/if}


*}
getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}">{$subcategory.name|escape:'htmlall':'UTF-8'}

       {/foreach}




   {/if}

   {if $products}
           {include file=$tpl_dir./product-sort.tpl}
           {include file=$tpl_dir./product-list.tpl products=$products}
           {include file=$tpl_dir./pagination.tpl}
       {elseif !isset($subcategories)}

{l s='There is no product in this category.'}
       {/if}
{elseif $category->id}

{l s='This category is currently unavailable.'}
{/if} 

[razaro]

It seams that code tag on forum doesn't display href or /-> / in $link->getCategoryLink it sees as close html tag.
Sorry for not noticing that earlier.
In attachment you have correct code.

Or you can copy code or whole file from \prestashop\themes\prestashop\category.tpl
to \prestashop\themes\flower_3\category.tpl

Also check code for that image in home page maybe it also have same error.

Hope this solves it but if it is something completely different...

category.zip

[rocky]

The forums strip all href, img and script tags for security reasons. I get around these problems in my code contributions by changing <a href to <a href, <img src to <img src and <script> to <script>.

[razaro]

Thanks rocky will remember that.

[owas]

okay had to make a few changes but here it is and the code below, if I can pick your brain at one more thing my images are appearing blurred as if they are to small what size should I set the images to be in the code below and what size should I make the images to get them to look right?
ta v much for your help
Owain

http://flubbertoys.co.uk/prestashop/category.php?id_category=9

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

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

       {$category->name|escape:'htmlall':'UTF-8'}
{$nb_products|intval} {if $nb_products>1}{l s='products'}{else}{l s='product'}{/if}


   {if $scenes}
       <!-- Scenes -->
       {include file=$tpl_dir./scenes.tpl scenes=$scenes}
   {else}
       <!-- Category image -->
       {if $category->id_image}
getCatImageLink($category->link_rewrite, $category->id_image, 'category')}" alt="{$category->name|escape:'htmlall':'UTF-8'}" title="{$category->name|escape:'htmlall':'UTF-8'}" id="categoryImage" />
       {/if}
   {/if}

   {if $category->description}
{$category->description}
   {/if}
   {if isset($subcategories)}
   <!-- Subcategories -->

{l s='Subcategories'}

       {foreach from=$subcategories item=subcategory}

getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}" title="{$subcategory.name|escape:'htmlall':'UTF-8'}">
                   {if $subcategory.id_image}
getCatImageLink($subcategory.link_rewrite, $subcategory.id_image, 'medium')}" alt="" width="128" height="128" />
                   {else}

                   {/if}



getCategoryLink($subcategory.id_category, $subcategory.link_rewrite)|escape:'htmlall':'UTF-8'}">{$subcategory.name|escape:'htmlall':'UTF-8'}

       {/foreach}




   {/if}

   {if $products}
           {include file=$tpl_dir./product-sort.tpl}
           {include file=$tpl_dir./product-list.tpl products=$products}
           {include file=$tpl_dir./pagination.tpl}
       {elseif !isset($subcategories)}

{l s='There is no product in this category.'}
       {/if}
{elseif $category->id}

{l s='This category is currently unavailable.'}
{/if}  

[owas]

oh not to worry sorted it!
ta so much for your help

[rocky]

Please edit your first post and add [sOLVED] to the front of the title.

[owas]

okay me bad two more questions, I just cant get the width and height of the image and in the line of html to get it to look right, any suggestions on what they should both be?

http://flubbertoys.co.uk/prestashop/category.php?id_category=9

also how do I stop the box form showing at the top of products page once you click thorough the subcategory

http://flubbertoys.co.uk/prestashop/category.php?id_category=98111

Owain

[rocky]

1. Do you mean the size of the subcategory images? You should change the size of the images under Preferences > Images rather than using CSS to resize the images.

2. Do you want to remove the category image from the top of the category page? You can do that by editing category.tpl and {* comment out *} the following code on lines 13-17:

{else}
   <!-- Category image -->
   {if $category->id_image}
getCatImageLink($category->link_rewrite, $category->id_image, 'category')}" alt="{$category->name|escape:'htmlall':'UTF-8'}" title="{$category->name|escape:'htmlall':'UTF-8'}" id="categoryImage" />
   {/if}

[AlmeraGTI]

Can someone help with getting rid of the - that appears in the Subcategory between the picture and name Link Below;
http://www.puntomatica.com/lang-en/7-computer-shop

I have changed the category.tpl with the one above and still the same !!!

Thank you in anticipation.