新機能として Dynamic Embed Code（ダイナミック埋め込みコード） が利用できるようになりました！
これにより、特定の商品にタグ付けされたメディアを自動的に表示できるようになります。たとえば、ECサイトの商品ページごとに異なるUGC（ユーザー生成コンテンツ）を見せたい場合、これまでは商品ごとに別々のウィジェットを作成する必要がありましたが、この機能を使えば1つのウィジェットで対応可能です。
この機能は次のような方に特におすすめです。
複数の商品ページを管理している場合
ひとつのウィジェットを複数のページで再利用したい場合
柔軟かつスケーラブルな運用を求めている場合
それでは、具体的な使い方を順番にご紹介します。
Dynamic Embed Code（ダイナミック埋め込みコード） を使用には、GoogleショッピングやSquareを通したシステムへの商品連携やCSVファイルでの商品アップロードなど、ID情報を含む事前準備を済ませておくことが必要です。
詳しくはチャットからCSチームまでお問い合わせくださいませ。
ダイナミック埋め込みコードの使い方
1.「Widgets（ウィジェット）」セクションに移動し、商品タグ付きのメディアが含まれているウィジェットを開きます。
2. 左側のサイドバーから「埋め込み」タブをクリックし、標準の埋め込みコードの下にある「Dynamic Embed Code（ダイナミック埋め込みコード）」セクションまでスクロールして、「コードを生成」をクリックします。
コードを生成すると、2つの方法から選択できるオプションが表示されます。
オプション1：手動でのプロダクトID置き換え
この方法は、開発者や動的なウェブサイトを運用している方に最適です。
すでにコードベースやCMS内に product_id の値がある場合に、それを利用して各商品ページに対応するメディアを読み込むことができます。
使い方：
「Dynamic Embed Code」をコピーします。
コード内の {{ product_id }} を、カタログに登録されている実際のプロダクトIDに置き換えてください。
例：下記コードの {{ product_id }} を、自社の商品IDに修正してご利用ください。
<div class="embedsocial-hashtag" data-ref="89ba5783c3e106b63db926f16b1de76cee4b251a" data-productId="{{ product_id }}"></div> <script> (function(d, s, id) { var js; if (d.getElementById(id)) {return;} js = d.createElement(s); js.id = id; js.src = "https://embedsocial.com/cdn/ht.js"; d.getElementsByTagName("head")[0].appendChild(js); }(document, "script", "EmbedSocialHashtagScript")); </script>
最後に、修正したコードを自社サイトの該当する商品ページに貼り付けてください。これで、その商品に関連するUGCが自動的に表示されるようになります。
JavaScript や CMS のテンプレート機能を使えば、URLやページのメタ情報から商品IDを動的に取得して差し込むこともできます。
オプション2：アップロード済みの商品カタログから選択
コードを編集したくない場合は、アップロード済みの商品カタログから直接商品を選択する方法が最適です。
利用手順
Dynamic Embed（ダイナミック埋め込み） パネルに移動します。
アップロード済みのカタログを選択し、表示させたい商品の一覧から対象の商品を選びます。
埋め込みコードは、自動的に正しい data-productId が反映されます。
2. あとは、その埋め込みコードをコピーして、対象の商品ページに貼り付けるだけです。
