これまで3回のエントリ

でMagentoのレイアウトXMLについて解説してきました。

このエントリでは具体的なカスタマイズ例を紹介したいと思います。

top.Linksで生成するliタグにclassをつけるには

まずはレイアウト定義を見る

headerブロックに定義されている、top.Linksブロックは以下のように定義されています。


これを見ると、このブロックは、Mage_Page_Block_Template_Linksクラスを使用していることがわかります。
そして、このブロックにリンクを定義する定義は、




My Account


1

のように書かれています。
つまり、リンクを追加しているメソッドは、 addLink だということです。

Blockクラスの定義を確認する

では、addLink の定義はどうなっているかというと・・・。

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

となっています。

この定義を見ると、 $liParams と $aParams という引数があることがわかります。
どうやらこの2つの引数に値を与えると、 li タグと a タグに何か変化が起きるようです。

さらに処理を読んでいくと、 _prepareParams というメソッドで、与えた引数の内容を処理していることがわかります。
このメソッドでは、配列として与えた引数を、キーと値に分解し、「=」で連結した、タグの属性に組み立てています。
(文字列の場合はそのまま処理します) 

つまり、 $liParams と $aParams に値を与えれば、それが li タグと a タグの属性になるということですね。

実際にやってみる

では、実際にやってみましょう。
マイアカウントのリンクを定義している、customer.xmlのdefaultハンドルにある、




My Account


10

に変更を加えてみます。
さきほどの addLink メソッドの定義に従って、パラメータのタグを追加します。完成形は以下のとおりです。




My Account


10

customer


liParams タグを追加し、その子要素として、 id タグを追加しています。
保存して、Magentoのレイアウト定義とブロックHTML出力キャッシュを更新すると、マイアカウントへのリンクがあるタグが以下のように変わります。

  • マイアカウント
  • li タグに id 属性が追加されていますね。
    class 属性は残念ながら、テンプレーに直書きされているので、追加することはできませんが、id 属性はこのように定義することで、デザインカスタマイズしやすいようにHTMLを変更することができます。
    もちろん、 urlParams や aParams を使えばさらに細かいことができるようになるでしょう。是非活用していきましょう。