コンテンツにスキップ

futureshop へのタグ設置方法

概要

futureshop では、コマースクリエイターをご利用かどうかによってスクリプトタグの形式が異なります。ご自身の環境を確認してから、以下の手順で設置してください。

スクリプトタグとマーカータグの2つを商品詳細ページに追加してください。


設置手順

ステップ1: スクリプトタグを挿入する

storeId の値(下記コード内の YOUR_STORE_ID)は、AnyGift から発行されたストアIDに置き換えてください。

コマースクリエイターをご利用の場合

<script type="text/javascript">
    const productUrl = '{% product.url %}';
    const lastSlashIndex = productUrl.lastIndexOf('/');
    const productCode = lastSlashIndex !== -1 ? productUrl.substring(lastSlashIndex + 1) : productUrl;
    window.AnyGift = {
      productCode: productCode,
      storeId: 'YOUR_STORE_ID',
    };
</script>
<script defer src="https://d1ioo46r7yo3cy.cloudfront.net/store.js" charset="utf-8"></script>

コマースクリエイターを利用していない場合

<script type="text/javascript">
    window.AnyGift = {
      productCode: '{% product.url %}',
      storeId: 'YOUR_STORE_ID',
    };
</script>
<script defer src="https://d1ioo46r7yo3cy.cloudfront.net/store.js" charset="UTF-8"></script>

ステップ2: マーカータグを挿入する

eギフトの「ギフトとして贈る」ボタンを表示したい位置に、以下のマーカータグを挿入してください。

<div data-anygift="marker"></div>

通常は、商品の購入ボタンの近くに設置することを推奨します。


動作確認

設置が完了したら、ストアの商品詳細ページにアクセスし、「ギフトとして贈る」ボタンが表示されていることを確認してください。

設置に関してご不明な点は、AnyGift 担当者にご相談ください。