カルーセルの PDP 実装

小型および中型ダイナミックカルーセル

次のいずれかを使用して、商品詳細ページ (PDP) の「カートに追加」ボタンの下に動的カルーセルを埋め込むことができます。 SKU ベース または プレイリストベース 統合。このガイドでは、両方のオプションについて説明します。

小型ダイナミックカルーセル - (カスタムコード — SKU またはプレイリスト)

このカルーセルはPDPに最適で、HTMLコードから直接埋め込むことができます。製品 SKU または固定プレイリストを使用して実装できます。

オプション 1: SKU ベースの統合

このメソッドは、表示されている商品のSKUに基づいてビデオを動的に表示します。

これは、動画に商品 SKU が正しくタグ付けされている場合にのみ機能します。

<script async type="text/javascript" src="//asset.fwcdn3.com/js/embed-feed.js"></script>

<いくつかの埋め込みフィード
チャンネル=「ファイヤーワーク・デポ」
sku= {{product.id}}
配置=「中間」
プレイヤープレースメント=「右下」
サムネイルスタイル=「ダイナミック」
属性サイズ =「小さい」
ui_asset_product_tag=「なし」
>
</fw-embed-feed>

• sku= {{product.id}}: PDP 上の製品 ID をタグ付き動画と動的に照合します
• ui_asset_product_tag=「なし」: サムネイルから製品アイコンを非表示にし、見やすいレイアウトにします。
• 属性サイズ=「小さい」:「カートに入れる」ボタンの下に収まるように視覚的なフットプリントを減らします

オプション 2: プレイリストベースの統合

• この方法では、固定プレイリストを使用し、複数のPDPで同じ動画を表示します。

<script async type="text/javascript" src="//asset.fwcdn3.com/js/embed-feed.js"></script>

<いくつかの埋め込みフィード
チャンネル=「ファイヤーワーク・デポ」
プレイリスト=「OE8BX5"
モード=「行」
オープンイン= "デフォルト」
最大動画数=「0"
配置=「中間」
プレイヤープレースメント=「右下」
サムネイルスタイル=「ダイナミック」
属性サイズ =「小さい」
</fw-embed-feed>>

中型ダイナミックカルーセル

これはShopify テーマカスタマイザーから直接追加できます。Firework Embed 設定から希望のカルーセルのレイアウトとサイズを選択するだけで、埋め込みコードを手動で挿入する必要はありません。

小型および中型カルーセル

小型カルーセル

カルーセルのサイズを小さく調整するには、 サイズ=「スモール」 HTMLコードへの小さなカルーセル用。

オプション 1: SKU ベースの統合

<script async type="text/javascript" src="//asset.fwcdn3.com/js/embed-feed.js"></script>

<いくつかの埋め込みフィード
チャンネル=「ファイヤーワーク・デポ」
sku= {{product.id}}
配置=「中間」
プレイヤープレースメント=「右下」
サイズ =「スモール」
ui_asset_product_tag=「なし」
>
</fw-embed-feed>

オプション 2: プレイリストベースの統合

‍<script async type="text/javascript" src="//asset.fwcdn3.com/js/embed-feed.js"></script>

<いくつかの埋め込みフィード
チャンネル=「ファイヤーワーク・デポ」
プレイリスト=「OE8BX5"
モード=「行」
オープンイン= "デフォルト」
最大動画数=「0"
配置=「中間」
サイズ =「スモール」
プレイヤープレースメント=「右下」
</fw-embed-feed>>

中型カルーセル

これはShopify テーマカスタマイザーから直接追加できます。Firework Embed 設定から希望のカルーセルのレイアウトとサイズを選択するだけで、埋め込みコードを手動で挿入する必要はありません。