EC-CUBEの小技:amazonのような、全カテゴリ一覧ページの作製

この記事は最終更新日から1年以上が経過しています。
ECサイトを運営してますと、カテゴリが無尽蔵に増える事が、ままあります。
整理しようとして、階層を掘り下げれば、さらに増え、止め度がありません。

何より、これに迷惑をこうむるのが客でして、なんとかわかりやすく商品を見つけやすくと、するわけですが、それは誰もが思うところ。
そう思った結果が、この散らかり用です。

ただ、多いままで放置しては、一生みられる事のない商品も出てくるでしょう。
というわけで、便利というほどではないですが、あれば利用するであろう、カテゴリ一覧ページ。
amazonにもありますので、自分の所にも設置してしまいましょう。

カテゴリの複製

まず、以下の4ファイルを複製して、categorycategory2にしてしまいましょう。
/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_pathfrontparts/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でお好きなように装飾して下さい。

ブロックの複製さえできれば、なんとかなる技術でした。
以上。

Be the first to comment

Leave a Reply

Your email address will not be published.


*


このサイトはスパムを低減するために Akismet を使っています。コメントデータの処理方法の詳細はこちらをご覧ください