web-dev-qa-db-ja.com

Facebook Pixel + Googleタグマネージャー+ fbqイベント

FacebookPixelの配信にGoogleタグマネージャーを使用しています。

次に、このようなコードを使用してイベントを発生させます

  <body>
...
        <script>
            fbq('track', 'ViewContent', { 
                content_type: 'product',
                content_ids: ['1234'],
                content_name: 'ABC Leather Sandal',
                content_category: 'Shoes',
                value: 0.50,
                currency: 'USD'
            });
        </script>
    </body>

しかし、コードを実行すると、Facebook Pixelが非同期で読み込まれ、fbqがまだ利用できないため、エラーが発生しました。

Uncaught ReferenceError：fbqが定義されていません

私は何をすべきか？

javascriptgoogle-tag-managerfacebook-pixel
5
Alexander G

タグシーケンス機能を使用します。これにより、事前定義された順序でタグを起動できます。後続のタグは、実行される前に前のタグを待機します。

FB初期化コードをロードするタグを作成します。タグの起動オプションで[ページごとに1回]を選択します（複数のタグで使用されている場合でも、これを1回だけ読み込む必要があります）。

Facebookのイベントタグに移動します。詳細設定で、タグの順序付けオプションを探します。次のように設定します。

enter image description here

（Facebook initがFBライブラリをロードするタグである場合、標準のbootstrapコード）を使用すると想定しています。最後のチェックボックスを有効にすると、セットアップタグが失敗した場合に起動しません。

FB bootstrapコードはコマンドキューを使用してfbqオブジェクトをセットアップするため、データをfbqにプッシュできます。ライブラリがまだダウンロードしている場合でも、データはコマンドキューに入り、呼び出しはライブラリがダウンロードされたときに実行されます。

タグシーケンスにより、イベントの前にfbqオブジェクトが設定されていることが確認されます。これが唯一のFBイベントである場合は、トラブルを回避し、イベントコードの上にローダーを貼り付けるだけです。

7
Eike Pierstorff

Eikeのアプローチを機能させることができず、以下の「ダーティな回避策」になりました（基本的には、fbqが開始されるまで待機します）。

<script>
    function waitForFbq(callback){
        if(typeof fbq !== 'undefined'){
            callback()
        } else {
            setTimeout(function () {
                waitForFbq(callback)
            }, 100)
        }
    }

    waitForFbq(function () {
        fbq('track', 'Registered');
    })
</script>

多分それは誰かを助けるでしょう

4
vir us

Vir usの解決策は7月5日12:48から私にとって魅力のように機能します！ありがとう:-)

編集：私の場合、Wordpressサイトで同様の何かを実装する必要がありました。GTMはFBピクセルでヘッダーに読み込まれます。したがって、タグを開いた直後に配置されたコードは次のようになります。

<script>
    function waitForFbq(callback){
        if(typeof fbq !== 'undefined'){
            callback()
        } else {
            setTimeout(function () {
                waitForFbq(callback)
            }, 100)
        }
    };

    waitForFbq(function() {
        fbq('track', 'ViewContent', {content_name: '<?php the_title(); ?>'});
    });
</script>
3
Rob Pod

同じエラーがありました-結局、それはすべてシーケンスに関するものでした。

wordpressサイトのWPプラグインを介してタグマネージャーを介して使用される場合、ピクセルはデフォルトでフッターに読み込まれるため、宣言される前にfbq変数が使用されますフッターでは、本文では認識されませんでした： Googleタグマネージャーfor WordPress options

さまざまな設定を試しましたが、最終的にプラグインの使用をあきらめました-ページビルダーのスクリプトセクションを使用してヘッダーセクションにプラグインを挿入するだけです（Thrive Architect = TA）： TAのカスタムスクリプト設定 およびこれですべて正常に動作します！

0
Yosi Ben Zvi