お世話になっております。
質問させてください。
テーマは「debut」を使用しています。
ブログを２種類作成し、１つはデフォルトの表示、１つは写真のように表示させたいのですが、どのファイルをどのように変更すれば良いでしょうか？
ご存知の方がいらっしゃいましたら、教えていただけますと幸いです。
AI-generated summary
テーマ「debut」で、トップページ上のブログ最新記事をブログごとに異なる見せ方にしたいという相談。添付画像のようなレイアウトを、既定表示とは別に1つのブログだけ適用したいという内容です。
・提案された方法は2通りです。blog-template.liquid 内でブログごとに条件分岐する方法、または blog-template.liquid を複製して別テンプレート化し、blog.liquid 側で読み分ける方法です。
・分岐には Shopify の Liquid にある blogs / blog オブジェクトを使う案が示され、記事一覧を取得するコード例や公式ドキュメント、参考記事が案内されました。
・その後、質問者は「どのファイルのどこに挿入するか」が分からないと追加質問。回答では、実装内容が大きいため部分差し込みではなく、元の blog-template.liquid の前後で分岐するか、テンプレート全体を複製して改造する必要があると補足されています。
・最終的な完成報告はなく、方針は示されたものの実装は継続中です。
以下のいずれかでそれぞれ分岐させ、スクリーンショットのような状態になるようにコーディングすることになるかと思います。
- blog-template.liquid内で分岐させ、スクリーンショットのような内容を記載する
- blog-template.liquidを複製してスクリーンショットのような内容を記載し、blog.liquid内で読み込みを分岐させる
分岐に関しては以下ヘルプのblogsの箇所が参考になります。
https://shopify.dev/docs/themes/liquid/reference/objects
{% for article in blogs.myblog.articles %}
- {{ article.title | link_to: article.url }}
{% endfor %}
加えて、私のブログで恐縮ですが以下なども参考になるかもしれません。(ブログのハンドル部分)
https://webutubutu.com/webdesign/8828#toc_H3-2
スクリーンショットの内容を具体的にどう作るのかはblog-template.liquidや以下のblog objectのヘルプなどが手掛かりになると思います。
https://shopify.dev/docs/themes/liquid/reference/objects/blog
jizo様、丁寧な返信をありがとうございます。
教えていただいたブログなどを参照し、どのようにコードを書いたら良いのかは分かりました。
しかし、大変お恥ずかしいのですが、ファイル内のどの部分にコードを挿入したら良いのか分かりません。
大変恐縮ですが教えていただけますと幸いです。
記載箇所は作り方によってかわりますのでなんとも言えない状態ですが、ご希望のコードはセクションを丸ごと作る必要があると思われるため以下のいずれかになるかと思います。
- blog-template.liquid内で分岐させる場合、元のコードの前後
- blog-template.liquidを複製し改造して用いる場合、そのファイル丸ごと
jizo様、初歩的な質問にも丁寧にお答え下さって感謝申し上げます。
まだ上手く実装できていませんが、頑張ってみます。
本当にありがとうございました。