有用戶反饋更新后不行，BUG已修復，主要是第三部分File Name不能亂動~
這次代碼做了很大的更新，方便大家通過GA4收集更多的數據。不管是新朋友還是老朋友，只需查看最新的這篇文章即可，老朋友只需要更新代碼即可。
代碼更新內容：
代碼更新了，修復了和產品目標相關的小問題
Sh_info event增加了?User?type,?content?type,?customer?id,?last?order?date,?total?order?quantity,?total?expenditure,?and?customer?tag?fields
增加了新的產品變量：productSku, productType, productVariantId, productVariantTitle and currency.
增加了新的交易變量：orderItemsSku, orderItemsvariantId, orderItemsvariantTitle,orderItemsCategory,orderItemsBrand,orderItemsType
為多貨幣的商店增加了貨幣匯率和靜態訂單金額變量：totalValueStatic, currencyRate.
根據Shopify的結賬流程，如果OrderID字段是空的，transaction_id字段被調整為傳輸結賬ID。
-
Item?data(line_item)會根據checkout?對象修改
1. 注冊GTM:?https://tagmanager.google.com
粘貼GTM?code在shopify?theme.liquid?&?checkout
找到GTM追蹤代碼：
回到Shopify粘貼在theme?liquid和checkout頁面
Shopify——Theme——Actions下拉選擇Edit?Code
shopify——Setting——Checkout——Additional?scripts處填充
2.粘貼Shopify?dataLayer?(Checkout?-?Purchase)?2.1版本
目的：通過以下代碼可以讓GTM讀取和處理。該代碼塊包括以下變量：購買的產品、頁面類型、貨幣、運輸價格、總價、稅價、支付類型和交易ID。我們能夠把所有這些數據傳遞給Google Ads、Facebook Pixel、Google Analytics 4和其他你想分享的各方。
如下在checkout?GTMcode下面
*********************************START*********************************
{%?assign?template_name?=?template.name?%}
<script?type="text/javascript">
window.dataLayer?=?window.dataLayer?||?[];
window.appStart?=?function(){
??window.allPageHandle?=?function(){
????window.dataLayer.push({
??????event:?"ga4kit_info",
??????contentGroup:?"{{?template_name?}}",
??????{%?if?customer?%}
??????userType:?"member",
??????customer:?{
????????id:?"{{-?checkout.customer.id?|?json?-}}",
????????lastOrder:?"{{-?customer.last_order.created_at?|?date:?'%B?%d,?%Y?%I:%M%p'?-}}",
????????orderCount:?"{{-?checkout.customer.orders_count?|?json?-}}",
????????totalSpent:?"{{-?checkout.customer.total_spent?|?times:?0.01?|?json?-}}",
????????tags:?{{-?checkout.customer.tags?|?json?-}}
??????}
??????{%?else?%}
????????userType:?"visitor",
??????{%?endif?%}
????});
??};
??allPageHandle();
{%?if?first_time_accessed?and?post_purchase_page_accessed?!=?true?%}
??var?shippingPrice?=?"{{shipping_price?|?money_without_currency?}}".replace(",",?".");
??var?totalPrice?=?"{{checkout.total_price?|?money_without_currency?}}".replace(",",?".");
??var?taxPrice?=?"{{tax_price?|?money_without_currency?}}".replace(",",?".");
??var?orderItemsName?=?[];
??var?orderItemsId?=?[];
??var?orderItemsCategory?=?[];
??var?orderItemsBrand?=?[];
??var?orderItemsType?=?[];
??var?orderItemsPrice?=?[];
??var?orderItemsSku?=?[];
??var?orderItemsvariantId?=?[];
??var?orderItemsQuantity?=?[];
??var?orderItemsvariantTitle?=?[];
??var?totalQuantity?=?0;
??{%?for?line_item?in?checkout.line_items?%}??
??????orderItemsName.push("{{?line_item.product.title?|?remove:?"'"?|?remove:?'"'}}");
??????orderItemsId.push("{{?line_item.product_id?}}");
??????orderItemsPrice.push("{{?line_item.price?|?times:?0.01?}}");
??????orderItemsSku.push("{{?line_item.sku?|?remove:?"'"?|?remove:?'"'?}}");
??????orderItemsQuantity.push("{{?line_item.quantity?}}");
??????orderItemsvariantId.push("{{?line_item.variant_id?}}");
??????orderItemsvariantTitle.push("{{?line_item.variant.title?}}");
??????orderItemsCategory.push("{{?line_item.product.collections.last.title?|?remove:?"'"?|?remove:?'"'?}}");
??????orderItemsBrand.push("{{?line_item.vendor?|?remove:?"'"?|?remove:?'"'?}}");
??????orderItemsType.push("{{?line_item.product.type?|?remove:?"'"?|?remove:?'"'?}}");
??????totalQuantity?+=?{{?line_item.quantity?}};
??{%?endfor?%}
??window.dataLayer.push({??
??????page_type:?"purchase",
??????event:?"analyzify_purchase",
??????currency:?"{{?shop.currency?}}",
??????totalValue:?totalPrice,
??????totalValueStatic:?totalPrice,
??????currencyRate:?window.Shopify.currency.rate,
??????shipping:?shippingPrice,
??????tax:?taxPrice,
??????payment_type:?"{{order.transactions[0].gateway}}",
??????{%?if?order.name?%}
??????transaction_id:?"{{order.name?|?remove:?"'"?|?remove:?'"'}}",
??????{%?else?%}
??????transaction_id:?"{{checkout.id?|?remove:?"'"?|?remove:?'"'}}",
??????{%?endif?%}
??????productName:?orderItemsName,
??????productId:?orderItemsId,
??????productBrand:?orderItemsBrand,
??????productCategory:?orderItemsCategory,
??????productVariantId:?orderItemsvariantId,
??????productVariantTitle:?orderItemsvariantTitle,
??????productSku:?orderItemsSku,
??????productType:?orderItemsSku,
??????productPrice:?orderItemsPrice,
??????productQuantity:?orderItemsQuantity,
??});
{%?endif?%}
}
appStart();
</script>
************************************END**********************************
3. 粘貼Shopify?Product?View?Data?Layer
點擊Theme，打開Snippets,然后添加File name：?analyzify-product-datalayer
粘貼以下代碼然后保存
*************************************START*******************************
{%?assign?template_name?=?template.name?%}
<script?type="text/javascript">
window.dataLayer?=?window.dataLayer?||?[];
window.appStart?=?function(){
??window.productPageHandle?=?function(){
????var?productName?=?"{{?product.title?|?remove:?"'"?|?remove:?'"'?}}";
????var?productId?=?"{{?product.id?}}";
????var?productPrice?=?"{{?product.price?|?money_without_currency?}}";
????var?productBrand?=?"{{?product.vendor?|?remove:?"'"?|?remove:?'"'?}}";
????var?productCollection?=?"{{?product.collections.first.title?|?remove:?"'"?|?remove:?'"'?}}";
????var?productType?=?"{{?product.type?|?remove:?"'"?|?remove:?'"'?}}";
????var?productSku?=?"{{?product.selected_or_first_available_variant.sku?|?remove:?"'"?|?remove:?'"'?}}";
????var?productVariantId?=?"{{?product.selected_variant.id?|?default:?product.variants[0].id?}}";
????var?productVariantTitle?=?"{{?product.selected_variant.title?|?default:?product.variants[0].title?}}";
????window.dataLayer.push({
??????event:?"analyzify_productDetail",
??????productId:?productId,
??????productName:?productName,
??????productPrice:?productPrice,
??????productBrand:?productBrand,
??????productCategory:?productCollection,
??????productType:?productType,
??????productSku:?productSku,
??????productVariantId:?productVariantId,
??????productVariantTitle:?productVariantTitle,
??????currency:?"{{?shop.currency?}}",
????});
??};
??window.allPageHandle?=?function(){
????window.dataLayer.push({
??????event:?"ga4kit_info",
??????contentGroup:?"{{?template_name?}}",
??????{%?if?customer?%}
??????userType:?"member",
??????customer:?{
????????id:?"{{-?checkout.customer.id?|?json?-}}",
????????lastOrder:?"{{-?customer.last_order.created_at?|?date:?'%B?%d,?%Y?%I:%M%p'?-}}",
????????orderCount:?"{{-?checkout.customer.orders_count?|?json?-}}",
????????totalSpent:?"{{-?checkout.customer.total_spent?|?times:?0.01?|?json?-}}",
????????tags:?{{-?checkout.customer.tags?|?json?-}}
??????}
??????{%?else?%}
????????userType:?"visitor",
??????{%?endif?%}
????});
??};
??allPageHandle();
??????
??{%?case?template_name?%}
??{%?when?"product"?%}
????productPageHandle();
??{%?endcase?%}
}
appStart();
</script>
***************************************END*******************************
然后復制這個代碼：?{%?render?'analyzify-product-datalayer.liquid'?%}
粘貼在theme?liquid的<head>中
4. 將容器導入GTM
容器領取方式見文末
點擊確認之后返回點擊右上角的提交直接發布。
然后點擊文件夾，再次檢查確認自己的GA4代碼是否有誤
完成后如下
5.最后驗證代碼是否可行
鏈接成功后會跳轉你的網站，你網站頁面出現如下提示就是成功了
Tagassistant的頁面也會出現鏈接成功的提示如下
通過TAG?ASSISTANT檢查事件是否觸發成功
回到我們的GA頁面就可以看到更加詳細的產品信息顯示在報告里面
公眾號發送消息“GA4容器2.1”即可領取最新容器~
文章為作者獨立觀點，不代表DLZ123立場。如有侵權,請聯系我們。( 版權為作者所有，如需轉載，請聯系作者 )
網站運營至今，離不開小伙伴們的支持。 為了給小伙伴們提供一個互相交流的平臺和資源的對接，特地開通了獨立站交流群。
群里有不少運營大神，不時會分享一些運營技巧，更有一些資源收藏愛好者不時分享一些優質的學習資料。
現在可以掃碼進群，備注【加群】。 ( 群完全免費，不廣告不賣課！)
