Shopifyの日付と時刻メタフィールドの使い方

Shopify2023.01.29

shopifyで用意されているメタフィールドの中に『日付と時刻』というものがあります。
この記事では日付と時刻メタフィールドの定義の仕方と出力の仕方を紹介していきます。

この記事の目次

日付と時刻メタフィールドの概要

日付と時刻を選択できるフィールドを定義するコンテンツタイプで日付を選べるカレンダーと30分刻みで時間を選ぶプルダウンメニューが表示される

タイプ	説明	値の例	値のタイプ	翻訳可能
date_time	推定タイムゾーンなしのISO 8601形式の日付と時刻	2022-01-01T12:30:00	string	no

メタフィールドの使い方はshopify本家の方で細かく紹介されていますのでこちらもおさえておくといいです

本家

コンテンツタイプで日付と時刻を選ぶと日付と時刻のメタフィールドを定義できる
一つの値と値のリストが選べる他、検証では最小と最大の日付と時刻を設定することができる
例では名前は日付と時刻、ネームスペースとキーはcostom.datetimeとしました

管理画面にクリックするだけでカレンダーから日付を選択できる入力欄と30分刻みで時間を選ぶプルダウンメニューが横並びに表示されます

値のリストを使って複数の値を使う場合はアイテムの追加をクリックすることで選択する日付と時刻を増やすことができる

日付と時刻のメタフィールドは保存した日付と時刻をYYYY-MM-DD形式の文字列で取得できるので、今回の例で定義した日付のメタフィールドを出力するコードは以下になります

{{product.metafields.custom.datetime }}

1	{{product.metafields.custom.datetime }}

また、dateフィルターを使うとRubyのstrftimeメソッドと同じパラメーターで日付と時刻をフォーマットすることも可能になっています

{{ product.metafields.custom.datetime | date: '%Y年%m月%d日 %H：%m' }}

1	{{ product.metafields.custom.datetime \| date: '%Y年%m月%d日 %H：%m' }}

値のリストを使って複数の値を出力する場合はforを使って処理することができますが、ネームスペースとキーの後に.valueをつけないと処理ができないようなので要注意

※値のリストのネームスペースとキーは『custom.datetime_list』に定義してあります

{% for date in product.metafields.custom.datetime_list.value %}
  {{ date | date: '%Y年%m月%d日 %H：%m' }}
{% endfor %}

{% for date in product.metafields.custom.datetime_list.value %}

{% endfor %}