はじめに
この記事は、Liquid オブジェクトについて日本語訳したものです。
linklist, location, mediaオブジェクトをまとめていきます。
linklist オブジェクト
linklistオブジェクトは、Shopifyの管理画面で「メニュー」と呼ばれているものです。
linklistオブジェクトの属性についてそれぞれ見ていきます。
linklist.handle
linklist.handleは、リンクリストのハンドルを返します。
リンクリストのハンドルは、管理画面のメニューの設定から確認・編集することができます。
handleについてはこちら。
linklist.levels
linklist.levelsは、リンクリストに含まれるネストされたレベルの数を返します。
例えば、以下のようなmain-manuのメニュー構造があるとします。
Main menu
└ Home
└ About Us
└ Locations
└ Fukuoka
└ Tokyo
{% assign menu = linklists.main-menu %}
{{ menu.title }}: {{ menu.levels }}
Main Menu: 3
linklist.links
linklist.linksは、リンクリスト内のリンクの配列を返します。
{% for link in linklists.main-menu.links %}
<a href="{{ link.url }}">{{ link.title }}</a>
{% endfor %}
<a href="/">Home</a>
<a href="/collections/all">Catalog</a>
<a href="/blogs/news">Blog</a>
<a href="/pages/about-us">About Us</a>
linklist.title
linklist.titleは、リンクリストのタイトルを返します。
location オブジェクト
locationオブジェクトを用いると、Liquidを使用してストアの位置情報にアクセスすることができます。
locationオブジェクトの属性についてそれぞれ見ていきます。
location.address
location.addressは、そのロケーションに対応するアドレスオブジェクトを返します。
location.id
location.idは、ロケーションのIDを返します。
location.latitude
location.latitudeは、そのロケーションに関連付けられた緯度を返します。住所が確認されていない場合はnullを返します。
location.longitude
location.longitudeは、そのロケーションに関連付けられた軽度を返します。住所が確認されていない場合はnullを返します。
location.name
lobation.nameは、ロケーションの名前を返します。
media オブジェクト
mediaオブジェクトは、product.media配列で返されるオブジェクトを表します。
mediaオブジェクトは、以下のオブジェクトタイプを表すことができる抽象オブジェクトです。
media filtersを使用して URL とモデルビューアタグを生成し、商品ページにメディアがレンダリングされるようにすることができます。
テーマでの製品メディアの使用についての詳細は、 Adding media to themesを参照してください。
mediaオブジェクトには以下の属性があります。
各メディアタイプに固有の属性もあります。これらの追加属性の詳細については、サポートされている各オブジェクトタイプのリファレンスを参照してください。
media.alt
media.altは、管理者の商品ページで設定したメディアのaltタグを返します。
media.id
media.idは、メディアのIDを返します。
media.media_type
media.media_typeは、オブジェクトのメディアタイプを返します。
media_typeプロパティを使用して、希望するタイプのすべてのメディアに対してproduct.media配列をフィルタリングすることができます。
{% assign images = product.media | where: "media_type", "image" %}
{% for image in images %}
{{ image.alt }}
{% endfor %}
Image of the black stroller
Image of the grey stroller
media.position
media.positionは、productオブジェクトのメディア配列内の特定のメディアオブジェクトの位置を返します。
media.preview_image
media.preview_imageは、メディアのプレビュー画像を返します。
終わりに
今回の記事はここまでになります。
お疲れ様でした。
Shopify アプリのご紹介
Shopify アプリである、「商品ページ発売予告アプリ | リテリア Coming Soon」は、商品ページを買えない状態のまま、発売日時の予告をすることができるアプリです。Shopify で Coming Soon 機能を実現することができます。