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.