将 Facebook Pixel 事件添加到 Squarespace 按钮单击答案

【问题标题】：Adding Facebook Pixel event to Squarespace button click将 Facebook Pixel 事件添加到 Squarespace 按钮单击
【发布时间】：2018-07-11 18:20:08
【问题描述】：

我正在尝试将 Facebook 像素事件——“ViewContent”——添加到我的 Squarespace 网站。我有一页有一个按钮，我想在按钮点击时触发事件。感觉应该很简单，但我在当前设置下一直在 Facebook Pixel Helper 中遇到错误。

我引用这篇文章：Add FB pixel event code into button - Squarespace

按照答案中的建议，我在此页面的标题中使用了每页代码注入：https://www.wearpapercrane.com/survey

这就是我所拥有的——

    <script>
    (function() {
        var btns = document.getElementsByClassName("sqs-block-button-element");
        var i, I;

        for (i=0, I=btns.length; i<I; i++) {
            btns[i].addEventListener("click", function() {
                fbq("track", "ViewContent");
            });
        }
    })();
</script>

但是，当我使用 Facebook Pixel Helper 进行验证时，我得到了另一端的结果 --

（这是点击后，顺便说一句......按钮在单独的选项卡中打开链接，所以这是在点击后返回页面并查看像素助手）。

是否有我遗漏的东西导致了这个错误？

我已经安装了像素，并且我有一个“引导”事件在另一个页面上正常工作（使用 Squarespace 的表单嵌入功能），所以我很确定这是这个特定代码注入的问题。

会喜欢任何和所有的建议。谢谢！！

【问题讨论】：

您是否首先验证了此点击处理程序确实会触发？

标签： javascript facebook pixel squarespace

【解决方案1】：

该事件没有触发，因为您引用的答案（我写的）没有考虑这样一个事实，即通过标头注入（站点级或页面级）注入代码时，必须等待 DOM在将事件附加到元素之前加载。

您引用的答案已更新，特别是以下部分：

<script>
    window.Squarespace.onInitialize(Y, function() {
        var btns = document.getElementsByClassName("sqs-block-button-element");
        var i;
        for (i=btns.length-1; i>=0; i--) {
            btns[i].addEventListener("click", function() {
                fbq("track", "AddToCart");
            });
        }
    });
</script>

【讨论】：