EC-CUBEの小技:商品一覧ページをカテゴリごとに画像で装飾
この記事は最終更新日から1年以上が経過しています。
2ファイルにコードをちょろっと付け足すだけ
紹介の前に、この情報元を紹介いたします。
[EC-CUBE 2.11.4] 商品一覧ページにカテゴリごとのタイトルバナー画像を入れる | NAKWEB × EC-CUBE
とてもわかりやすくまとめて頂いております。
色々と便利なものもあるので、今後も参考にさせて頂きたいな、と。
なので、あっちを見てしまえば済むのですが、念のため。
1.画像の準備
試しに設置例を作ったので、ごらんあれ
戯れ問答・ECサイト / 数字
これはサイズが765×160pxでつくってあるのですが、でかすぎる気もしますし、無難な大きさであるともいえます。
※現在、設置例は封鎖しております。
画像を作るときは、そのカテゴリのIDと同じ番号の画像を作りましょう。
ちなみに、設置例のカテゴリIDは7で、画像は7.jpgでした。
あとはhtml/user_data/packages/default/img/banner のディレクトリへ画像を放り込むだけで準備完了。
2.コードの書き足し
data/class/pages/products/LC_Page_Products_List.php
78行目付近 init() 内に追加
// カテゴリタイトルバナーを表示したいカテゴリIDを定義(例えばIDが1と2の場合) $this->arrBannerCategoryId = array(1,2); </code> <strong>data/Smarty/templates/default/products/list.tpl</strong> 128行目付近<!--▲ページナビ(本文)-->の下 <code lang="php"> <!--▼カテゴリーTOPバナー--> <!--{foreach from=$arrBannerCategoryId item=banner_category_id}--> <!--{if $smarty.get.category_id == $banner_category_id}--> <img src="<!--{$TPL_URLPATH}-->img/category_img/<!--{$smarty.get.category_id|h}-->.jpg" alt="カテゴリタイトルバナー" id="" name="" /> <!--{/if}--> <!--{/foreach}--> <!--▲カテゴリーTOPバナー-->
以上です。
これのいいところはデータベースをいじらなくてもカテゴリごとに画像を追加できることですね。
やはり、データベースに手を加えるのは不安がありますしね。
しかし、初心者に画像をここにアップロードしてとは、難しいところなので、管理画面から追加する方法を次回は紹介します。