Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

How to add class in top links?

Tags:

magento

I tried to add class to top links by using <aParams>class="class-name"</aParams>
For example:

<reference name="top.links">
    <action method="addLink" translate="label title" module="customer"><label>My Account</label><url helper="customer/getAccountUrl"/><title>My Account</title><prepare/><aParams>class="top-link-myaccount"</aParams><position>10</position></action>
</reference>

Above trick didn't work for me at least for 1.7.0.0 version.
Any idea?

Edit:
I think i fixed it using <li/><a>class="top-links-register"</a>:

<reference name="top.links">
        <action method="addLink" translate="label title" module="customer"><label>My Account</label><url helper="customer/getAccountUrl"/><title>My Account</title><prepare/><aParams/><position>10</position><li/><a>class="top-link-myaccount"</a></action>
    </reference>

Note that you must prepend <li/>

like image 329
MagePsycho Avatar asked May 26 '12 18:05

MagePsycho


2 Answers

To complete Lee's answer with an example, to add a class to the top link (the <li> element itself) you can do it through a new node (or a string) underneath the <liParams> like this:

<action method="addLink">
    <label/>
    <url/>
    <title/>
    <prepare/>
    <urlParams/>
    <position/>
    <liParams>
        <class>myclassname</class>
    </liParams>
    <aParams/>
    <beforeText/>
    <afterText/>
</action>

But as Lee points out, you need to preserve the order of these child elements.

If you want to put the class onto the <a> within the list, then the syntax is similar, you just target the node:

<action method="addLink">
    <label/>
    <url/>
    <title/>
    <prepare/>
    <urlParams/>
    <position/>
    <liParams/>
    <aParams>
        <class>myclassname</class>
    </aParams>
    <beforeText/>
    <afterText/>
</action>

If you need more flexibility over the link text and formatting, an alternate method is to generate the link in a block and then add that block instead of using the "addLink" node.

This is how the Cart and Checkout Links are added, rather than adding a link in the XML to Top Links they directly call the addLink method from within a block, this way they can calculate the appropriate text to show for each customer.

See the Mage_Checkout_Block_Links class in combination with base\default\layout\checkout.xml for an example of this.

like image 92
benz001 Avatar answered Oct 04 '22 04:10

benz001


As you have discovered, the method signature for addLink is:

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

So a proper call in a layout, using all the parameters, would be:

<action method="addLink">
    <label/>
    <url/>
    <title/>
    <prepare/>
    <urlParams/>
    <position/>
    <liParams/>
    <aParams/>
    <beforeText/>
    <afterText/>
</action>

Unfortunately Magento is not using reflection to map the action element children to named parameters of the method and is instead depending upon position.

One additional note, liParams and aParams can either be a string or a series of child elements representing key/value pairs.

like image 37
Lee Saferite Avatar answered Oct 04 '22 02:10

Lee Saferite