主页 » 产品指南 » 第三步 – Facebook网站推广之 ——Pixel设置指导手册

第三步 – Facebook网站推广之 ——Pixel设置指导手册

1. 背景

全球最大的社交媒体Facebook作为目前最受欢迎的广告投放平台之一,
因其广泛的用户群体,优异的用户质量,精准的用户定位,受到海内外需求方的广泛认可。

使用Facebook进行网站投放时,为了能够在Facebook平台上直接观察到投放维度对应的结果,
从不同的广告(下文简称Ad)分析具体每个Ad的投放效果, 并根据情况有效的进行分析优化,Facebook提供了专门的网页追踪代码(Facebook Pixel,以下简称Pixel)。

本文主要目的在于指导希望了解网站投放的读者如何正确设置Facebook追踪代码。

适用范围:
能够在投放目标网站添加代码的广告需求商。

2. Facebook Pixel简介

2.1简述

Facebook Pixel是应用于网站的一段追踪代码(JavaScript)。通过这段代码,您可以在Facebook中追踪广告投放效果,衡量和优化广告系列,以及为广告系列创建受众。使用Facebook
Pixel,您还可以收集和利用用户跨设备(PC端和移动端)在您的网站上采取的操作。

2.2功能

Facebook Pixel主要可以提供三种功能:

a)     根据网站创建自定义受众,展开再营销:针对在您的网站上采取了特定操作(例如:访问产品页面、加入购物车或购买产品)的用户创建自定义受众。

b)    优化广告,增加转化量:针对有可能采取操作的用户优化投放。

c)     追踪转化情况,并归因至广告:可以衡量跨设备转换数据。

3. Facebook Pixel设置

3.1 基本流程

Facebook Pixel设置主要分为3个步骤:
a) 创建Facebook Pixel
b) 在网页代码中设置Facebook Pixel
c) 测试Facebook Pixel设置是否成功

3.2 创建Facebook Pixel

想要为广告投放账户创建Pixel,请前往该Facebook账户,选择工具→像素进入像素页面,并点击出现的创建像素按钮。

在出现的创建窗口中填写一个名称,点击创建像素按钮即完成创建(每个广告账户默认只能创建一个Pixel)。在创建完成之后,前往广告管理工具的 Facebook Pixel选项卡 依次选择à操作 à查看像素代码 如下图所示。

在出现的窗口中即可得到您要使用的Pixel代码模板。

如果您因为网络原因不能连接Facebook,请联系我们寻求帮助。

3.3 在网页代码中设置Facebook Pixel

3.3.1 设置Pixel的三个步骤

a) 基本代码:在网站代码模板中加入基本代码(page view)。
b) 标准事件代码:在相应的用户事件成功页再在基本代码中加入标准事件代码,追踪具体用户行为。
c) 交互事件代码:当某用户行为需要在当前网页出现交互操作完成,并且不进入新结果页时,需要设置相应的function,在事件发生后触发发送。

3.3.2
Pixel结构说明

在您得到相应的Pixel代码后,请打开您网页的HTML代码,将Pixel代码添加至网页的<head></head>标签之间。下图是一个带有标准事件代码的Facebook Pixel代码设置示意图,根据图中所标示将代码划分为三个部分。

 

1.   网站的原始代码:将 Facebook
Pixel代码粘贴至网页的 <head> 和 </head> 标签之间。您可能之前已在 head 标签之间复制了其他代码,所以您只需将Pixel代码粘贴至当前代码下方,</head>
标签上方。

请您务必将代码放置在head标签内,以免因代码的加载速度影响数据。

2.   Facebook Pixel基本代码:Facebook Pixel代码如上图2部分所示,只有Pixel编号会与
1234567890 不同。

3.   标准事件代码:将与您的页面(例如:完成注册、加入购物车)相关的标准事件代码粘贴至 Facebook Pixel代码中 </script> 标签上方(上图3部分)。该代码需要在您想要追踪的每个网络页面上添加。

类似标准事件代码,您也可以在Facebook Pixel代码中 </script> 标签上方添加交互事件代码。具体操作,我们会在下面的篇幅进行说明。

3.3.3 基本代码设置

基本代码仅包含page
view
事件,需要加入到网页模板中,即您方的每个页面都需要包含。对于不同的Facebook账户,都会有唯一的Pixel编号, 替换下面代码段中的<FB_PIXEL_ID>使用。

3.3.4 标准事件代码设置

为了追踪具体用户行为,您需要在网站相应的结果页中,在刚才添加的Facebook Pixel基础代码上,在fbq(‘track’, “PageView”);代码后添加设置相应的标准事件代码。例如,在网站上销售玩具的用户应在加入购物车页面和购买页面放置标准事件代码。
Facebook的标准事件代码为9个,下表为标准事件代码的简介。如想了解更多,请参考附录中标准事件代码说明。

您也可以为各标准事件代码添加不同参数,例如内容编号、值和货币。这些参数均可选,但“购买”标准事件必需添加值和货币参数才能生效。另外,请不要在一个网页中重复添加一个事件代码,否则会造成数据的双倍记录。

       如果您想使用网址规则,而非标准事件,则可以参考定义转化

3.3.5 追踪页内事件

设置完基础代码之后,您可以跟踪页面内的动作,例如购买产品。

您可以使用将事件代码加入到HTML元素中,比如提交订单按钮:


或者,如果您需要在多个动作中调用某行为事件,则可以使用Function来推送该事件。例如,可以定义如下function


然后,您可以从多个地方调用该function,比如:


3.3.6 特殊情况

Facebook目前使用的Pixel版本经过了更新,在之前版本Facebook有两种Pixel,分别是Audience
Pixel:这个Pixel用于生成Website Custom Audience,每个账户只有一个;Conversion Pixel:这个Pixel有两个功能,一个是优化广告,另外是追踪转化数据。

目前新的Pixel集合了之前两种旧Pixel的功能。如果您之前已经安装过旧版的Audience
Pixel和Conversion Pixel,请您在安装了Conversion Pixel的页面上,删除旧的Pixel代码,并在新的 Facebook
Pixel代码中添加相应的标准事件。请先确保所有投放中的广告与Conversion Pixel无关联,然后再删除旧代码。下表是Conversion Pixel类型与其相应的标准事件代码。


请注意,Conversion
Pixel虽然暂时仍然有效,但我们建议升级到新的代码并使用标准事件。

另外目前旧版Audience
Pixel仍可继续工作,但我们建议您升级到新版Facebook Pixel代码。如果您希望在旧版Audience Pixel基础上,开始优化并追踪转化情况,请删除旧Conversion
Pixel代码,并在现有基础代码上添加标准事件代码。这时标准事件代码使用window._fbq.push([‘track’,’AddToCart’]); 而不使用
fbq(‘track’,
‘AddToCart’); 代码。添加了标准事件代码的Audience Pixel代码如下图所示:

3.4 测试Facebook Pixel

您可以使用工具Facebook
Pixel Helper来测试Facebook的Pixel是否正确设置。Pixel如果正常运行,会将信息发送回Facebook,您便能在广告管理工具的 Facebook Pixel页面看到相关活动。此外,Pixel的状态还将被设为使用中。下图为Pixel正确设置Facebook中追踪到的流量图。

 

下面我们会了解Facebook
Pixel Helper的安装使用以及一些报错或问题的解决方法。

    3.4.1 安装

       1. 首先请您确定您已经安装浏览器Google
Chrome,点击“自定义及控制Google Chrome”中的“更多工具”,再选择“扩展程序”。

 

       2. 扩展程序,选择屏幕左下的“浏览一下Chrome网上应用商店”。

       3. 在左侧搜索栏输入facebook pixel helper,点击“扩展程序”。右侧是根据您的条件找出的扩展程序。找到您需要的程序,点击“添加至CHROME”。

       4. 点击之后会弹出相应的会话框,选择“添加扩展程序”。即可正确安装Pixel,安装成功即可在浏览器中网页地址旁边看到Pixel的标志。

3.4.2
Pixel Helper使用方法

Pixel Helper的使用方法十分简单,当您使用Google
Chrome浏览相关网页时,如果网页上没有安装Facebook Pixel则网页右上角的Pixel Helper图标会呈现出灰色的状态,点击图标会显示页面中没有找到Pixel。

 

如果网页中有Facebook
Pixel
代码,Pixel Helper图标会变蓝,右下角会出现小数字,数字代表Pixel的数量。点击图标会显示Pixel的加载是否成功和Event相关信息。点击其中的“View Event Log”会显示PixelID等相关具体信息。

 

3.4.3
Pixel Helper常见错误和问题

Pixel Helper会对网页中的Pixel的加载和数据回传进行错误检测,常见的错误主要有以下几种:

1.   Pixel未加载

 

该网站上有 Facebook Pixel,但尚未触发。虽然这通常由代码中的错误导致,但如果Pixel是由按钮点击等动态事件触发,也会出现此提示。如果是这种情况,则错误会在点击按钮后消失。

      

2.   多次激活Pixel

 

多次向 Facebook 发送有相同编号和事件名称的Pixel。这是一种常见错误,Facebook会将这些计为一次事件。通常是由代码里面出现重复的Pixel代码造成。

 

3.   Pixel加载时间太长

 

表示激活Pixel耗费的时间太长,这可能由该Pixel的位置导致。我们建议您将Pixel代码嵌入网页顶部,最好是 HTML </head> 结束标签之前,这样Pixel代码就会位于被加载页面的开头部分。如果将代码嵌入页面较下方位置,则系统可能无法追踪转化。

 

4.   Pixel不只对应一种转化

 

这个问题是使用旧版Pixel可能出现的问题,不久后旧版Conversion Pixel将会停止使用,建议您参照前文将旧版Pixel转变为新版Pixel。下文是旧版Pixel问题的原因及解决方案:该问题由多种转化活动导致的,通常会影响优化和追踪的效率。您可以为多个广告和广告系列重复使用Conversion Pixel,所以我们建议您仅为每个想要追踪的页面或事件使用一个Conversion
Pixel
。请注意:用户与网页互动时(例如:点击按钮)可能产生二次转化活动,在这种情况下,您可以忽略此警告。

更多信息,请参考Facebook Pixel
Helper
官方指南或联系我们。

 

3.5 参考文档


Facebook 官方Pixel说明(英文版):

https://developers.facebook.com/docs/facebook-pixel/


Facebook 官方Pixel开发文档(英文版):

https://developers.facebook.com/docs/marketing-api/facebook-pixel/v2.5

 

附录1:标准事件代码说明

关于标准事件代码,请参考如下表格。您也可以参考Facebook官方说明标准事件使用,或者从广告管理工具中的Facebook Pixel选项卡 à 操作 à 查看像素代码中进行查看。

PDF文件:第三步-Facebook Pixel集成指南


分享到:

发表评论:

你必须登录才能发表评论

6 Responses to "第三步 – Facebook网站推广之 ——Pixel设置指导手册"


  • Don Written on 2016年7月22日

    怎么删除之前建立的pixel?

    • admin Written on 2016年7月26日

      谢谢关注木瓜营销学院的内。
      pixel是加在网站的代码里的,只要找到这段代码,并且删除该段代码就可以,最好找网站技术操作,以免删错。
      注意:pixel记录很多数据的,删了pixel就没有数据基础了哦

      • Don Written on 2016年7月26日

        facebook广告里怎么删除建立的pixel。代码里删除很容易

        • admin Written on 2016年7月28日

          谢谢关注木瓜营销学院的内容。
          pixel的删除可以以BM的admin的身份找到该账户的pixel,看你是否有删除选项权限。

  • Don Written on 2016年7月26日

    如果有多个网站,怎么建立多个pixel?

    • admin Written on 2016年7月28日

      谢谢关注木瓜营销学院的内容。
      一个账户只能生成一个pixel,但您可以把这些账户都放在一个business manager里面,然后可以以BM的admin的身份找到该账户的pixel,看里面是否有删除选项。
      可以多个账户用一个pixel,但一个账户不能生成多个pixel。