メタオブジェクトに登録されたファイルの出力について

[Anonymous]

初投稿の質問になります。

◇質問

メタオブジェクトに登録されたファイルを、画像として.liquid内で表示させたいと考えております。

ですが「["gid://shopify/MediaImage/〇〇〇〇〇〇〇〇","gid://shopify/MediaImage/〇〇〇〇〇〇〇〇"]」

のようにファイルネームではなくgidで出力されるようで、

gidから画像を出力する方法を探したのですが見つけることができませんでした。

商品情報の場合、idからループで取得する方法があるみたいですが

assign products_obj = collections.all.products | where: 'id', product_id

ファイルのメディアの場合どのような記述になるかわからず苦戦しております。

上記になります、回答を頂けると幸いです。

よろしくお願いいたします。

[Jizo_Inagaki]

https://webutubutu.com/webdesign/10953

上記は私のブログ記事ですが、当時は以下のようなコードで出力可能だったはずです。

{% for file in product.metafields.hoge.fuga.value %}
  {% assign file_name = file | split: '/' | last %}
  <img src="{{ file_name | file_img_url: "150x" }}">
{% endfor %}

今現在試したわけではないので、うまくいかない場合はループ内で値をjsonフィルターなどで出力して加工方法を探れば対応可能だと思います。

[nanaironanaoto]

添付の画像をみたところ、メタオブジェクトの中のフィールドがリスト形式のようですので、

メタオブジェクトの中を走査するループの中で、

さらにリスト形式のフィールドを走査するループを組まなければきれいにいきません。

以下は、「メタオブジェクト内で登録した、リスト形式のproductオブジェクト」を出力するためのliquidです。ご参考になりますでしょうか。

メタオブジェクトネーム	item_ranking
商品(リスト)ネーム	item

{%- for object in shop.metaobjects.item_ranking.values -%}
  {%- assign product = object.item.value -%}
  {% for product in product %}
    <li>
      {% render 'card-product',
        card_product: product,
        media_aspect_ratio: section.settings.image_ratio,
        image_shape: section.settings.image_shape,
        show_secondary_image: section.settings.show_secondary_image,
        show_vendor: section.settings.show_vendor,
        show_rating: section.settings.show_rating,
        show_quick_add: section.settings.enable_quick_add,
        section_id: section.id
      %}
    </li>
  {%- endfor -%}
{%- endfor -%}

これを参考にすると、画像は以下のように出力可能だと思います。

{%- assign object_image = '' -%}
{%- for object in shop.metaobjects.メタオブジェクトのネーム.values -%}
 {%- assign icon= object.icon.value -%}
 {% for object_image in icon %}
  {{ object_image | image_url: width: 2000 | image_tag }}
 {%- endfor -%}
{%- endfor -%}

メタオブジェクトの出力方法について、文献が少ないように思います。

不明点あれば、Shopify構築のプリズムワークスにご相談ください！

https://prythmworks.tokyo