Shopifyで値を返す関数のようにrenderを用いる方法:メモ

窓辺

Shopify特有の無理やり感はありますが、多少はコードをスッキリさせることは可能なのでメモとして。

実現したいこと

  • Shopifyのrendersnippets内に専用のファイルをつくり、他言語の関数のように用いる

サンプル

  • snippets内にreturn.liquidという名称でliquidファイルを作成する

上記の前提で以下サンプルです。

任意の値を返す


{%- liquid
  assign handle = ''
  case request.page_type
    when "product"
      assign handle = product.handle
    when "article"
      assign handle = article.handle
    when "collection"
      assign handle = collection.handle
    when "page"
      assign handle = page.handle
  endcase
-%}
{%- if handle != blank -%}
{{ handle }}
{%- endif -%}

return.liquidに上記のようなコードを書き、呼び出し側では下記のように用います。


{%- capture handle -%}{%- render 'return' -%}{%- endcapture -%}
{%- if handle !=blank -%}
何かしらの処理
{%- endif -%}

上記例は実用的なものではありませんが、「文字列を返す」という動作を実行させている状態なので使い方次第では有用だと思います。

真偽値もどきを返す


{%- liquid
  assign flag = false
  if request.page_type == page_type
    assign flag = true
  endif
-%}
{{- flag -}}

return.liquidに上記のようなコードを書き、呼び出し側では下記のように用います。


{%- capture is_target -%}{%- render 'return', page_type: "product" -%}{%- endcapture -%}
{%- if is_target == "true" -%}
何かしらの処理
{%- endif -%}

上記は「指定したページタイプ(サンプルではproductを指定)であればtrueを返す」という単純なサンプルです。

renderの結果は文字列で出力されるため、return.liquid内の最終的な出力内容をbooleanに基づく文字列で返しています。

このサンプル自体は実用的ではありませんが、セクション作成時に「テーマエディタ内の複数の値に基づく判定を返す」などの用途にも使えます。

参考

結び

複数回同じコードを書く必要がなくなるので、多少楽になるかなと思います。

今回のサンプルのみでは実用的な感じはないと思いますが、判定用コードが長く複雑になればなるほど有益度が高まるはずです。
配列(カンマ区切りの文字列)を返す前提であれば、renderで複数の処理による複数の実行結果を返すことも可能です。

もっとも、複雑な入力値を設定するのは常にセクション側なので、残念ながらその部分はどうしても残ってしまい片手落ちという状況ですが。

1人がこの記事を評価

役に立ったよという方は上の「記事を評価する」ボタンをクリックしてもらえると嬉しいです。

連投防止のためにCookie使用。SNSへの投稿など他サービスとの連動は一切ありません。

コメント欄