パートナー様の運営するサイトに下記指定のタグ及びスクリプトを設置いただくことで、LEEEPでイベントを集計することができます。
※ 2023年4月時点でのmakeshop管理画面における操作案内となります。
※ こちらのマニュアルはクリエイターモードをご利用されている前提となります。ベーシックモードをご利用されている場合はこちらのページをご確認ください。
LEEEP経由でコンテンツを表示したり、コンテンツの閲覧などのイベントを取得するために必要なタグになります。
makeshop管理画面の「メインメニュー > ショップデザイン > HTML編集」にアクセスします。利用中のデザインセットの編集画面へ移動します。
デザインセットの編集にて、商品詳細ページにあたるHTMLのheadタグ内に以下のコードを追加します。
重要：headタグ内の「<{$makeshop.head}>」より上に追加してください。
<script defer>
const leeep_product_id = '<{$item.system_code}>';
</script>こちらの「アクセス解析用のタグの設定」にある、「アクセス解析タグの入力（headタグ用）」に以下のコードを入力します。
重要：「site_id」はこちらより自身のIDを確認の上、「xxxxxxxxxxxxxxxx」を変更してください。
<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', _ => {
const productId = (typeof leeep_product_id !== 'undefined') ? leeep_product_id : '';
LeeepCite.init({site_id: 'xxxxxxxxxxxxxxxx', product_id: productId, uid: '[MEMBER_ID]'});
});
</script>LEEEP管理画面上で効果分析を行うために必要な注文データを取得するタグになります。
こちらの「コンバージョンタグの設定」画面にて以下、各項目の設定をお願いします。
出力設定：「出力する」にチェック
コンバージョンタグ名：「LEEEP計測タグ」
出力画面：「注文完了画面」を選択
出力箇所：「body直後」を選択
コンバージョンタグ設定（以下参照）
<script>
var leeep_products = [];leeep_products.push({
product_id: '[ITEM_CD_SYS]',
sku_code: '[ITEM_CD_SYS]',
sales_price: Number([ITEM_PRICE]),
quantity: Number([ITEM_COUNT]),
name: '[ITEM_NAME]',
});区切り文字：空白
重要：「site_id」はこちらより自身のIDを確認の上、「xxxxxxxxxxxxxxxx」を変更してください。
ParteTracking.order({
site_id: 'xxxxxxxxxxxxxxxx',
order_id: '[ORDER_NUM]',
products: leeep_products,
user: {
id: '[USER_ID]',
},
});
</script>LEEEP管理画面の「タグ一覧画面」にて発行いただいたタグの設置ガイドです。
トップページなど、タグ編集にて商品マクロを指定しないタグを設置する方法には、以下の2通りがあります。
makeshopの管理画面で「メインメニュー > ショップデザイン > HTML編集」にアクセスし、利用中のデザインセットの編集画面に移動してください。その後、LEEEP管理画面のタグ編集画面から、設置するタグをコピーします。
デザインセットの編集にて、トップページにあたるHTMLの投稿一覧を表示したい箇所にLEEEP管理画面のタグ編集でコピーしたタグを設置します。
掲載したい場所のURLとCSSセレクターを指定することで、ページの条件に一致する箇所にコンテンツを表示できます。
※最新のLEEEP共通タグがページに埋め込まれている必要があります。
商品詳細ページなど、タグ編集にて商品マクロを指定したタグを設置する方法には、以下の2通りがあります。
makeshopの管理画面で「メインメニュー > ショップデザイン > HTML編集」にアクセスし、利用中のデザインセットの編集画面へ移動してください。その後、LEEEP管理画面のタグ編集画面から、設置するタグをコピーします。
デザインセットの編集にて、商品詳細ページにあたるHTMLの投稿一覧を表示したい箇所にLEEEP管理画面のタグ編集でコピーしたタグを設置します。
重要：makeshopをご利用の場合、product_id: '__商品IDを指定__',の箇所をproduct_id: leeep_product_id,に書き換える必要があります。
また、このコードは"共通の商品詳細ページ"にあたるHTML内に1つ設置してください。
実装サンプル
<!-- 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: leeep_product_id,
});
});
</script>
<!-- LEEEP tag end -->掲載したい場所のURLとCSSセレクターを指定することで、ページの条件に一致する箇所にコンテンツを表示できます。
※最新のLEEEP共通タグがページに埋め込まれている必要があります。