メインコンテンツへスキップ

商品ページへのオプションウィジェットの設置（vintage themes）

  • 更新

対象：

  • Shopifyのvintage themesでCREMAレビューをご利用のマーチャント
  • Shopify Online Store 2.0をご利用の場合は、Shopify Online Store 2.0ガイドをご参照ください。
    • ご自身のテーマがどのバージョンか分からない場合は、Shopifyの案内をご確認ください。

 

本記事の内容

 

レビューカルーセル（Reviews Carousel）

  1. Shopify管理画面の「テーマ」メニューに移動し、[アクション → コードを編集] をクリックします。
  2. product.liquid を開き、{% section 'product-template' %} の下に以下のコードを追加し、[保存] をクリックします。
<div class="crema-product-reviews" data-product-code="{{ product.id }}" data-widget-style="horizontal_scroll"></div>

 

メディアグリッド（Media Grid）

  1. Shopify管理画面の「コードを編集（Edit Code）」メニューを開き、product.liquid を開きます。
  2. {% section 'product-template' %} の下に以下のコードを追加し、[保存] をクリックします。
<div class="crema-product-reviews" data-product-code="{{ product.id }}" data-widget-style="gallery"></div>

 

レビューボード（Reviews Board）

  1. Shopify管理画面の「コードを編集（Edit Code）」メニューを開き、product.liquid を開きます。
  2. {% section 'product-template' %} の下に以下のコードを追加し、[保存] をクリックします。
<div class="crema-product-reviews" data-product-code="{{ product.id }}" data-widget-style="board"></div>

 

ソーシャルメディアウィジェット（Social Media Widget）

  1. Shopify管理画面の**「コードを編集（Edit Code）」**メニューを開き、product.liquid を開きます。
  2. {% section 'product-template' %} の下に以下のコードを追加し、[保存] をクリックします。
<div class="crema-product-reviews" data-product-code="{{ product.id }}" data-widget-style="external"></div>

 

UGCプレビューウィジェット（UGC Preview Widget）

  1. Shopify管理画面の「コードを編集（Edit Code）」メニューを開き、product-template.liquid を開きます。
  2. {{ product.description }} の下に以下のコードを追加し、[保存] をクリックします。
<div class="crema-product-reviews" data-product-code="{{ product.id }}" data-widget-style="photo_thumbnail"></div>

 

ウィジェットの詳細については、ディスプレイウィジェットのショーケースページをご参照ください。

Vintage themes にCREMAウィジェットを設置する際にサポートが必要な場合は、
お気軽にチャットでお問い合わせいただくか、support.japan@cre.ma  までご連絡ください。

 

 

 

 

関連

関連記事