0

各カテゴリとサブカテゴリ名の横に小さな画像アイコンを配置したいと思います(カテゴリ名を画像に置き換えるのではなく、カテゴリ名の後に画像を配置するだけです)。私はすでに app/core/code/Mage/Catalog/Block/Navigation.php をオーバーライドしようとしました

_renderCategoryMenuItemHtml を変更した後、styles.css で category_id を参照して、コードがある場所に背景画像を追加しようとしていました

 $htmlLi .= '>';
$html[] = $htmlLi;

$html[] = '<a href="'.$this->getCategoryUrl($category).'"'.$linkClass.'>';
$html[] = '<span>' . $this->escapeHtml($category->getName()) . '</span>';
$html[] = '</a>';

$htmlLi .= '>';
$html[] = $htmlLi;

$html[] = '<a href="'.$this->getCategoryUrl($category).'"'.$linkClass.'>';
$html[] = '<span class="category_'.$this->getCurrentCategory()->getId().'">'.$this->escapeHtml($category->getName()).'</span>';
$html[] = '</a>';

しかし、仕事はしません。カテゴリ名の直後に小さなサムネイル画像を表示したいという方も多いのではないでしょうか。しかし、それを行うための簡単で簡単な方法を知りません。

どんな助けでも大歓迎です。ありがとう。

4

2 に答える 2

1

CSS の背景画像を使用しないのはなぜですか?

template/catalog/navigation/top.phtml をロードして、各レベルの < li > アイテムに新しいクラスまたは ID を追加します。おそらく次のようになります。

class="nav-<?php echo $_category->getName() ?>"

次に、これらのクラスを CSS に追加します。つまり、次のようになります。

.nav-shoes { background: url(images/nav-shoes.png) no-repeat; }

または、使用するすべての画像でスプライト画像を作成することもできます。

[class^="nav-"] { background: url(images/sprite.png) no-repeat; }
.nav-shoes { background-position: 10px 10px; }

次に、各画像について把握する必要があるのは、背景の位置だけです。

于 2012-04-12T23:13:21.257 に答える