Best Practices for Editing Magento Top-Links

configurationlayoutmagento-1.7themetoplinks

Let's say we want to add a shopping cart icon right before the "My Cart" link on Magento's top links (see top links below).

enter image description here

What is the best way to do this?

  1. Do something to toplinks.php?
  2. Do something to links.phtml?
  3. An xml file?
  4. Any other options?

I understand that this can be done with CSS, but as my needs for customization grow, I want to know how this can be done without CSS so I am able to customize more difficult things.

Best Answer

In any case do not edit the template file (links.phtml). This serves as a general template for all link lists. For example it is used for the links in the footer also.
With toplinks.php you can do whatever you want because is deprecated since CE v1.4.0.1.
I recommend using the xml files that add the links to the top container to achieve what you need.
The addLink method that is called when adding a new link supports some parameters that allow you to add classes and other attributes on li and a tags in the links and some text before the link and after the link.

public function addLink($label, $url='', $title='', $prepare=false, $urlParams=array(),
        $position=null, $liParams=null, $aParams=null, $beforeText='', $afterText='')
    { ... }

If you want to add an icon to my account menu you can set the $beforeText to <span class="icon"></span> and add some styles on the icon class.
For the cart and checkout links it's a little trickier because they are added via a block object not directly from the layout file.
If you need something different for the cart or checkout lins all you have to do is override the methods Mage_Checkout_Block_Links::addCartLink() or Mage_Checkout_Block_Links::addCheckoutLink(). These 2 call the same addLink() and you can pass different parameters to it.

Related Topic