샵바이예시 코드들은 스크립트 동작을 보장하지 않습니다.
본 문서에서는 구글 태그매니저 적용 방법에 대해서 기입하지 않습니다.
상단 공통 스크립트는 샵바이 관리자페이지에서 아이디 값을 입력할 경우 자동으로 삽입 됩니다.
따라서, 샵바이 어드민에 아이디를 입력하여 저장한 경우에는 상단 공통 스크립트는 생략 하시면 됩니다.
<!-- 예시 코드 -->
<script
async
src="https://www.googletagmanager.com/gtag/js?id={{GA4 ID}}"
></script>
<script>
globalThis.dataLayer = globalThis.dataLayer || [];
function gtag() {
dataLayer.push(arguments);
}
gtag("js", new Date());
gtag("config", "{{GA4 ID}}"); // GA4, Stream ID로 변경해주세요
</script>
<!-- 예시 코드 -->
<script>
try {
if (sb.product) {
const {
baseInfo: { productNo, productName },
price: { salePrice, immediateDiscountAmt },
} = sb.product;
const gaViewItem = {
item_id: String(productNo),
item_name: productName,
price: salePrice - immediateDiscountAmt,
quantity: 1,
};
gtag('event', 'view_item', {
currency: 'KRW',
value: gaViewItem.price,
items: [gaViewItem],
});
}
} catch (error) {
console.error("An error occurred:", error);
}
</script>
<!-- 예시 코드 -->
<script>
try {
gtag("event", "sign_up", {
currency: "KRW",
value: 1,
});
} catch (error) {
console.error("An error occurred:", error);
}
</script>
<!-- 예시 코드 -->
<script>
try {
if (sb.cart?.deliveryGroups?.length > 0) {
function getGAViewCartInfo() {
const gaOrderProducts = sb.cart.deliveryGroups.flatMap(({ orderProducts }) =>
orderProducts.map((product) => {
const { productNo, productName, buyAmt, orderProductOptions } = product;
const quantity = orderProductOptions.reduce((sum, { orderCnt }) => {
sum += orderCnt;
return sum;
}, 0);
return {
item_id: productNo,
item_name: productName,
currency: 'KRW',
price: buyAmt,
quantity,
};
}),
);
const gaOrderPrice = gaOrderProducts.reduce((sum, cur) => {
sum += cur.price;
return sum;
}, 0);
return { gaOrderProducts, gaOrderPrice };
}
const { gaOrderPrice, gaOrderProducts } = getGAViewCartInfo();
if(gaOrderProducts.length > 0){
gtag('event', 'view_cart', {
currency: 'KRW',
value: gaOrderPrice,
items: gaOrderProducts,
});
}
}
} catch (error) {
console.error("An error occurred:", error);
}
</script>
<!-- 예시 코드 -->
<script>
try {
if (sb.order) {
const {
orderNo,
payInfo: { payAmt },
orderOptionsGroupByPartner,
} = sb.order;
const gaOrderItems = orderOptionsGroupByPartner.flatMap(({ orderOptionsGroupByDelivery }) =>
orderOptionsGroupByDelivery.flatMap(({ orderOptions }) =>
orderOptions.map((options) => {
const {
productNo: item_id,
productName: item_name,
price: { immediateDiscountAmt: discount, buyPrice: price },
orderCnt: quantity,
} = options;
return {
item_id:String(item_id),
item_name,
currency: 'KRW',
discount,
price,
quantity,
};
}),
),
);
gtag('event', 'purchase', {
transaction_id: orderNo,
value: payAmt,
currency: 'KRW',
items: gaOrderItems,
});
}
} catch (error) {
console.error("An error occurred:", error);
}
</script>