Liquid、JavaScriptなどに関する質問
こんにちは。
現在、無料テーマのStudioを使ってサイトを作っているところです。
表題の件、相談させてください。
商品数が多く、カテゴリごとに決まった商品説明文を入れているのですが
修正が発生した際に個々の商品ページを修正する手間を考えると
includeを利用し、修正時には元のファイルだけ手を加えればいい状態にしたいです。
最終的なゴールとしては、カテゴリごとに異なるテキストを読み込みたいのですが
その前段でつまずいているので、シンプルに
「商品ページに共通のテキストをincludeで読み込む方法」についてアドバイスいただけますと幸いです。
スニペットに「text.liquid」というファイルを作ったとします。
これが商品ページで読み込みたいincludeファイルになります。
text.liquidには、商品ページに表示させたい文章のみを記載しています。
これを、商品ページでincludeするために以下の記述が必要になるかと思います。
{% include ‘text’ %}
問題は、これをどのファイルのどこに記載すればいいのかがわからないことです。
セクションの中に「main-product.liquid」というファイルがあり
これに目星をつけて実際に上記を冒頭に記載したところ
商品ページでliquidのエラーが発生したという表示がありました。
エラーが出ているということは、少なくとも記述するファイルは「main-product.liquid」であっているということですよね?
であれば、なぜエラーが出てしまうのでしょうか。
フワッとした質問で恐縮ですが、ご教示いただけますと幸いです。
解決済! ベストソリューションを見る。
成功
ご質問いただいている、商品ページにテキストを入れたい件ですが、
includeを使用せずとも管理画面からカスタムliquidを設定することで、問題が解決するのではと思われます。
また、ご質問いただいているカテゴリはコレクションという認識で大丈夫でしょうか。
Shopify標準ではコレクションが分類の役割をしておりますので、コレクションの認識で説明させていただきます。
1.管理画面 > オンラインストア > カスタマイズからデフォルトの商品を選択してください
2.左メニュー商品情報の『ブロックを追加』よりカスタムLiquidを追加してください
3.追加したカスタムLiquidを表示させたい任意の位置へ移動してください
4.カスタムLiquidを開き下記サンプルソースを編集し追加してください
{% for collection in product.collections %}
{% if collection.title == 'サンプルコレクション1' %}
<p>サンプルコレクション1に属している商品へのテキスト</p>
{% elsif collection.title == 'サンプルコレクション2' %}
<p>サンプルコレクション2に属している商品へのテキスト</p>
{% elsif collection.title == 'サンプルコレクション3' %}
<p>サンプルコレクション3に属している商品へのテキスト</p>
{% endif %}
{% endfor %}
『サンプルコレクション1』『サンプルコレクション2』『サンプルコレクション3』は
コレクションのタイトルとなりますので、質問者様の各コレクション名に変更ください
実際に表示される文言は下記部分となりますので、こちらも任意の文章に変更してください
<p>サンプルコレクション1に属している商品へのテキスト</p>
<p>サンプルコレクション2に属している商品へのテキスト</p>
<p>サンプルコレクション3に属している商品へのテキスト</p>
ご参考まで。
(キュー小坂)
成功
ご質問いただいている、商品ページにテキストを入れたい件ですが、
includeを使用せずとも管理画面からカスタムliquidを設定することで、問題が解決するのではと思われます。
また、ご質問いただいているカテゴリはコレクションという認識で大丈夫でしょうか。
Shopify標準ではコレクションが分類の役割をしておりますので、コレクションの認識で説明させていただきます。
1.管理画面 > オンラインストア > カスタマイズからデフォルトの商品を選択してください
2.左メニュー商品情報の『ブロックを追加』よりカスタムLiquidを追加してください
3.追加したカスタムLiquidを表示させたい任意の位置へ移動してください
4.カスタムLiquidを開き下記サンプルソースを編集し追加してください
{% for collection in product.collections %}
{% if collection.title == 'サンプルコレクション1' %}
<p>サンプルコレクション1に属している商品へのテキスト</p>
{% elsif collection.title == 'サンプルコレクション2' %}
<p>サンプルコレクション2に属している商品へのテキスト</p>
{% elsif collection.title == 'サンプルコレクション3' %}
<p>サンプルコレクション3に属している商品へのテキスト</p>
{% endif %}
{% endfor %}
『サンプルコレクション1』『サンプルコレクション2』『サンプルコレクション3』は
コレクションのタイトルとなりますので、質問者様の各コレクション名に変更ください
実際に表示される文言は下記部分となりますので、こちらも任意の文章に変更してください
<p>サンプルコレクション1に属している商品へのテキスト</p>
<p>サンプルコレクション2に属している商品へのテキスト</p>
<p>サンプルコレクション3に属している商品へのテキスト</p>
ご参考まで。
(キュー小坂)
ありがとうございます。
ご教示いただいた方法でスムーズにできました。
大変恐縮ですが、被せる形で質問させていただきたいのですが
これはタグごとにテキストを出し分けることも可能なのでしょうか?
ご質問いただきましたタグでも出し分ける件ですが、
商品についているタグで出し分ける場合は、
下記コードのように追加いただければ、出し分けが可能です。
{% for tag in product.tags %}
{% if tag == 'サンプルタグ1' %}
<p>サンプルタグ1がついている商品へのテキスト</p>
{% elsif tag == 'サンプルタグ2' %}
<p>サンプルタグ2がついている商品へのテキスト</p>
{% elsif tag == 'サンプルタグ3' %}
<p>サンプルタグ3がついている商品へのテキスト</p>
{% endif %}
{% endfor %}
ご参考まで。
(キュー小坂)