AppLovin Pixel 集成

AppLovin 是一家全球领先的移动营销平台，专注于帮助开发者最大化应用收入。以下教程将为您介绍如何在 Shoplazza 安装 AppLovin 的 Pixel。

注意

该页面的代码基于 AppLovin 官方教程生成： AXON Pixel Google Tag Manager Integration 。
本文展示的代码仅作参考，请联系相关广告平台获取符合您账户的代码。
使用过程中，如遇转化事件等不生效，建议您及时联系广告平台侧检查代码准确性。
如遇前端显示异常，该问题可能是添加的代码与您的主题不适配，或者与您添加的其他代码相互冲突，请即刻删除相关代码，检查代码的完整性，并与您的技术团队取得联系以获取进一步的协助与支持。

准备工作

安装该 Pixel 使用的自定义代码嵌入插件下架了结账页的代码安装入口，需要联系在线客服申请旧版插件的使用入口，才能向结账页安装追踪代码。

安装代码

注意

需要联系在线客服，获取旧版插件使用入口后，再继续以下操作。

安装基础代码

将以下代码复制并粘贴到自定义代码嵌入插件中。将代码中“ «您的event-key»”替换为您AppLovin 帐户中的 event key。

代码配置：

选择用户端：PC端和手机端
触发页面：全部
代码位置：顶部

<script>
  var AXON_EVENT_KEY="«您的event-key»";
  !function(e,r){var t=["https://s.axon.ai/pixel.js","https://res4.applovin.com/p/l/loader.iife.js"];if(!e.axon){var a=e.axon=function(){a.performOperation?a.performOperation.apply(a,arguments):a.operationQueue.push(arguments)};a.operationQueue=[],a.ts=Date.now(),a.eventKey=AXON_EVENT_KEY;for(var n=r.getElementsByTagName("script")[0],o=0;o<t.length;o++){var i=r.createElement("script");i.async=!0,i.src=t[o],n.parentNode.insertBefore(i,n)}}}(window,document);

  axon("init");
</script>

安装 PageView 事件代码

将以下代码复制并粘贴到自定义代码嵌入插件中。

代码配置：

选择用户端：PC端和手机端
触发页面：全部
代码位置：底部

<script>
  axon("track", 'page_view');
</script>

注意

以下几个事件代码，需要将代码中“item_category_id”部分的XXXX自行替换为您商品的分类ID，具体分类可参考文档： Category IDs 。

安装 ViewContent 事件代码

将以下代码复制并粘贴到自定义代码嵌入插件中。

代码配置：

选择用户端：PC端和手机端
触发页面：全部
代码位置：底部

<script type="text/javascript">
  document.addEventListener("dj.viewContent", function (e) {
     const detail = e.detail;
     axon("track", 'view_item',{
    'currency': window.C_SETTINGS.currency_code,     // 货币单位
    'items': [
          {
            'item_id':detail.product.id,
            'item_variant_id':detail.selected.id,
            'price':detail.selected.price,
            'quantity': detail.qty,
            'item_name':detail.product.title,
            'item_category_id':XXXX
          }
        ]
  });
  });
</script>

安装 AddToCart 事件代码

将以下代码复制并粘贴到自定义代码嵌入插件中。

代码配置：

选择用户端：PC端和手机端
触发页面：全部
代码位置：底部

<script type="text/javascript">
  document.addEventListener("dj.addToCart", function (e) {
    const detail = e.detail;
    axon("track", 'add_to_cart',{
    'currency': window.C_SETTINGS.currency_code,     // 货币单位
    'items': [
          {
            'item_id':detail.product_id,
            'item_variant_id': detail.variant_id,
            'price': detail.item_price,
            'quantity': detail.quantity,
            'item_name':detail.name,
            'item_category_id':XXXX
          }
        ]
  });
  });
</script>

安装 InitiateCheckout 事件代码

将以下代码复制并粘贴到自定义代码嵌入插件中。

代码配置：

选择用户端：PC端和手机端
触发页面：指定页面—结账页
代码位置：底部

<script type="text/javascript"> try {  
function trackCheckout() {
    if (!location.href.includes('/checkout')) return;
    let attempts = 0;
    const check = () => {
        attempts++;
        const products = CheckoutAPI ? CheckoutAPI.summary.getUiProductList() : [];
        if (products.length > 0) {
            const total = products.reduce((sum, item) => 
                sum + (item.price || 0) * (item.quantity || 0), 0);
            axon("track", 'begin_checkout', {
                currency: window.C_SETTINGS.currency_code,
                value: total,
                items: products.map(item => ({
                    item_id: item.id,
                    item_variant_id: item.variantId,
                    price: item.price,
                    quantity: item.quantity,
                    item_name: item.productTitle,
                    item_category_id: XXXX
                }))
            });
        } 
        else if (attempts < 50) {
            setTimeout(check, 100);
        }
    };
    check();
}
if (document.readyState === 'complete') {
    trackCheckout();
} else {
    window.addEventListener('load', trackCheckout);
} } catch(e){  }</script>

安装 Purchase 事件代码

将以下代码复制并粘贴到自定义代码嵌入插件中。

代码配置：

选择用户端：PC端和手机端
触发页面：指定页面—订单完成页
代码位置：底部

<script> try { console.log('1',window.ORDER);
  axon('track', 'purchase', {
    'currency': window.ORDER.currency_code,       
    'value': window.ORDER.prices.total_price,           
    'transaction_id': window.ORDER.id,     
shipping:window.ORDER.shipping_total,
tax:window.ORDER. tax_total,
user_id:window.ORDER.customer.user_id,
      items: window.ORDER.line_items.map(function (item) {
          return {
           item_variant_id:item.variant_id,
           item_id: item.id,
            price: item.price,
            quantity: item.quantity,
            item_name:  item. product_title,     
item_category_id:1604
          }
        })
});
 } catch(e){ }</script>

验证 Pixel

完成以上的代码添加工作之后，需要确认 Pixel 是否被成功安装。请点击：AXON Pixel Helper 安装验证插件。

插件安装完成后，访问您的网站时点击该插件并测试事件：

绿色--上报成功。
黄色--可优化（建议参数未上传，事件可优化），取决于广告类型，非必须优化。
红色--上报失败。

使用过程中，如遇转化事件等不生效，建议您及时联系广告平台侧检查代码准确性。

AppLovin Pixel 集成

准备工作

安装代码

验证 Pixel

相关主题

评论