Shopify リファレンス用の Klaviyo レビュー メタフィールド
このページで学べること
メタフィールドを使用して、サイト上の Klaviyo レビュー コンテンツをカスタマイズする方法をご覧ください。メタフィールドは、商品ページを含むサイト全体で使用するカスタム変数を保存するための Shopify のツールです。
このリソースは、開発者を対象としています。Shopify のメタフィールドを使用するには、Shopify のテンプレート言語である Liquid に関する知識が必要です。カスタマイズ可能なレビュー ウィジェットを使用すれば、コーディングなしでサイトにレビューを表示できます。
Shopify の Klaviyo レビューのメタフィールドは、デフォルトで有効になっています。WooCommerce ではメタフィールドは利用できません。
レビューのメタフィールドについて
メタフィールドを商品ページに直接挿入すると、メタフィールド内に保存されている変数が表示されます。商品ページに {{ product.metafields.reviews.rating.value }} を追加し、その商品の評価が 4.7 の場合、ページの読み込み時にメタフィールドの代わりに「4.7」が表示されます。
より複雑な作業にはメタフィールドも使用できます。これには、次の内容が含まれます：
- 他の Shopify アプリがサイト上で Klaviyo レビュー データにアクセスして使用できるようにする。
- 条件分岐を使用して、特定の評価の商品のコンテンツを動的に表示します。
- Klaviyo レビューの星評価ウィジェットを使用するのではなく、独自に星評価表示をコーディングします。
Shopify 商品メタフィールド定義ページでは、Klaviyo レビューのメタフィールドは 商品評価数 と 商品評価 という名前になっています。
テーマエディタでレビューのメタフィールドを追加する
テーマがメタフィールドの追加に対応している場合は、動的ソース アイコンを使用してレビューのメタフィールドを追加します。テーマ エディタを使用したレビューのメタフィールドの追加は、商品ページの商品情報セクションでサポートされています。
- 商品ページに移動します。
- テキストに対応しているフィールドを開く（または追加する）。
- 動的ソース アイコンを選択します。
- レビューのメタフィールドを選択します。
- [保存] をクリックします。
カスタム Liquid を使用してレビューのメタフィールドを追加する
次のメタフィールドは、商品ページおよび商品オブジェクト内（例：コレクションページの商品タイル内）で使用できます。これらは、商品オブジェクト外（例：About ページ）ではサポートされていません。
メタフィールド | コンテンツ | データ型 |
{{ product.metafields.reviews.rating.value }} | 商品の平均評価。 | 浮動小数点（例：3.5、4.7） |
{{ product.metafields.reviews.rating_count}} | 商品に送信された評価の数。 | 整数（例：10、45、721） |
{{ product.metafields.reviews.rating.scale_min}} | 最も低い評価（例：1）。 | 整数；常に 1 |
{{ product.metafields.reviews.rating.scale_max}} | 可能な最高評価（つまり 5）。 | 整数；常に 5 |
レビュー メタフィールドを無効にする
レビューのメタフィールドはデフォルトで有効になっています。メタフィールドを無効にするには：
- Klaviyo の レビュー タブに移動します。
- [レビューの設定] を選択します。
- [一般] を選択します。
- Shopify の Sync review metafields to Shopify と表示されている設定をオフに切り替えます。
- [変更を保存] をクリックします。
その他のリソース
- レビュー ウィジェットをカスタマイズする方法
レビュー ウィジェット（例：ストア上で商品レビューの表示と投稿を行うブロック）の外観をカスタマイズする方法を学びます。
- カスタム CSS を使用して Klaviyo レビューのウィジェットのスタイルを設定する方法
Klaviyo レビュー向けのカスタム CSS について、基本的なユースケースの実装方法を含めて学びます。より高度なユースケースについては、Klaviyo レビューのカスタム CSS に関する開発者向けリソースをご覧ください。ほとんどのウィジェットのカスタマイズはドラッグ＆ドロップエディターで実装できます。CSS が必要なのは高度なユースケースのみです。