Ich benutze Google Tag Manager und auch Javascript geladen von Webpack.Erkennen, wenn Google Tag Manager geladen hat Tags

(Im head Tag meiner Seite, ich habe das Drehbuch GTM Laden, und dann habe ich die manifest.js, vendor.js und page-specific.js von Webpack zusammengestellt.)

Wenn ich eine bestimmte Javascript geladen Bibliothek via GTM (in meinem Fall habe ich das Facebook Pixel als Custom Tag), wie kann ich eine Funktion in meinem page-specific.js anweisen zu warten, bis der Facebook Pixel Tag von GTM geladen wurde?

(Die Funktion ruft fbq('track', 'Purchase', {value: facebookTrackingPurchaseValue, currency: 'USD'});, die bereits auf der Facebook-Pixel mit geladen abhängt.)

jetzt rechts, es ist eine Race-Bedingung ist.

Und ich bin es klobig (durch Hinzufügen einer 4-Sekunden-Timeout in meinem page-specific.js, so dass es eine anständige Wahrscheinlichkeit gibt, dass das Facebook Pixel in GTM bis dahin geladen wurde).

Um klar zu sein: Ich weiß schon, wie mehrere Tags innerhalb GTM einstellt einen GTM-Tag zu warten, zu laden, aber das ist nicht das, was ich versuche, hier zu tun (da meine page-specific.js nicht innerhalb GTM ist).

Ich habe the documentation und Tutorials überall gesucht, und ich habe nie jemanden gefunden, der beschreibt, wie man diese Art von Abhängigkeit verwaltet.

Ich schätze Ihre Vorschläge.

Quelle

2017-06-15 Ryan

Normalerweise können Sie nicht. Die Tag-Priorität und die Tag-Reihenfolge legen fest, wie GTM die Tags in die Seite einfügt, aber nicht, ob die Ausführung der Skripts abgeschlossen ist.

Der einzige Weg, um etwas zu erreichen, ist, wenn die Tags einen Rückruf ausführen können, wenn sie fertig geladen sind. An diesem Punkt können Sie entweder schieben ein benutzerdefiniertes Ereignis an das Datalayer, die andere Tags auslöst, oder Sie tag sequencing verwenden und

google_tag_manager[{{Container ID}}].onHtmlSuccess({{HTML ID}});

rufen in den Erfolg Rückruf (in dem die jeweiligen Variablen müssen in der eingebauten Variablen aktiviert sein!) und aktivieren Sie "Nicht auslösen des Setup-Tags fehlgeschlagen" im sequenzierten Tag (es wird dann auf die Erfolgsmeldung gewartet).

Aber meistens hast du kein Glück, denke ich.

Quelle

2017-06-15 14:58:34

In diesem Fall Ich hätte gedacht, ein Rückruf wäre eine völlig angemessene Lösung. –

@JBrazier, das Problem mit dem Rückruf ist, dass es von dem Marketing-Tag in Frage ausgeführt werden muss. Ich weiß nicht, ob das Facebook-Tag dies erlaubt, die meisten Marketing-Tags nicht. –

Guter Punkt; Daran hatte ich nicht gedacht. https://StackOverflow.com/a/38582257/5815149 scheint eine Problemumgehung zu empfehlen. –

Ich löste dieses Problem mit einem "Cleanup-Tag". In meinem Beispiel ist Code für Hotjar und die betreffende Funktion heißt hj().

aktualisiert: Nach Kontakt mit der Hotjar Unterstützung erfuhr ich, dass die folgende Codezeile für Hotjar genug ist:window.hj=window.hj||function(){(hj.q=hj.q||[]).push(arguments)};. Kein Cleanup-Tag ist hier notwendig, aber Cleanup-Tags, wie unten beschrieben, bieten eine universellere Lösung.

Der Code

Führen Sie diesen Code auf Ihrer Website:

window.hjWrapperQueue = window.hjWrapperQueue || []; 
function hjWrapper() { 
    hjWrapperQueue.push(arguments); 
}

Statt hj() aufzurufen, rufen hjWrapper() statt.

Dann in Google Tag Manager (GTM), einen Cleanup Tag auf den betreffenden Tag (Erklärung unten) mit dem folgenden Code hinzufügen:

<script> 
    // Re-define the wrapper function to simply call hj() 
    function hjWrapper() { 
    hj.apply(arguments); 
    } 

    // Call all the queued events 
    if (window.hjWrapperQueue) { 
    window.hjWrapperQueue.forEach(function (hjArguments) { 
     hj.apply(hjArguments); 
    }); 
    } 
</script>

Wie einen Cleanup Tag zu Ihrem Tag hinzuzufügen:

Ihr Tag öffnen (In den Screenshots der Tag genannt wird Hotjar)
Open "Erweiterte Einstellungen"
Open "Tag Sequencing"
Aktivieren Sie "Ein Tag nach Hotjar feuern" (Hotjar wird natürlich durch den Namen des Tags ersetzt)
Wählen Sie "Tag auswählen" im Auswahlmenü "Cleanup Tag".
Ein neues Fenster wird geöffnet. Klicken Sie auf das "+" in der oberen rechten Ecke, um ein neues Tag hinzuzufügen. Dies wird zu Ihrem Cleanup-Tag.
Wählen Sie ein "Custom HTML" -Tag und fügen Sie Ihren benutzerdefinierten Code hier hinzu. Fügen Sie keinen Trigger hinzu (Ihr Tag ist der Auslöser für Ihr Cleanup-Tag)
Benennen Sie Ihr Cleanup-Tag. Ich habe meinen "Hotjar Wrapper" genannt.
Speichern.
In Ihrem Tag Fenster das Kontrollkästchen "Sie feuern nicht Hotjar Wrapper wenn Hotjar ausfällt oder pausiert"
Ihr Tag sollte nun wie folgt aussehen:

Quelle

2018-03-06 12:13:16

Erkennen, wenn Google Tag Manager geladen hat Tags

Antwort

Der Code

Wie einen Cleanup Tag zu Ihrem Tag hinzuzufügen:

Verwandte Themen