DSGVO Cookie Consent: Konfiguration der TYPO3 Extensions

Mit der DSGVO (Datenschutzgrundverordnung ) und der Cookie Richtlinie der EU ist es seit 2019 verpflichtend geworden, Besuchern der Webseite eine Möglichkeit zu bieten, den Zugriff von Cookies auf einen Rechner zu bearbeiten. Es reicht seitdem nicht mehr aus, nur eine Warnung zu schalten, dass man Cookies setzt. Eine Zustimmung zum Zugriff der Cookies (DSGVO Cookie Consent) ist seitdem erforderlich.

Zu diesem Zweck kann man bei einer TYPO3 Webseite eine Extension installieren, mit deren Hilfe man Cookies wahlweise zulassen oder abschalten kann. In diesem Artikel beschreiben wir in der Konfiguration TYPO3 Extensions zwei Erweiterungen, die diesem Zweck dienen. Und beschreiben ebenso, wie man diese konfiguriert. Beide Extensions sind im TYPO3 Extension Repository (TER) verfügbar.

TYPO3 Extension Cookieman

Diese Extension kommt bei mehreren unserer Webseiten zum Einsatz und ist unsere (Stand: Juni 2020) Empfehlung für die Konfiguration eines Cookie Banner. Der große Vorteil dieser Extension ist, dass sie für sich selbst steht und relativ einfach zu konfigurieren ist, wobei man Erfahrung in TypoScript voraussetzen muss.

Die TYPO3 Extension Cookieman finden Sie mit diesem Link im TER: 
 https://extensions.typo3.org/extension/cookieman 

Die Konfiguration der TYPO3 Extension Cookieman finden Sie hier: 
  https://docs.typo3.org/p/dmind/cookieman/master/en-us/

Nach der Installation und Einbindung der Extensions im Template können Sie mit der Konfiguration beginnen. Dazu müssen Sie im Setup Ihrer TYPO3 Webseite einen entsprechenden Quellcode einbinden. Eine Vorlage dazu finden Sie in der sehr guten Dokumentation der Extension. 

Konfiguration der TYPO3 Extension Cookieman

Diese Konfiguration bietet zwei Bereiche, die man konfigurieren muss: 

  • Gruppen für die Anzeige im Frontend 
  • Beschreibung der Cookies der einzelnen Gruppen 

Hier ein Beispiel für den TypoScript Code dieser Extension: 

 plugin.tx_cookieman {
  settings {
    ## Link zur Datenschutzerklärung
    links.dataProtectionDeclarationPid = 42
        
    ## Link zum Impressum
    links.imprintPid = 21
        
    ## Theme einbinden
    trackingObjects {
      GoogleAnalytics {
        inject (
          <script>
            (function(i,s,o,g,r,a,m){i['GoogleAnalyticsObject']=r;i[r]=i[r]||function(){
            (i[r].q=i[r].q||[]).push(arguments)},i[r].l=1*new Date();a=s.createElement(o),
            m=s.getElementsByTagName(o)[0];a.async=1;a.src=g;m.parentNode.insertBefore(a,m)
            })(window,document,'script','https://www.google-analytics.com/analytics.js','ga');
            ga('create', 'UA-12345678-1', 'auto');
            ga('send', 'pageview');
            ga('set', 'anonymizeIp', true);
          </script>                
        )
        show {
          _ga {
            duration = 2
            durationUnit = years
            type = cookie_http+html
            provider = Google
          }
          _gid {
            duration = 24
            durationUnit = hours
            type = cookie_http+html
            provider = Google
          }
          _gat {
            duration = 1
            durationUnit = minute
            type = cookie_http+html
            provider = Google
          }
        }                
      }
    }   
               
    groups {
      marketing {
        trackingObjects {
          10 = GoogleAnalytics
        }
        respectDnt = 1
        showDntMessage = 1
      }
    }
  }
}

Was man zudem noch hinzufügen muss, ist eine Möglichkeit für den Besucher, zu jedem beliebigen Zeitpunkt die Schaltfläche zur Konfiguration der Cookies im Browser zu erreichen. 

 <a href="#" onclick="cookieman.show()" >Cookie Einstellungen</a>

Diesen Code können Sie entweder auf einer Seite wie der Datenschutzerklärung einbinden oder selbst einen Button in Ihre Webseite einbauen, der für den Besucher zugänglich ist. Hier haben Sie die volle Gestaltungsfreiheit des Frontend, um eine Lösung im Layout Ihrer TYPO3 Webseite zu schaffen. 

TYPO3 Extension Cookie Consent

Auch diese TYPO3 Extension bietet eine hervorragende Möglichkeit, eine Schaltfläche im Frontend zu generieren. Diese Extension steht jedoch nicht für sich alleine. Sie erweitert die Extension Clickstorm SEO (cs_seo) um einige Funktionen. Wenn Sie in Ihrer TYPO3 Installation bereits eine Extension wie Yoast einsetzen, kann dies naturgemäß zu Konflikten führen. 

Dabei regelt man die Einbindung der Software von Drittanbietern wie den Google Tag Manager oder Google Analytics über CS SEO. Je nach Entscheidung des Besuchers der Webseite regelt DP Cookie Consent dann den Zugriff der Cookies auf dessen Rechner.

TypoScript Konfiguration der Extension Cookie Consent

Die Konfiguration dieser Extension geschieht, wie beim vorhergehenden Beispiel auch, über TypoScript und nicht über eine Benutzeroberfläche im Backend von TYPO3. In dieser Konfiguration können Sie verschiedene Parameter des Layouts setzen. Dazu gehören das Aussehen und die Position des Popups zum Setzen der Optionen für Cookies und für einen schwebenden Button, mit dem Sie jederzeit auf diese Einstellungen zugreifen können. Eine detaillierte Beschreibung der einzelnen Parameter finden Sie in der Dokumentation der Extension bei Github, die unten verlinkt ist. 

Hier sehen Sie ein Codebeispiel mit TypoScript für eine Konfiguration:

 plugin.tx_cookieconsent.settings {
  # PID to Data Protection
  url = 42
  # Layout
  theme = edgeless
  # Position
  position = bottom-right
  # dismiss on scroll (in PX)
  dismissOnScroll =
  # Type (info, opt-out, opt-in)
  type = opt-in
  # extend layout with checkboxes (basic,dpextend)
  layout = dpextend
  #  pre check statistics in checkboxes layout
  statistics = true
  # pre check statistics in checkboxes layout
  marketing = false
  
  # show Iframe overlay
  overlay {
    # Enable Iframe overlay
    notice = true
    
    box {
      # Overlay: Background
      background = rgba(0,0,0,.8)
      # Overlay: Text
      text = #0f0
    }
    button {
      # Overlay Button: Background
      background = #b81839
      # Overlay Button: Text
      text = #0f0
    }
  }
    
  # Cookiehint Style
  palette {
    popup {
      # Bar: Background color
      background = #2473be
      # Bar: text color
      text = #0f0
    }
    button {
      # Button: Background color
      background = #f96332
      # Button: text color
      text = #0f0
    }
  }
}

Zusätzlich haben Sie die Möglichkeit, die Texte für die Benutzeroberflächen der Besucher anzupassen. Diesen TypoScript Code können Sie ebenfalls in Ihr Setup einbinden: 

 plugin.tx_dp_cookieconsent._LOCAL_LANG {
  de {
    message = Diese Seite nutzt Cookies [...].
    dismiss = Speichern
    link = Zur Datenschutzerklärung
    deny = Schließen
    
    # Checkbox labels
    dpRequire = Notwendig
    dpStatistik = Statistik
    dpMarketing = Marketing
  }
}

Weitere Informationen zu diesen TYPO3 Extensions

Die TYPO3 Extension DP Cookie Consent finden Sie mit diesem Link im TER: 
 https://extensions.typo3.org/extension/dp_cookieconsent 

Die Konfiguration der DP Cookie Consent Extension finden Sie hier: 
 https://github.com/DirkPersky/typo3-dp_cookieconsent 

Die TYPO3 Extension CS SEO finden Sie mit diesem Link im TER: 
 https://extensions.typo3.org/extension/cs_seo/