thumbnail

カラーミーショップ

LEEEP2024-10-30

アプリではなく弊社側で個別にアカウント作成をさせていただいたサイトに関しては、以下の方法にてタグ設置を完了ください。

※カラーミーショップのアプリでLEEEPを利用されている方は、「1.共通タグ」「2.注文タグ」の作業は不要です。

集客 > 検索エンジン対策 > 検索エンジン対策の「headタグ内フリースペース設定」に共通タグを設置して更新してください。以下は設定の例となります。

重要:「site_id」はこちらより自身のIDを確認の上、「xxxxxxxxxxxxxxxx」を変更してください。

Plaintext
<script src="https://tracking.leeep.jp/v1/tracking/js"></script>
<script src="https://cite.leeep.jp/v2/embed/js" defer></script>
<script defer>
    ParteTracking.viewPage({site_id: 'xxxxxxxxxxxxxxxx'});
    document.addEventListener('DOMContentLoaded', _ => {
        LeeepCite.init({site_id: 'xxxxxxxxxxxxxxxx', product_id: Colorme.page === 'product' ? Colorme.product.id : null});
    });
</script>

※「PCショップ用の設定」「フィーチャーフォン向けショップ用の設定」「スマートフォンショップ用の設定」すべてに設置してください。


ツール > コンバージョンタグ > コンバージョンタグの「bodyタグ内設置」に注文タグを設置して更新してください。以下は設定の例となります。

重要:「site_id」はこちらより自身のIDを確認の上、「xxxxxxxxxxxxxxxx」を変更してください。

Plaintext
<script src="https://tracking.leeep.jp/v1/tracking/js"></script>
<script src="https://cite.leeep.jp/v2/embed/js" defer></script>
<script defer>
    ParteTracking.viewPage({site_id: 'xxxxxxxxxxxxxxxx'});
    document.addEventListener('DOMContentLoaded', _ => {
        LeeepCite.init({site_id: 'xxxxxxxxxxxxxxxx'});
    });
</script>

<script defer>
window.setTimeout(_ => {
    if (!ParteTracking) {
        console.error('ParteTracking is not defined');
        return;
    }

    // order
    const s = <{$order_products}>;
    ParteTracking.order({
        site_id: 'xxxxxxxxxxxxxxxx',
        uid: '<{$members_id}>',
        order_id: '<{$order_no}>',
        products: s.map(i => {
            return {
                product_id: '' + i.id,
                sku_code: '' + i.id,
                sales_price: i.price,
                quantity: i.quantity,
            };
        }),
    });
}, 10);
</script>


LEEEP管理画面の「タグ一覧画面」にて発行いただいたタグの設置ガイドです。

トップページなど、タグ編集にて商品マクロを指定しないタグを設置する方法には、以下の2通りがあります。

タグの掲載の箇所の「コードで埋め込む」にて発行されるHTMLコードをコピーし、ECサイト内のコンテンツを表示したい場所にあたるHTMLに貼り付けてください。

タグの掲載の箇所の「URLと位置を指定して掲載する」から、掲載したい場所のURLとCSSセレクターを指定してください。

※最新のLEEEP共通タグがページに埋め込まれている必要があります。

参照:CSSセレクタを確認する方法を教えてください。

商品詳細ページなど、タグ編集にて商品マクロを指定したタグを設置する方法には、以下の2通りがあります。

タグの掲載の箇所の「コードで埋め込む」にて発行されるHTMLコードをコピーし、ECサイト内のコンテンツを表示したい場所にあたるHTMLに貼り付けてください。

重要:カラーミーショップをご利用の場合、product_id: '__商品IDを指定__'の箇所をproduct_id: '<{ $product.id }>'に書き換える必要があります。

   また、このコードは"共通の商品詳細ページ"にあたるHTML内に1つ設置してください。

実装サンプル

Plaintext
<!-- LEEEP tag start -->
<script src="https://cite.leeep.jp/v2/embed/js" defer></script>
<div id="leeep-tag-xxxxxxxxxxxxxxxx"></div>
<script>
    document.addEventListener('DOMContentLoaded', _ => {
        LeeepCite.init({
            tag_id: 'xxxxxxxxxxxxxxxx',
            product_id: '<{ $product.id }>',
        });
    });
</script>
<!-- LEEEP tag end -->

タグの掲載の箇所の「URLと位置を指定して掲載する」から、商品ページ共通のURLとCSSセレクターを指定してください。

※最新のLEEEP共通タグがページに埋め込まれている必要があります。

参照:CSSセレクタを確認する方法を教えてください。