EC-CUBEの小技:amazonのような、全カテゴリ一覧ページの作製
カテゴリの複製
まず、以下の4ファイルを複製して、categoryをcategory2にしてしまいましょう。
/data/class/pages/frontparts/bloc/LC_Page_FrontParts_Bloc_Category.php
/data/class_extends/page_extends/frontparts/bloc/LC_Page_FrontParts_Bloc_Category_Ex.php
/html/frontparts/bloc/category.php
/data/Smarty/templates/default/frontparts/bloc/category.tplは、複製は複製ですが、管理画面から新規作成するようにしましょう。
複製の仕方は、4ファイルのソースに出てくる、categoryに数字の2をつけ足して行けばいいだけです。
最後に、データベースよりdtb_blocの複製したブロック部分のphp_pathをfrontparts/bloc/category2.php にして、複製完了です。
どこでもいいので設置してみましょう。同じカテゴリブロックが二つできた事でしょう。
カテゴリ一覧表示ページの作製、整形
管理画面より、デザイン管理>PC>ページ詳細設定にて、カテゴリページを新規作成しましょう。
名前も、URLもなんでもいいでしょう。
装飾は、他のページと同じようにしましょう。
ある程度は引っ張ってくるのがよいかと思います。
完成したら、レイアウト設定で、メインの下に新しく出来たカテゴリブロックを設置。
この段階で、できたわけではありません。
category2.tplファイルの修正を行います。
/data/Smarty/templates/default/frontparts/bloc/category2.tpl
以下のように修正
<!--{assign var=preLev value=1}-->
<!--{assign var=firstdone value=0}-->
<!--{section name=cnt loop=$arrTree}-->
<!--{* 表示フラグがTRUEなら表示 *}-->
<!--{if $arrTree[cnt].display == 1|| $arrTree[cnt].level <=99}-->
<!--{assign var=level value=`$arrTree[cnt].level`}-->
<!--{assign var=levdiff value=`$level-$preLev`}-->
<!--{if $levdiff > 0}-->
<ul>
<!--{elseif $levdiff == 0 && $firstdone == 1}-->
</li>
<!--{elseif $levdiff < 0}-->
<!--{section name=d loop=`$levdiff*-1`}-->
</li>
</ul>
<!--{/section}-->
</li>
<!--{/if}-->
<li class="level<!--{$level}--><!--{if in_array($arrTree[cnt].category_id, $tpl_category_id) }--> onmark<!--{/if}-->">
<a href="<!--{$smarty.const.ROOT_URLPATH}-->products/list.php?category_id=<!--{$arrTree[cnt].category_id}-->"<!--{if in_array($arrTree[cnt].category_id, $tpl_category_id)}--> class="onlink"<!--{/if}-->><!--{$arrTree[cnt].category_name|h}--></a>
<!--{if $firstdone == 0}--><!--{assign var=firstdone value=1}--><!--{/if}-->
<!--{assign var=preLev value=`$level`}-->
<!--{* セクションの最後に閉じタグを追加 *}-->
<!--{if $smarty.section.cnt.last}-->
<!--{if $preLev-1 > 0 }-->
<!--{section name=d loop=`$preLev-1`}-->
</li>
</ul>
<!--{/section}-->
</li>
<!--{else}-->
</li>
<!--{/if}-->
<!--{/if}-->
<!--{/if}-->
<!--{/section}-->
</ul>
あとはCSSでお好きなように装飾して下さい。
ブロックの複製さえできれば、なんとかなる技術でした。
以上。
