使用Google Tag Manager嵌入facebook的聊天窗口

前些时间，Matteo Gamba问我一个有关Facebook自定义聊天窗口插件的问题，这个插件的可以让你在你的网站里通过Facebook应用直接开启聊天窗口，这是非常好的一个功能，但问题是你直接通过自定义HTML添加属性数通过过GTM的验证的，也就是提交发布到线上的时候会报错。

所以我在这里，写一个Facebook聊天插件的使用指引。

首先，头部是是Facebook官方有关该插件的代码，你需要做的是从第二版开始。

在这一步中，你需要给页面添加一个div元素，所以你需要通过GTM去创建一个自定义的html，具体的代码如下：

其中第4~8行的变量的是需要根据你实际情况去填写的，如果你没有自定义的网络请求去接受回调或referral信息，你可以可以留空，不填写任何信息。

给这个自定义的代码创建一个dom准备好的触发器，这个触发器只是在你想要看到聊天窗口的界面触发的。

这样就完成了，这个代码的作用4~8行的代码以变成的方式填充div里面的参数。

说两句：这个网页面添加代码的形式，添加属性都是通过setAttribute的形式。

来源：https://www.simoahava.com/analytics/add-facebook-messenger-chat-google-tag-manager/