[Shopify]ショートコード
Other
2022.01.06
Other
2022.01.06
この記事をシェアする
メタフェイズではShopifyを利用したストア構築を行っています。
今回はショートコードを設定する方法を紹介いたします。
ショートコードはブログ記事内やページ内で特定の記述をすると任意のコードを呼び出せる機能です。ブログ記事で商品を紹介する際などにデザインされたレイアウトを表示したいときに使います。
https://github.com/culturekings/shopify-shortcodesからファイルを取得します。
snippetsフォルダへ下記2ファイルを配置します。
・shortcode.liquid
・shortcode-render.liquid
内容はサンプルとして下記を記述して下さい。
{%- capture product_handle -%}{%- include 'shortcode-render' render:'handle' default:'' -%}{%- endcapture -%} {%- paginate collections.all.products by collections.all.all_products_count -%} {%- for tmp in collections.all.products -%} {%- if tmp.handle == product_handle -%} {%- assign product = tmp -%} {%- break -%} {%- endif -%} {%- endfor -%} {%- endpaginate -%} {% if product -%} <section> {%- for image in product.images -%} <figure class="image"><img src="{{ image | img_url:'162x' }}" alt="{{ image.alt | escape }}"></figure> {%- break -%} {%- endfor %} <h2 class="name nameCell">{{ product.title | escape }}</h2> </section> {%- endif %}
{% include 'shortcode' load:article.content %}
xxxxの部分は商品ハンドル
[product_in_blog handle="xxxx"]
ブログ記事の上記コードの部分が「snippets/shortcode-product_in_blog.liquid」の内容に変換されます。
Shopifyを利用したストアの構築・運用のご相談はお問い合わせフォームより受け付けております。
この記事をシェアする