{"id":904,"date":"2021-01-29T14:00:48","date_gmt":"2021-01-29T12:00:48","guid":{"rendered":"https:\/\/devowl.io\/?post_type=knowledge-base&p=904"},"modified":"2024-02-05T08:21:09","modified_gmt":"2024-02-05T06:21:09","slug":"real-cookie-banner-with-google-tag-manager-or-matomo-tag-manager","status":"publish","type":"knowledge-base","link":"https:\/\/devowl.io\/de\/wissensdatenbank\/real-cookie-banner-mit-google-tag-manager-oder-matomo-tag-manager\/","title":{"rendered":"Einrichtung mit Google Tag Manager oder Matomo Tag Manager"},"content":{"rendered":"

Real Cookie Banner bietet eine tiefe Integration f\u00fcr Google Tag Manager und Matomo Tag Manager, die den jeweiligen Tag Manager erst nach Einwilligung des Nutzers l\u00e4dt. So bist du auf der sicheren Seite und \u00fcbermittelst keine pers\u00f6nlichen Daten \u00fcber das Tag Manager Script an z.B. Google ohne Einwilligung, kannst aber \u00fcber ein Ereignis im Tag Manager auf Einwilligungen reagieren.<\/p>\n

Im folgenden Artikel erkl\u00e4ren wir dir, wie du deinen Cookie Banner mit einem Tag Manager einrichten kannst. Die Erkl\u00e4rung erfolgt anhand des Google Tag Managers. Es funktioniert aber genauso gut mit dem Matomo Tag Manager, da dieses Tool die gleichen Konzepte wie der Google Tag Manager implementiert hat.<\/p>\n<\/div><\/div>

<\/i><\/div>
Art der \u00dcbertragung der Einwilligung \u00fcber Google Tag Manager Ereignisse ist veraltet<\/span>

Die in diesem Artikel erl\u00e4uterte \u00dcbertragung der Einwilligung \u00fcber Google Tag Manager Ereignisse an Google Tag Manager ist veraltet. Wenn du eine neue Website einrichtest, verwende stattdessen die Google Tag Manager Integration f\u00fcr den Google Consent<\/a>, um eine besser strukturierte Tag-Verwaltung in Google Tag Manager zu haben.<\/p>\n<\/div><\/div><\/div>

<\/i><\/div>

Wir m\u00fcssen darauf hinweisen, dass die folgenden Aussagen keine Rechtsberatung darstellen. Wir k\u00f6nnen dir daher nur Einsch\u00e4tzungen aus unserer intensiven Erfahrung mit den EU-Rechtsvorschriften in der Praxis und eine technische Einsch\u00e4tzung der Situation geben.<\/p>\n<\/div><\/div><\/div>

Video Tutorial<\/h2>\n<\/div><\/div>
\n\t\t\t\t\t\t
\n\t\t\t\t\t\t\t\t\n\t\t\t\t\t\t\t\t
<\/path><\/path><\/path><\/svg><\/div> <\/div> <\/div><\/div><\/div>

Aktivieren des Tag Manager Modus<\/h2>\n

Zuerst m\u00fcssen wir den Tag Manager Modus in Real Cookie Banner aktivieren, um alle zus\u00e4tzlichen Funktionen f\u00fcr die Verwendung von Google Tag Manager oder Matomo Tag Manager zu sehen. Um dies zu erreichen, befolge diese Schritte:<\/p>\n

    \n
  1. In deinem WordPress Backend gehst du auf den Reiter Cookies<\/em> in der linken Seitenleiste.<\/li>\n
  2. Im Tab Einstellungen > Allgemein<\/em> findest du die Option \"Lade Services nach Einwilligung mittels <\/em>\". Hier solltest du angeben, mit welchem Tag Manager du auf die Einwilligung reagieren m\u00f6chtest.<\/li>\n<\/ol>\n

    Dadurch werden die zus\u00e4tzlichen Optionen in Real Cookie Banner aktiviert, aber der von dir gew\u00e4hlte Tag Manager wird noch nicht<\/span> in deine Webseite integriert.<\/p>\n

    Google Tag Manager einbinden<\/h2>\n

    Du musst den Google Tag Manager oder einen anderen Tag Manager in deine Website einbinden. Falls du dies bereits getan hast, entferne bitte den Google Tag Manager wieder, z.B. aus dem benutzerdefinierten JavaScript-Code deiner Webseite, da du ihn \u00fcber Real Cookie Banner einbinden musst. Dies ist zwingend notwendig, denn nur so k\u00f6nnen wir zum richtigen Zeitpunkt die n\u00f6tigen Ereignisse an den Tag Manager senden.<\/p>\n

    Mit den folgenden Schritten kannst du den Google Tag Manager zu deiner Website hinzuf\u00fcgen:<\/p>\n

      \n
    1. Gehe zu Services<\/em> (Cookies) > Service hinzuf\u00fcgen<\/em> und w\u00e4hle Google Tag Manager<\/em> aus den Vorlagen.<\/li>\n
    2. In der Service-Vorlage f\u00fcgst du alle Informationen hinzu, die du ben\u00f6tigst oder erg\u00e4nzen m\u00f6chtest. Beachte, dass die Option \"Opt-in Script unten l\u00e4dt Google Tag Manager<\/em>\" bereits aktiv ist. Diese muss aktiv bleiben, damit der Google Tag Manager zum richtigen Zeitpunkt geladen wird.<\/li>\n<\/ol>\n

      Einwilligungen \u00fcber Google Tag Manager Ereignisse<\/h2>\n

      Wir haben nun alle Vorbereitungen abgeschlossen, um den Google Tag Manager zusammen mit der \u00fcber Real Cookie Banner eingeholten Einwilligung zu nutzen. Jetzt kannst du ein beliebiges Cookie (Service) einrichten und auf das Opt-In sowie Opt-Out im Google Tag Manager \u00fcber Ereignisse im Data Layer des Services reagieren.<\/p>\n

      Als Beispiel, lass uns Google Analytics einrichten. Dieses sollte \u00fcber den Google Tag Manager geladen werden (wenn der Google Tag Manager selbst geladen werden darf; ansonsten \u00fcber ein Fallback-Script):<\/p>\n

        \n
      1. Gehe zu Services<\/em> (Cookies) > Service hinzuf\u00fcgen<\/em> und w\u00e4hle Google Analytics<\/em> aus den Vorlagen aus.<\/li>\n
      2. Im Bereich \"Technische Handhabung\" findest du zwei neue Felder unter der Bezeichnung \"Ereignis-Namen f\u00fcr Google Tag Manager\". Hier kannst du die Event-Namen definieren, auf die der Google Tag Manager reagieren soll. In diesem Beispiel soll das Ereignis ga-opt-in<\/code> nach der Einwilligung (Opt-in) und ga-opt-out<\/code> nach der Ablehnung des Cookies (Services) oder dem Widerruf der Einwilligung (Opt-out) geworfen werden.<\/li>\n
      3. Gehe nun in deinen Google Tag Manager Container. Unter Trigger > Neu<\/em> kannst du einen sogenannten \"Custom Event<\/em>\" Trigger einrichten. Im Formular \"Triggerkonfiguration<\/em>\" w\u00e4hlst du ein \"Benutzerdefiniertes Ereignis\" aus und tr\u00e4gst den im vorherigen Schritt definierten Ereignisnamen in das Feld \"Ereignisname<\/em>\" ein. Du solltest Trigger f\u00fcr die beiden Ereignisse ga-opt-in<\/code> und ga-opt-out<\/code> erstellen.<\/li>\n
      4. Du kannst ein Tag im Google Tag Manger erstellen, um Google Analytics einzubinden. Als Trigger w\u00e4hlst du den Opt-in-Trigger, den wir gerade eingerichtet haben. Wenn du auch etwas bei einem Opt-Out ausf\u00fchren m\u00f6chtest, kannst du nat\u00fcrlich auch daf\u00fcr einen Tag erstellen.<\/li>\n
      5. Wir springen nun zur\u00fcck zu Real Cookie Banner, wo wir den Service erstellen. In den Feldern \"Code bei Opt-in ausf\u00fchren\" und \"Code bei Opt-out ausf\u00fchren\" kann noch HTML und JavaScript stehen, das ausgef\u00fchrt wird, sobald die Einwilligung erteilt wird. Das kann sinnvoll sein, wenn z.B. in die Nutzung von Google Analytics eingewilligt wird, aber nicht in die Nutzung des Google Tag Managers. So k\u00f6nnte Google Analytics auch nicht geladen werden, da der Google Tag Manager nie \u00fcber die Einwilligung informiert werden kann. Mit dem Toggle \"Script nur ausf\u00fchren, wenn der Nutzer nicht in die Verwendung von Google Tag Manager eingewilligt hat\" kannst du festlegen, dass die Scripte nur ausgef\u00fchrt werden sollen, wenn der Google Tag Manager nicht geladen werden kann. Die Scripte dienen als Fallback, um Google Analytics im Zweifelsfall auch ohne Google Tag Manager einbinden zu k\u00f6nnen.<\/li>\n<\/ol>\n

        Einwilligungen \u00fcber Google Tag Manager Datenschichtvariablen (Data Layer Variable)<\/h2>\n

        Es kann F\u00e4lle geben, in denen im Google Tag Manager nicht auf das Einwilligungsereignis geh\u00f6rt werden kann. Zum Beispiel, wenn du ein Tag f\u00fcr das benutzerdefinierte Klick-Tracking in Google Analytics nur nach dem Klick auf ein Element deiner Website ausl\u00f6sen m\u00f6chtest. Dieses Tracking kann jedoch nur durchgef\u00fchrt werden, wenn zus\u00e4tzlich zum Klick-Ereignis die Einwilligung f\u00fcr Google Analytics vor dem Ereignis erteilt wurde.<\/p>\n

        F\u00fcr solche F\u00e4lle \u00fcbertr\u00e4gt Real Cookie Banner zus\u00e4tzlich den Status der Einwilligung pro Service in den Google Tag Manger Data Layer als realCookieBannerOptInEvents<\/code> Variable. Im Folgenden gehen wir davon aus, dass du mit dem grundlegenden Konzept des Google Tag Manager Data Layer<\/a> vertraut bist, da dies die Basis f\u00fcr eine professionelle Nutzung des Google Tag Managers ist.<\/p>\n

        Below, we’ll explain how you can use the variable in the data layer as part of a trigger to check for, for example, a click event and consent at the same time:<\/p>\n

          \n
        1. (Falls nicht bereits erstellt) Gehe zu Services<\/em> (Cookies) > Service hinzuf\u00fcgen<\/em> und w\u00e4hle Google Analytics<\/em> aus den Vorlagen aus.<\/li>\n
        2. (Falls nicht bereits erstellt) Im Bereich \"Technische Handhabung\" findest du zwei neue Felder unter der Bezeichnung \"Ereignis-Namen f\u00fcr Google Tag Manager\". Hier kannst du die Event-Namen definieren, auf die der Google Tag Manager reagieren soll. In diesem Beispiel soll das Ereignis ga-opt-in<\/code> nach der Einwilligung (Opt-in) und ga-opt-out<\/code> nach der Ablehnung des Cookies (Services) oder dem Widerruf der Einwilligung (Opt-out) geworfen werden.<\/li>\n
        3. Jetzt k\u00f6nnen wir \u00fcberpr\u00fcfen, ob die Variable in der Google Tag Manager-Datenebene richtig gesetzt wurde. \u00d6ffne den Google Tag Manager Tag Assistant<\/a> f\u00fcr die Startseite deiner Website. Auf deiner Website gibst du im Cookie-Banner die Zustimmung zu Google Analytics. Danach solltest du im Tag Assistant das Ereignis ga-opt-in<\/code> sehen (im folgenden Screenshot das Ereignis Nr. 4; markiert mit 1). Auf der Registerkarte \"Datenebene\" (markiert mit 2) solltest du sehen, dass die Variable realCookieBannerOptInEvents<\/code> mit der Eigenschaft ga-opt-in<\/code> in die Datenebene geschoben wurde (markiert mit 3). Bei jedem weiteren Ereignis (im Screenshot Nr. 5 werden DOM Ready<\/code> und 6 Window Loaded<\/code> abgespielt) ist die Datenvariable zug\u00e4nglich.<\/li>\n<\/ol>\n<\/div><\/div>
          \"Google<\/a><\/div>
            \n
          1. To use the variable, go to the “Variables” tab in Google Tag Manager Workspace and create a new “User-Defined Variable”.<\/li>\n<\/ol>\n<\/div><\/div>
            \"Google<\/a><\/div>
              \n
            1. Du kannst die Variable im Google Tag Manager benennen, wie du willst. Wir nennen sie unten \"ga-opt-in\" (als 1 markiert), um \u00fcberall denselben Namen zu verwenden. Als Variablentyp w\u00e4hlen wir \"Datenschichtvariable\" (markiert als 2). Als \"Name der Datenschichtvariablen\" (markiert als 3) muss die Variable gem\u00e4\u00df dem Google Tag Manager Data Layer Variable Konzept in Punktnotation angegeben werden. Das bedeutet, dass wir in unserem Fall realCookieBannerOptInEvents.ga-opt-in<\/code> angeben m\u00fcssen (allgemein immer realCookieBannerOptInEvents.{Ereignisname}<\/code>).<\/li>\n<\/ol>\n<\/div><\/div>
              \"Google<\/a><\/div>

              Die Data Layer Variable f\u00fcr die Einwilligung wird jetzt von Real Cookie Banner gesetzt und wir k\u00f6nnen sie als Variable im Google Tag Manager verwenden. Daher kann sie jetzt als Bedingung f\u00fcr einen Trigger verwendet werden.<\/p>\n

              Im Folgenden gehen wir von dem obigen Beispiel aus, dass wir ein benutzerdefiniertes Ereignis in Google Analytics tracken wollen, sobald ein Element auf der Website angeklickt wurde. Es gibt bereits ein Tag und einen Trigger f\u00fcr dieses Tracking in deinem Google Tag Manager, aber bisher wartet es nicht<\/strong> auf die Einwilligung des Website-Besuchers. Das unten beschriebene Vorgehen funktioniert auch f\u00fcr jede andere Art von Tag oder Trigger, die du bisher benutzt hast.<\/p>\n<\/div><\/div>

              \"Google<\/a>
              Google Tag Manager: Vorhandener Tag und Trigger fu\u0308r das Tracking von Ereignis bei Klick<\/div>
              Der Tag trackt in einem Google Analytics 4-Ereignis, wenn du auf den Senden-Button des Kontaktformulars klickst (Trigger).<\/div><\/div><\/div>
                \n
              1. We replace the existing trigger with a new trigger of type “Trigger Group”. In a trigger group, we can have several triggers defined as conditions that must all be fulfilled for the tag to be fired. Consequently, we add the existing trigger “Submit contact form” to the trigger group.<\/li>\n<\/ol>\n<\/div><\/div>
                \"Google<\/a><\/div>
                  \n
                1. Au\u00dferdem f\u00fcgen wir der Trigger-Gruppe einen zweiten Trigger hinzu, mit dem wir \u00fcberpr\u00fcfen, ob bereits eine Einwilligung f\u00fcr Google Analytics erteilt wurde. Der Trigger ist vom Typ \u201cSeitenaufruf\", aber wir lassen ihn nicht bei allen Seitenaufrufen ausl\u00f6sen, sondern w\u00e4hlen \"Einige Seitenaufrufe\". Als Bedingung muss die Variable \"ga-opt-in\" genau den Wert true<\/code> enthalten (Bedingungstyp ist gleich<\/code>).<\/li>\n<\/ol>\n<\/div><\/div>
                  \"Google<\/a><\/div>

                  Damit haben wir die Einrichtung abgeschlossen. Das Tag wird nur ausgel\u00f6st, wenn der Klick auf den Button ausgef\u00fchrt wurde und gleichzeitig die Einwilligung zum Tracking gegeben wurde. Du kannst im Tag Assist sehen, wann welche Bedingung aus der Trigger-Gruppe erf\u00fcllt ist und folglich der Tag ausgel\u00f6st wird.<\/p>\n<\/div><\/div><\/div><\/div><\/div><\/div><\/div><\/section>","protected":false},"template":"","topic":[28],"class_list":["post-904","knowledge-base","type-knowledge-base","status-publish","hentry","topic-getting-started-rcb"],"acf":[],"_links":{"self":[{"href":"https:\/\/devowl.io\/de\/wp-json\/wp\/v2\/knowledge-base\/904","targetHints":{"allow":["GET"]}}],"collection":[{"href":"https:\/\/devowl.io\/de\/wp-json\/wp\/v2\/knowledge-base"}],"about":[{"href":"https:\/\/devowl.io\/de\/wp-json\/wp\/v2\/types\/knowledge-base"}],"version-history":[{"count":38,"href":"https:\/\/devowl.io\/de\/wp-json\/wp\/v2\/knowledge-base\/904\/revisions"}],"predecessor-version":[{"id":238730,"href":"https:\/\/devowl.io\/de\/wp-json\/wp\/v2\/knowledge-base\/904\/revisions\/238730"}],"wp:attachment":[{"href":"https:\/\/devowl.io\/de\/wp-json\/wp\/v2\/media?parent=904"}],"wp:term":[{"taxonomy":"topic","embeddable":true,"href":"https:\/\/devowl.io\/de\/wp-json\/wp\/v2\/topic?post=904"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}