Display Categories Images at Home Page

[sumitt2004]

Hi,

 

I am using PS 1.5.3.1 and want to display Category Images at my Home Page. I transplanted my Category Block to Home Content and get success in displaying categories at my Home Page but now I want to show Category Images also. Could someone please help in doing this?

 

Thanks in Advance

[sumitt2004]

Is there anyone who can help me on this?

[tomerg3]

If you have some coding knowledge, you can look at the actual category page where the images are shown, and try to do the same thing there.

 

You can also check out the following module http://www.presto-changeo.com/en/prestashop-modules/87-home-featured-categories.html

[sumitt2004]

Thanks Tomerg3, I have knowledge of PHP coding and saved blockcategories_footer.tpl as new tpl file which contain below code.

<div class="blockcategories_home_content">
<!--<h4 class="title_block">{l s='Categories' mod='blockcategories'}</h4>-->
<div class="category_home_content" style="float:left;clear:none;width:{$widthColumn}%">
<div style="float:left" class="list">
 <ul class="tree {if $isDhtml}dhtml{/if}">

 {foreach from=$blockCategTree.children item=child name=blockCategTree}
  {if $smarty.foreach.blockCategTree.last}
   {include file="$branche_tpl_path" node=$child last='true'}
  {else}
   {include file="$branche_tpl_path" node=$child}
  {/if}

  {if ($smarty.foreach.blockCategTree.iteration mod $numberColumn) == 0 AND !$smarty.foreach.blockCategTree.last}
 </ul>
</div>
</div>
<div class="category_home_content" style="float:left;clear:none;width:{$widthColumn}%">
 <div style="float:left" class="list">
 <ul class="tree {if $isDhtml}dhtml{/if}">
  {/if}
  {/foreach}
 </ul>
</div>
</div>
<br class="clear"/>
</div>
<!-- /Block categories module -->

 

But not getting where to add image code in above code and what is the $branche_tpl_path.

[yaniv14]

you need to look at: themes/default/categories.tpl not blockcategories.

[sumitt2004]

Hi yaniv14,

 

Could you please help me in doing this?

 

Thanks,

Sumit

[sumitt2004]

<a href="{$node.link|escape:'htmlall':'UTF-8'}" {if isset($currentCategoryId) && $node.id == $currentCategoryId}class="selected"{/if} title="{$node.desc|escape:'htmlall':'UTF-8'}">{$node.name|escape:'htmlall':'UTF-8'}</a>

 

This is the code which producing Category Name. Could you please tell me how can I fetch image from this?

[yaniv14]

I guess you can try:

<img src="{$link->getCatImageLink($category->link_rewrite, $node.id, 'small_default')}"

 

 

small_default = image size from BO image preferences

[sumitt2004]

Thanks a lot Yaniv14! Hats off to you.

[singhbalram786]

Hello Yaniv, I am having almost same problem, please help me. In my prestashop website, i wanted to show other categories also in home page like featured category. i could do this any how. But the problem is that link on the products is not working. Please help.

[singhbalram786]

Hello Sumit, Yaniv, you got my question??

[yaniv14]

Can you explain yourself better, where did you try to add the code, are you modifying a module or pages tpl files.

If you tried something can you post your code

[singhbalram786]

Ok. By default when we install prestashop, we see only featured products in home page. I wanted that other categories suppost books, i want few of selected books in home page in books category like featured product category. Someone did this for me, now i can see selected products in each category in my home page. Every thing is fine but problem is that links in the product are not working. I think this code is responsible for functionality i am saying.

 

 

 

 

{*

* 2007-2012 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:

* http://opensource.org/licenses/afl-3.0.php

* 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-2012 PrestaShop SA

* @version Release: $Revision: 6594 $

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

* International Registered Trademark & Property of PrestaShop SA

*}

 

<!-- MODULE Home Featured Products -->

<div id="featured-products_block_center" class="block products_block clearfix">

<h4>{$cat_name}</h4>

{if isset($products) AND $products}

<div class="block_content">

{assign var='liHeight' value=250}

{assign var='nbItemsPerLine' value=4}

{assign var='nbLi' value=$products|@count}

{math equation="nbLi/nbItemsPerLine" nbLi=$nbLi nbItemsPerLine=$nbItemsPerLine assign=nbLines}

{math equation="nbLines*liHeight" nbLines=$nbLines|ceil liHeight=$liHeight assign=ulHeight}

<ul style="height:{$ulHeight}px;">

{foreach from=$products item=product name=featuredcatagoryProducts}

{math equation="(total%perLine)" total=$smarty.foreach.featuredcatagoryProducts.total perLine=$nbItemsPerLine assign=totModulo}

{if $totModulo == 0}{assign var='totModulo' value=$nbItemsPerLine}{/if}

<li class="ajax_block_product {if $smarty.foreach.featuredcatagoryProducts.first}first_item{elseif $smarty.foreach.featuredcatagoryProducts.last}last_item{else}item{/if} {if $smarty.foreach.featuredcatagoryProducts.iteration%$nbItemsPerLine == 0}last_item_of_line{elseif $smarty.foreach.featuredcatagoryProducts.iteration%$nbItemsPerLine == 1} {/if} {if $smarty.foreach.featuredcatagoryProducts.iteration > ($smarty.foreach.featuredcatagoryProducts.total - $totModulo)}last_line{/if}">

<a href="{$product.link}" title="{$product.name|escape:html:'UTF-8'}" class="product_image"><img src="{$link->getImageLink($product.link_rewrite, $product.id_image, 'home_default')}" height="{$homeSize.height}" width="{$homeSize.width}" alt="{$product.name|escape:html:'UTF-8'}" />{if isset($product.new) && $product.new == 1}<span class="new">{l s='New' mod='featuredcatagory'}</span>{/if}</a>

<h5><a href="{$product.link}" title="{$product.name|truncate:50:'...'|escape:'htmlall':'UTF-8'}">{$product.name|truncate:35:'...'|escape:'htmlall':'UTF-8'}</a></h5>

<div class="product_desc"><a href="{$product.link}" title="{l s='More' mod='featuredcatagory'}">{$product.description_short|strip_tags|truncate:65:'...'}</a></div>

<div>

<a class="lnk_more" href="{$product.link}" title="{l s='View' mod='featuredcatagory'}">{l s='View' mod='featuredcatagory'}</a>

{if $product.show_price AND !isset($restricted_country_mode) AND !$PS_CATALOG_MODE}<p class="price_container"><span class="price">{if !$priceDisplay}{convertPrice price=$product.price}{else}{convertPrice price=$product.price_tax_exc}{/if}</span></p>{else}<div style="height:21px;"></div>{/if}

 

{if ($product.id_product_attribute == 0 OR (isset($add_prod_display) AND ($add_prod_display == 1))) AND $product.available_for_order AND !isset($restricted_country_mode) AND $product.minimal_quantity == 1 AND $product.customizable != 2 AND !$PS_CATALOG_MODE}

{if ($product.quantity > 0 OR $product.allow_oosp)}

<a class="exclusive ajax_add_to_cart_button" rel="ajax_id_product_{$product.id_product}" href="{$link->getPageLink('cart')}?qty=1&id_product={$product.id_product}&token={$static_token}&add" title="{l s='Add to cart' mod='featuredcatagory'}">{l s='Add to cart' mod='featuredcatagory'}</a>

{else}

<span class="exclusive">{l s='Add to cart' mod='featuredcatagory'}</span>

{/if}

{else}

<div style="height:23px;"></div>

{/if}

</div>

</li>

{/foreach}

</ul>

</div>

{else}

<p>{l s='No featured products' mod='featuredcatagory'}</p>

{/if}

</div>

<!-- /MODULE Home Featured Products -->

[singhbalram786]

here a href="{$product.link}" is working for featured products but not working on other specific categories..

[yaniv14]

what do you mean by specific categories? are you looking to add a link to category in featured product?

you have to excuse me, I had a long week and I am getting you yet

[PSD-to-Template]

Here is simple solution. You will need to modify a bit, but principe is clear i think

{assign var="cat_img" value="$tpl_dir../../img/c/{$node.id}-categories_home.jpg"}
{if file_exists($cat_img)} 
	<img class="cat_img" src="{$cat_img}" alt="" />
{else}
	<img class="cat_img" src="/img/c/nl-default-categories_home.jpg" alt="" />
{/if}	

Edited July 22, 2014 by PSD-to-Template (see edit history)

[harshal77988]

can anyone tell me how to display thumb image in block category menu. Actually i took left panel and showing categories there but i wnat there to display thumb image before category name. How can i do that ?