Mod for subcategories in columns with descriptions and icons

oshaine · #**151** 08-22-2006, 05:01 AM

Quote:

Originally Posted by mrkenzie

This is the code that I have and works with 4.1.0. I have added several things to this modification. Not only will it display the categories in columns, it will:
1. display the default "No Image Avail." image if one is not assigned
2. display "0 Products" if there are no subcategories or products for a particular category.
3. it will show the subcategory DESCRIPTION if there is one when you hover over the subcategory link.

Take it, use it, modify it. Good luck!

Here is what you add to the Skin.css

Code:

.ColumnTitles { padding-left: 5px; text-align: center; width: 33%; }

Find this in categories.php:

Code:

$_categories = func_query_hash("SELECT $to_search FROM $sql_tbl[categories] USE INDEX (am) $join_tbl ".(!empty($search_condition)?"WHERE ".implode(" AND ", $search_condition):"")." GROUP BY $sql_tbl[categories].categoryid ".$sort_condition, "categoryid", false);

and replace with this (in order to get the category description):

Code:

$_categories = func_query_hash("SELECT $to_search, $sql_tbl[categories].description FROM $sql_tbl[categories] USE INDEX (am) $join_tbl ".(!empty($search_condition)?"WHERE ".implode(" AND ", $search_condition):"")." GROUP BY $sql_tbl[categories].categoryid ".$sort_condition, "categoryid", false);

Here is the code that I changed in subcategories.tpl:

Code:

{if $subcategories}
<table cellspacing="5" width="100%" border="0">
<tr>
{foreach from=$subcategories item=subcat}

{if $tmp is div by 3} 
     </tr><tr><td colspan="3"></td></tr><tr valign="top"> 
{/if} 

{ if $tmp and $first_subcat ne "Y" }
	{assign var="tmp" value=0}
	{assign var="first_subcat" value="Y"}
{/if}
<td class="ColumnTitles" valign="top"><a title="{$subcat.description}" href="home.php?cat={ $subcat.categoryid }">[img]{if $subcat.icon_url}{$subcat.icon_url}{else}{$xcart_web_dir}/default_image.gif{/if}[/img]
	
 
	<font class="ItemsList">{ $subcat.category|escape }</font></a>

	{if $config.Appearance.count_products eq "Y"}
{if $subcat.product_count}{ $subcat.product_count } {$lng.lbl_products}
{elseif $subcat.subcategory_count}{ $subcat.subcategory_count } {$lng.lbl_categories|lower}
{else} 0 Products
{/if}
	{/if}
{assign var="tmp" value=$tmp+1}
{/foreach}
</table>
{/if}

By Default, it shows 3 columns. If you want to change the number of columns, then just change all the 3's to the number of columns you want in this line of code (from above):

Code:

{if $tmp is div by 3} 
     </tr><tr><td colspan="3"></td></tr><tr valign="top"> 
{/if}

And then change the following line in skin.css (from above) for the appropriate td width %

Code:

.ColumnTitles { padding-left: 5px; text-align: center; width: 33%; }

I added a blank row between each row of subcategories, just to seperate the rows a little so it does not look so crowded.

Let me know if there are any problems.

Where do i find categories.php....so i can change the code.
I didn't see skin.css anywhere..i only saw skin1.css. Are they the same?

mrkenzie · #**152** 08-22-2006, 05:23 AM

Categories.php is in the include folder.

You are right, it is skin1.css.

oshaine · #**153** 08-22-2006, 05:49 AM

This is not working for me...this is what i'm getting....http://www.tolbert-pkg.com/store/home.php?cat=8

Can u please tell me what i'm doing wrong

mrkenzie · #**154** 08-22-2006, 05:56 AM

In subcategories.tpl:

This line:

Code:

<td class="ColumnTitles" valign="top"><a title="{$subcat.description}" href="home.php?cat={ $subcat.categoryid }">[img]{if $subcat.icon_url}{$subcat.icon_url}{else}{$xcart_web_dir}/default_image.gif{/if}[/img]

should be

Code:

<td class="ColumnTitles" valign="top"><a title="{$subcat.description}" href="home.php?cat={ $subcat.categoryid }">{if $subcat.icon_url}{$subcat.icon_url}{else}{$xcart_web_dir}/default_image.gif{/if}

I am not sure how the [image] tag got in there, maybe when they updated the forum,

oshaine · #**155** 08-22-2006, 06:09 AM

I have replaced the line and there is no change. What else to do?

mrkenzie · #**156** 08-22-2006, 06:25 AM

My bad -

This is what you should replace it with:

Code:

<td class="ColumnTitles" valign="top"><a title="{$subcat.description}" href="home.php?cat={ $subcat.categoryid }"><img src="{if $subcat.icon_url}{$subcat.icon_url}{else}{$xcart_web_dir}/default_image.gif{/if}" alt="" />{/if}

See if that works.

oshaine · #**157** 08-22-2006, 06:29 AM

i am getting this on the site....Fatal error: Smarty error: [in customer/main/subcategories.tpl line 29]: syntax error: mismatched tag {/if}. expected {/foreach} (opened line 19). (Smarty_Compiler.class.php, line 2286) in /home/hosts/tolbert-pkg.com/public_html/store/Smarty-2.6.12/Smarty.class.php on line 1095

mrkenzie · #**158** 08-22-2006, 06:31 AM

Remove the last {/if}

I am not sure if you have the {/if} on the next line or not.

oshaine · #**159** 08-22-2006, 06:34 AM

It worked. Thanks you very good.
How can i get the category name under the image?....not to the bottom right of the image

leorulz · #**160** 08-22-2006, 09:10 AM

I have implemented this mod for x-cart 4.1.2, but for some reason thumbnails are not being displayed. You can visit my site at http://www.dreamindiamonds.com/store/home.php?cat=253 OR view an example below.

http://www.dreamindiamonds.com/ex.jpg