Append Top Menu "Class" for each menu item

Hello all. Im new to the CS Cart Community and i dont have a live store. Im experimenting in my localhost server using XAMPP. I made a quick hack to learn about cs card modification. Im new to the Smary Templates and The CS Cart development. If you have any sugestions please let me know. I will post later another way to do this by editing just a sigle line of code.



What the hack will do?

I will append a unique HTML class to each of your top menu item.


If your menu code is


  • Home
  • [/HTML]

    Will make it

  • Home
  • [/HTML]

    Why you will need this hack?

    You will need it to do style customizations to your menu. Lets say you want to make the first menu item display a red link. You can select it in CSS by

    [HTML].menuid0 span a{ color: red; } [/HTML]

    Or you can use the “class” attribute to make some cool JavaScript menus.


    [COLOR=“DarkOrange”]How to make the Hack[/COLOR][/SIZE]

    1. Edit your top_menu.tpl in your current template. If you dont know where to find it use the CS Cart “Customization Feature” (AdminBackend → Design → Enable Customization mode)
    2. Line 2 Add a php variable that will keep the menu id starting from zero “0”

      ```php {php}$menuid = 0;{/php} ```
    3. Line 8 Make the menuid variable be displayed on your menu by changin it to

    4. ```
    5. Line 14 Just before you close the “{/foreach}” function increase the variable +1 by adding

      ```php {php}$menuid += 1;{/php} ```
    6. Save and test.

      Now you must have a menu looking something like this:

    7. Home

  • Item1

  • Item2
  • [/HTML]

    The following link offers another approach to do this:


    I was searching for the param_id variable but i could not find it my own. Any ideas how can i learn about CS cart variables? I tried implement FirePHP but no luck.

    Anyways… here is my full code of top menu tpl (I just added [COLOR=“SeaGreen”]id=“menu{$m.param_id}”[/COLOR] on line 8 )

    ```php {* $Id: top_menu.tpl 9353 2010-05-04 06:10:09Z klerik $ *}

    {if $top_menu}


      {foreach from=$top_menu item="m"}

    • {$m.item}
      {if $m.subitems}
      {include file="top_menu.tpl" items=$m.subitems top_menu="" dir=$m.param_4}

    • {/foreach}


    {elseif $items}

      {assign var="foreach_name" value="cats_$iter"}
      {foreach from=$items item="_m" name=$foreach_name}

    • {$_m.item}
      {if $_m.subitems}
      {include file="top_menu.tpl" items=$_m.subitems top_menu="" dir=$_m.param_4 iter=$smarty.foreach.$foreach_name.iteration+$iter}

    • {if !$smarty.foreach.$foreach_name.last}

    • {/if}

    {/if} ```

    This will output with this code
  • Home
  • [/HTML]

    Since it will be unique its better to use the ID html property. Also to have a valid HTML/CSS the ID propery must [B]not[/B] [URL=""]start with a nubmer[/URL].So use my example and you will be ok.