カラーミーショップでカテゴリやグループの項目をリスト表示する
最終更新日: Update!!
先日クライアントワークでご相談いただき、初めて触ったということもあり備忘録を残しておこうと思います。タイトルの通り、カラーミーショップを使ったサイトで、カテゴリアーカイブの項目をリストで表示させます。
Smartyとは
SmartyはPHPのテンプレートエンジンで色々なサービスに採用されています。カラーミーショップではこのSmartyが採用されており、サイトに登録されている商品データなどを扱う際に使うことになります。Smartyを使ったカラーミーでは独自タグを記述することで商品情報などを出力できる仕組みになっています。Smartyでコンテンツをループ表示させる
まずは、コンテンツをループ表示させる基本の形を覚えておきます。Smartyのsectionタグを使います。sectionでループを開始し、if文のfirstでセクションのヘッダー部、lastでセクションのフッター部を出力します。このセクションヘッダーとセクションフッターの間にある部分がループ表示されます。 【sample.tpl】※一部抜粋<!-- ループセクション start --> <{section name=num loop=$group}> <!-- ループセクションヘッダー start --> <{if $smarty.section.num.first}> <ul> <{/if}> <!-- ループセクションヘッダー end --> <!-- ループ開始 --> <li><{$group[num].name}> </li> <!-- ループ終了 --> <!-- ループセクションフッター start --> <{if $smarty.section.num.last}> </ul> <{/if}> <!-- ループセクションフッター end --> <{/section}> <!-- ループセクション end -->sectionタグのloop属性にカテゴリーやグループなど表示対象となる値を指定することで、登録されている項目がリスト表示されます。
sponserd
keyword search
recent posts
- Shopifyでオリジナルテーマ制作やテーマカスタマイズで使えるTips #3
Shopifyでオリジナルテーマ制作やテーマカスタマイズで使えるTips #3
- Shopifyでオリジナルテーマ制作やテーマカスタマイズで使えるTips #2
Shopifyでオリジナルテーマ制作やテーマカスタマイズで使えるTips #2
- Shopifyでオリジナルテーマ制作やテーマカスタマイズで使えるTips #1
Shopifyでオリジナルテーマ制作やテーマカスタマイズで使えるTips #1
- ViteでReactとReact Routerを使ってみる
ViteでReactとReact Routerを使ってみる
- ViteでPugのコンパイル環境を導入する
ViteでPugのコンパイル環境を導入する
- ViteでMarkuplintとPrettierを使える環境を構築する
ViteでMarkuplintとPrettierを使える環境を構築する
- ViteでStylelintとESlintを使える環境を構築する
ViteでStylelintとESlintを使える環境を構築する
- マウスオーバーしたセルを含む行列がハイライトするテーブルを作成する:has()擬似クラスの活用例
マウスオーバーしたセルを含む行列がハイライトするテーブルを作成する:has()擬似クラスの活用例
categories