こんにちは、MakeShopのあらいです。
いつもMakeShopをご利用いただきありがとうございます。

今回はクリエイターモードで"カテゴリーツリー"を3~5階層目まで表示するソース例をご紹介します!
クリエイターモードで使えるタグはタグリファレンスをご確認ください。

クリエイターモード
"カテゴリーツリー"3を3~5階層目まで表示したい

設定例

まずはじめに、カテゴリーのソースをみていきましょう。

このソースまでが、登録されたカテゴリーを表示するための記述です。
(loop=くりかえしてカテゴリーを表示)

このソースは、そのカテゴリーが商品を持ってる(カテゴリーに商品が登録されている)時になかみを表示します。
ですので、

i=1階層目
j=2階層目
k=3階層目
・・・
と命名した場合、

このように記述をつないで下階層を増やすことができます。

・上記は続きアルファベットで命名しています。
※名前(文字)は任意です。

"カテゴリーツリー"3階層目まで表示するテンプレート

クリエイターモードのテンプレート【Advance】は、サイドメニューに、3階層目までカテゴリーが表示される記述が初期値に入力されています。

HTML編集初心者のショップ様は、【Advance】のテンプレート初期値のソースを適用するだけで、かんたんに表示できますのでご利用ください。

advance

HTML編集が可能なショップ様で、クリエイターモードの他のテンプレートをカスタマイズしたいショップ様は、【Advance】テンプレート内に入力されているソースを参考にしてみましょう。

【Advance】の場合:【独自デザイン】>【クリエイターモード】>【モジュール管理】

モジュール名「ナビゲーション」をクリック【モジュール編集】画面内に、以下のソースが入力されています。

▼HTML

・【独自デザイン】>【クリエイターモード】>【デザインセット一覧】で、【Advance】のデザインセットを追記してテンプレート全体のHTML・CSSを確認することができます。
※「ショップに適用」しなけければ、ショップに反映せずにソースを見ることができます。

"カテゴリーツリー"3~5階層目まで表示するソース例

他のテンプレートの場合の例をみていきましょう。
ここでは、【Debut】のカスタマイズソース例をみていきます。【Debut】は、ヘッダーにカテゴリーツリーがあるので、ヘッダー内を編集します。

【独自デザイン】>【クリエイターモード】>【モジュール管理】

モジュール名「ヘッダー」をクリックして【モジュール編集】画面を表示します。
入力例を参考に3~5階層目までを表示してみましょう。

▼HTML例

・ソースは一例となります。自由にデザインを調整して表示しましょう。
・ソースの作成・修正方法、最適なサイズなどの作り方についてはサポート対象外です。
・有償となりますが、ショップ制作代行サービスとして、おてがるリニューアルサービスをご紹介させていただきます。

クリエイターモードで、カテゴリーツリーを増やして表示したい場合にどうぞご参考ください。
それではまた!