X-Cart forums - How do I display all subcategories along with all products

X-Cart forums (https://forum.x-cart.com/index.php)

- Changing design (https://forum.x-cart.com/forumdisplay.php?f=51)

- - How do I display all subcategories along with all products (https://forum.x-cart.com/showthread.php?t=19730)

Re: How do I display all subcategories along with all products

RobinBraves,

Looks like you've done everything correct. All you need to do now is to convert the sample code in subcategories.tpl to something that will read your data and place it formated on the page.

If you need some code to get you going I've gathered some code from various different threads and altered the subcategories.tpl file to show the output in icons and text. It is also hyperlinked so that you can click on the icon and the text. I've attached a thumbnail so you can see what it looks like.

First, add this code to the end of your skin1.css file:

Code:

 

.ColumnTitles {

      TEXT-ALIGN: center;

      WIDTH: 33%;

      PADDING-LEFT: 5px;

}

Then replace the code from <table> to </table> in the skin1/customer/main/subcategories.tpl file with the code below:

Code:

 

<table cellspacing="5" width="100%" border="2">

{foreach from=$subcategories item=subcat}

<tr>

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

<font class="ItemsList">{ $subcat.category|escape }</font></a>

</td></tr>

{foreach from=$subcat.products item=subproduct}

{if $tmp is div by 3} 

<tr><td colspan="3"></td></tr>

<tr valign="top"> 

{/if} 

{ if $tmp and $first_subproduct ne "Y" }

{assign var="tmp" value=0}

{assign var="first_subproduct" value="Y"}

{/if}

{if subproduct}

<td class="ColumnTitles" valign="top"><a title="{$subproduct.description}" <a href="product.php?productid={$subproduct.productid}&amp;cat={ $subproduct.productid }&amp;cat={$cat}&amp;page={$navigation_page}"><img src="{if $subproduct.tmbn_url}{$subproduct.tmbn_url}{else}{$xcart_web_dir}/default_image.gif{/if}" alt="" /><br>

{$subproduct.product|escape}

{/if}

<br>

{assign var="tmp" value=$tmp+1}

{/foreach}

{if $tmp is not div by 3}

{assign var="tmp" value=3}

{/if}

{/foreach}

</tr>

</td>

</table>

The above code produces three columns.
If you need to change it to two column then change these 2 lines of code in subcategories.tpl:

Code:

 

{if $tmp is div by 3} 

<tr><td colspan="3"></td></tr>

For two columns you need to replace both number 3's to 2
And for 4 columns you need to replace them to 4

And also at these 2 lines of code:

Code:

{if $tmp is not div by 3}

{assign var="tmp" value=3}

{/if}

You also need to change the percentage code you placed in your skin1/skin1.css file.

Example: for 2 columns it's 50%

Code:

 

.ColumnTitles {

      TEXT-ALIGN: center;

      WIDTH: 50%;

      PADDING-LEFT: 5px;

}

Example: for 4 columns it's 25%

Code:

 

.ColumnTitles {

      TEXT-ALIGN: center;

      WIDTH: 25%;

      PADDING-LEFT: 5px;

}

Unfortunately I've been so busy, I didn't have much time to test it out completely, but it's a start to get you going. You might have to change the table code or the css code to what you need. I also didn't work on the sort order (it's ordered alphabetically), it's different than the sort order on the menu (see the thumbnail). You can change the position order in the categories section of the admin side.
Anyway, hope this will get you going.

- MoonDog -

Re: How do I display all subcategories along with all products

Where exactly in the subcategories.tpl does the following code go. I've tried it in a few different places an end up getting a whole load of offset text which outlines the contents of the subcategories but no actual products.

Thanks.

{if $subcategories}
<ul>
{foreach from=$subcategories item=subcat}
[*]{$subcat.category|escape}
<ul>
{foreach from=$subcat.products item=subproduct}
{if $subproduct}
[*]{$subproduct.product|escape}
{/if}
{/foreach}
[/list] {/foreach}
[/list]{/if}

Re: How do I display all subcategories along with all products

You are a genius! Sorry for taking so long to get back. This worked and I will need to make some css and table adjustments, but that will be easy to do.

I really appreciate this.. I can actually feel stress relieving off of me.

Re: How do I display all subcategories along with all products

RobinBraves,
Glad to see you got it working and not as stressed anymore. :-)

designtheweb,

Quote:

The test code that you are using in the subcategories file is just logic. All that you would be getting is like you described; offset text which outlines the contents of the subcategories but no actual products.
Just follow the instructions I posted previously without this test code and you will see the products displayed instead of text.

- MoonDog -

Re: How do I display all subcategories along with all products

This code seems to change the layout of the individual products. is there a way to keep the individual products layout but have the products under the subcategories?