Shopify GA4 設置最新版2.1

1304 閱讀 0 評論 3 點贊

有用戶反饋更新后不行，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?%}

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?%}

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立場。如有侵權,請聯系我們。( 版權為作者所有，如需轉載，請聯系作者 )

網站運營至今，離不開小伙伴們的支持。為了給小伙伴們提供一個互相交流的平臺和資源的對接，特地開通了獨立站交流群。群里有不少運營大神，不時會分享一些運營技巧，更有一些資源收藏愛好者不時分享一些優質的學習資料。

現在可以掃碼進群，備注【加群】。 ( 群完全免費，不廣告不賣課！)

點贊(3) 打賞

本文分類：谷歌分析
本文標簽：GA4 Shopify
瀏覽次數：1304 次瀏覽
發布日期：2022-09-05 00:13:31
原文鏈接：https://mp.weixin.qq.com/s/oxfbNj4VUfoeB5V5C-klFA

上一篇 > 【Google Analytics】谷歌分析設置訂閱目標
下一篇 > GA4的一些其他建議設置

Shopify GA4 設置最新版2.1

評論列表共有 0 條評論

發表評論取消回復

Shopify GA4 設置最新版2.1

GA4為什么數據缺失

Shopify自動目錄常見問題Q&A：兩大解決方案速看！

Shopify獨立站8步極速建站指南：90分鐘從0到1，零基礎1美金成本上線！

如何在GA4后臺看聯盟營銷的流量來源情況

評論列表 共有 0 條評論

發表評論 取消回復

評論列表共有 0 條評論

發表評論取消回復