Shopifyのメタフィールドのリスト

2022.6末のEditions 2022にて、各メタフィールドのタイプにリスト形式が追加されましたので、現時点での調査内容などをメモ的に。
推測に基づく部分があるため、読まれる方はその点了承ください。

[追記:2022.7.5]
ドキュメント内にリストタイプの出力に関する項目を見つけたので内容を修正。

概要

• Shopify Editions: Connect to Consumer (2022年夏) – Shopify 日本
• Metafield lists · Shopify Help Center

以下のような各タイプでメタフィールドにリスト形式でデータを設定できるようになりました。

• text fields
• numbers
• color
• url
• weight
• volume
• dimension
• rating
• date
• date and time

以前はjsonタイプやtextタイプに配列変換用文字列を入れるなどで対応できましたが、不便もあったのでかなり便利になります。

個人的には以下のように運用時のメリットが大きいと感じました。

• 同種の内容を1つのメタフィールドに簡単に登録できる
• 登録内容が見やすい状態で操作できる
• 管理画面内で各要素をドラッグして順番変更ができる

出力方法

• Liquid objects

First item in list: {{ product.metafields.information.pickup_locations.value[0] }}
Last item in list: {{ product.metafields.information.pickup_locations.value.last }}

{% for location in product.metafields.information.pickup_locations.value -%}
  {{ location }}
{%- endfor %}

上記で出力可能です。

ただし現時点でコンテンツタイプがファイルでリストタイプを選んだ場合(管理画面では「ファイルのリスト」や「ファイル(リスト)」のような表記になる)、上記出力用コードは正常に動作しない模様です。

ファイルのリスト

• Metafield lists · Shopify Help Center

当記事公開時点(2022.7.5)で、上記ドキュメントにはファイルのリストタイプの記述がありませんが、利用可能です。

同一のものであるという確信はありませんが、APIとしては一応list.file_referenceの項目が存在します。

• Metafield types

現時点での「ファイルのリスト」の問題点

• インデックス番号やlastフィルターでのアクセスはできない(値が出力されない)

ファイルは他のタイプとは違う状態であり、Shopifyのサポートのからの返答には以下のように書かれていました。

ファイルリストは商品メタフィールドのリファレンスリストとみなされる

後述しますが、ファイルのリストの中身はgidの配列であることが確認できます。

ファイルのリストタイプに関する過去情報を見る

※2022.7.15にShopifyサポートから連絡があり、以下の問題の原因となっていたエラーを特定し解消できたという連絡を受けました。

現時点での「ファイルのリスト」の問題点

• 管理画面でドラッグによる順番変更を行なっても、出力に反映されない
• 出力はファイルへの登録順で、古いもの方取り出される。

順番変更に関しては仕様という返答ですが、インデックス番号に関しては、「コーディングに関するお問い合わせ」に属するためサポート対象外となり、使用なのかどうなのかは不明です。

• 機能へのアクセスが可能な状態ではあるが、公式のリリースは発表していない
• 「ファイルのリスト」使用における公式のドキュメントはなく、公開の予定もなく、発表時期についても伝えられない
• 「ファイルのリスト」は誤って公開されたわけではなく、他のコンテンツタイプと同様に正規の機能として使用できる
• 「ファイルのリスト」はドラッグによる並び替えに対応していない

出力順序

あくまで確認している範囲ではですが以下の通り。

• 登録の昇順(古→新)
• reverseフィルターで反転は可能
• sortフィルターでsrcを指定することでファイル名順で出力可能(ファイル名の前についているパスの規則性が今後も変更されない前提であれば)

ファイル名に規則性を持たせることで出力順序を操作できますが、原始的というか、もっとどうにかならないのかなというのが正直なところです。

画像を出力するサンプルコード

//image_urlを使う方法
{% for file in product.metafields.hoge.fuga.value %}
  <img src="{{ file | image_url: width: 150 }}">
{% endfor %}

// 以前は上記の方法が使えず以下を使用
{% for file in product.metafields.hoge.fuga.value %}
  {% assign file_name = file | split: '/' | last %}
  <img src="{{ file_name | file_img_url: "150x" }}">
{% endfor %}

上記のような感じでメタフィールドの値を利用した画像出力が可能でした。

「ファイルのリスト」の中身

Metafields Guruで確認したところ以下のような内容でした。

["gid://shopify/MediaImage/000000001","gid://shopify/MediaImage/000000002","gid://shopify/MediaImage/000000003"]

ちなみに当記事公開時点では、Metafields Guruで選べる種類の中に「ファイルのリスト」がなく、今回確認した他「ファイルのリスト」の箇所のアイコンが黒い四角になっていましたので、Metafields Guruは「ファイルのリスト」に対応していない模様です。

「ファイルのリスト」の中身の要素数

ファイルのリストにはsizeフィルターが使えず、要素数をカウントするには別の方法を用いる必要があります。

• list.product_reference.size · Issue #1589 · Shopify/liquid

上記ページで紹介されている以下2つの方法で要素数を取得できます。

upon till today this is still an issue, i.e. metafields of type list is not an array either has a size method.
Following works for now, i.e. manually converting it into an array of strings, then use its size.

{% assign productIngredients = product.metafields.custom.ingredient_details.value %}
{% assign productIngredientsArray = product.metafields.custom.ingredient_details | split: ',' %}  // might want the uniq filter too
{% assign productIngredientsTotal = productIngredientsArray.size %}

1つ目はsplitフィルターで配列に変換し、そのあとでsizeで要素数を取得します。

• Liquid objects
  ※おそらくこのページが該当

Returns a value only for boolean and list type filters. Returns nil for price_range type filters.

2つ目はcountを用いる方法ですが、countに関してはまだ把握しかねています。

翻訳への対応

• Metafield types

上記ページはAPIのドキュメントですが、翻訳への対応が記載されており、以下のような状態でした。

• シングルタイプ(リストではない単一データのタイプ)のいくつかは翻訳に対応している
• リストタイプは全て翻訳に対応していない

つまり、リストで登録したテキストに関しては翻訳不可となるようです(実際に操作しての確認はしていません)。

結び

メタフィールドのリストは便利な機能だと思います。