Magento 1 - Atributos personalizados nos Top Links utilizando XML

E ai, Devs!
A dica que darei a vocês é como colocar atributos personalizados para um link que pertence ao bloco Top Links.

Índice

    * [Por que isto parece uma tarefa difícil?](#chapter-1)
    * [liparams](#liparams)
    * [aparams](#aparams)

Por que isto parece uma tarefa difícil?

Porque os links são inseridos através do layout.xml, então o HTML é renderizado pela aplicação do Magento, parecendo ficar difícil inserir outros atributos das tags <li> e <a>, como por exemplo: class ou id.

Digamos que você tem um menu de acesso rápido com os seguintes links:

• Entrar
• Cadastre-se
• Minha Conta
• Meu Carrinho

E no design da loja que você está montando o link "Cadastre-se" tem um estilo completamente diferente dos outros links.
Iria ser fácil aplicar um estilo se este link fosse o primeiro ou o último da lista, pois além dos pseudo-seletores do CSS (:first-child e :last-child) o Magento põe, por padrão, uma classe first e last nesse tipo de lista.
Mas o layout foi desenhado com o link lá no meio e o cliente quer que seja assim.

Então vamos lá:
No customer.xml você tem a seguinte instrução:

<customer_logged_out>
    <reference name="top.links">
        <action method="addLink" translate="label title" module="customer">
            <label>Log In</label>
            <url helper="customer/getLoginUrl"/>
            <title>Log In</title>
            <prepare/>
            <urlParams/>
            <position>1</position>
        </action>

        <action method="addLink" module="customer">
            <label>Cadastre-se</label>
            <url helper="customer/getRegisterUrl"/>
            <title>Cadastre-se</title>
            <prepare/>
            <urlParams/>
            <position>2</position>
        </action>
    </reference>
</customer_logged_out>

liparams

Com a tag <liparams> você pode por o atributo que precisar na sua tag. Como no exemplo, colocando uma class:

<action method="addLink" module="customer">
    <label>Cadastre-se</label>
    <url helper="customer/getRegisterUrl"/>
    <title>Cadastre-se</title>
    <prepare/>
    <urlParams/>
    <position>2</position>
    <liParams>class="cadastro"</liParams>
</action>

aparams

Para colocar um atributo na tag <a> que está dentro da <li> você pode usar a tag xml: <aparams>

<action method="addLink" module="customer">
    <label>Cadastre-se</label>
    <url helper="customer/getRegisterUrl"/>
    <title>Cadastre-se</title>
    <prepare/>
    <urlParams/>
    <position>2</position>
    <liParams>class="cadastro"</liParams>
    <aParams>rel="subsection"</aParams>
</action>

Basicamente é isto, qualquer dúvida deixe um comentário!

Você gostou deste texto?

Compartilhe ele para que mais pessoas possam ler!
E me siga para ler mais conteúdo como este. ☻