Dokumentation - we_cookie_consent 4.01 - English

• 1. Introduction
• 1.1. What does the extension do?
• 1.2. Properties
• 1.3. Compatibility
• 1.4. Demo
• 2. Setup
• 2.1. Prerequisites
• 2.2. Installation
• 2.3. Receive extension
• 2.3.1. Via the Extension Manager in the TYPO3 backend
• 2.3.2. From the TYPO3 Extension Repository or Packagist
• 2.3.3. Via Composer
• 2.4. Integration
• 2.4.1. Installation of the static template supplied
• 2.4.2. Linking the data record storage locations
• 3. Configuration
• 4. Administration
• 4.1. Maintaining the service without Google Tag Manager
• 4.1.1. Maintenance of an integrated service
• 4.1.2. Maintenance of an individual service
• 4.2. Maintaining the services with Google Tag Manager
• 4.2.1. Creating the Google Tag Manager in the Cookie Consent Extension
• 4.2.2. Creation of a service/script in the extension, which is integrated via the GTM
• 4.2.3. Adding categories
• 4.2.4. Creating the service in Google Tag Manager
• 4.2.5. Use of the Google Tag Manager export function within the Cookie Consent Extension
• 5. Adding the cookie overview in the privacy policy
• 6. Test mode
• 7. Additional
• 7.1. Customizing the TYPOScript parameters
• 7.2. Localization
• 7.3. Adjustments to the design
• 8. Use of the Google Consent Mode
• 8.1. Consent Mode Update
• 8.2. Consent Mode WITHOUT Google Tag Manager
• 8.3. Consent Mode WITH Google Tag Manager
• 9. Do not forget!
• 10. Acknowledgments

According to the ruling of the European Court of Justice (ECJ), website operators must obtain the active consent of users for the use and storage of cookies or scripts on the user's computer. It is therefore not sufficient to simply point these out or to use them before active consent has been given. With the we_cookie_consent extension, you can integrate cookies or scripts on your website in compliance with data protection regulations.

In the current version, the extension also includes the option of playing the Google Consent Mode for the services "Google Analytics" and "Google Tag Manager Services".

1. Activates cookies only after consent
2. Data protection compliant consent solution
3. Provision of user settings
4. Simple Google Tag Manager export
5. Provision of cookie information in the privacy policy
6. Preconfigured modules for Google Analytics, Google Tag Manager, Facebook, YouTube and Vimeo
7. Can be extended with tracking scripts as required
8. Activation of Google Consent Mode Basic and Advanced
9. Activation of the Google Consent Mode consent types: ad_storage, analytics_storage, ad_user_data, ad_personalization, personalization_storage, functionality_storage
10. Provision and connection of a Google Tag Manager template

• TYPO3 10.4
• TYPO3 11.5
• TYPO3 12.4

https://consent.websedit.de/

The extension uses jQuery in the frontend. If you are already using the jQuery libary, no customization is necessary. Otherwise, you must integrate jQuery. Future versions of the extension should work without jQuery.

The extension is installed like any TYPO3 extension. There are 4 sources of supply:

TYPO3 TER: https://extensions.typo3.org/extension/we_cookie_consent
Packagist: https://packagist.org/packages/websedit/we-cookie-consent
Github: https://github.com/websedit/we_cookie_consent
Composer: composer req typo3-ter/we-cookie-consent

1. As a user with admin rights, navigate to the Extensions module
2. In the select box, navigate to the Add extensions sub-module. 
3. Click on "Update now"
4. Enter the key we_cookie_consent in the search field
5. Click on the cloud symbol in the hit list to import and install the extension.

(https://extensions.typo3.org/extension/we_cookie_consent)

1. Download the ZIP file
2. Unzip the ZIP file and move the content to the TYPO3 extension directory (typo3conf/ext/)
3. Navigate to the Extensions module in the TYPO3 backend as a user with admin rights
4. Search for the extension we_cookie_consent
5. Click on the cube icon with the plus to install the extension

Installation via Composer is possible via TYPO3's own repository (https://composer.typo3.org/satis.html).

Three steps are necessary:

1. Make the TYPO3 repository known in composer.json:
   composer config repositories.0 composer https://composer.typo3.org/
2. Install the extension with the package name typo3-ter/we-cookie-consent:
   composer req typo3-ter/we-cookie-consent
3. Activate the extension via the extension manager in the ba

1. As a user with admin rights, navigate to the Template module
2. In the page tree, navigate to the page in which you have stored your templates.
3. Select the Info/Edit submodule in the select box (usually preselected)
4. Switch to edit mode by clicking on the Edit complete template data record button
5. Click on the Contains tab
6. Select Cookie Consent (we_cookie_consent) in the Available objects area on the right-hand side
7. This then moves to the left to the Include static templates (from extensions) area
8. Click on Save
9. The integration is complete 

1. As a user with admin rights, navigate to the Template module
2. Navigate to the root page (globe) in the page tree
3. Select the Constants editor sub-module in the select box
4. Select WEBSEDIT COOKIE CONSENT in the select box
5. Enter the UID of your privacy page as Privacy Page
6. Under Default storage PID, enter the UID of the Cookie Consent data record folder, see chapter 3

Creating a data record folder

Navigate to the List module in TYPO3
Create a new data record folder in the page tree
Give the folder the name Cookie Consent
Activate the folder

Find out which cookies are used on your website

1. For example, you can call up the URL https://www.cookiemetrix.com/ and analyze your website. We will also be offering a cookie analysis tool shortly.
2. Check your cookies and identify the cookies that require labeling

INFO: When creating services with version 2.0.0 and TYPO3 7.6, the following error message may occur:

Method Websedit\WeCookieConsent\ViewHelpers\Format\EscapeViewHelper::render() does not exist

If you encounter this problem, change the EscapeViewHelper from renderStatic() to render():

The we_cookie_consent extension offers simplified integration for certain services. These are Google Analytics, Google Analytics Universal, Facebook Pixel and Matomo. For these scripts, you only need the ID of the service and not the complete tracking code.

1. Navigieren Sie zum Modul Liste
2. Klicken Sie im Seitenbaum auf den Ordner Cookie Consent
3. Für das erstmalige Erstellen eines Datensatzes klicken Sie im Inhaltsbereich auf das „+“. Wählen Sie unter dem Punkt GDPR: Cookie Consent --> Service aus.
4. Für das Anlegen aller weiteren Datensätze, klicken Sie auf das „+“ neben Anbieter
5. Wählen Sie unter „Anbieter“ den Service aus, den Sie integrieren möchten (Google Analytics, Google Analytics Universal, Facebook oder Matomo)
6. Geben Sie unter Titel des Service oder Skripts einen Namen ein
7. Fügen Sie im Feld Beschreibung eine Beschreibung hinzu (Erklärung zur Verwendung des Service oder Skripts)
8. Navigieren Sie zu dem Tab Cookies und klicken auf + Weiteres Cookie hinzufügen
9. Fügen Sie den Cookie-Namen, den Cookie-Zweck und die Cookie Lebenszeit gemäß der DS-GVO Vorgaben hinzu (Im Eingabefeld Cookie Lebenszeit, können Sie Minuten, Tage oder Stunden eintragen. Wichtig hierbei ist, das Sie die Zeiteinheit dahinter schreiben)
10. Nehmen Sie in dem Tab Einstellung die gewünschte Einstellung vor, wie das Script geladen werden soll
11. Im Tab Authentifizierung fügen Sie den Key des gewünschten Service ein
12. Klicken Sie auf Speichern

1. Navigate to the List module
2. Click on the Cookie Consent folder in the page tree
3. To create a data set for the first time, click on the "+" in the content area. Under GDPR: Cookie Consent --> Service, select Service.
4. To create all further data records, click on the "+" next to Provider
5. Under "Provider", select the service you would like to integrate (Google Analytics, Google Analytics Universal, Facebook or Matomo)
6. Enter a name under Title of the service or script
7. Add a description in the Description field (explanation of how to use the service or script)
8. Navigate to the Cookies tab and click on + Add another cookie
9. Add the cookie name, the cookie purpose and the cookie lifetime in accordance with the GDPR requirements (in the Cookie lifetime input field, you can enter minutes, days or hours. It is important that you write the time unit behind it)
10. In the Settings tab, make the desired setting for how the script should be loaded
11. In the Authentication tab, enter the key of the desired service
12. Click on Save

Your service is now displayed in the cookie consent overview.

The we_cookie_consent extension offers simplified integration for certain services. These are Youtube and Vimeo. You do not need a service ID or tracking code for these scripts. There is a contextual consent for these services.

1. Navigate to the List module
2. Click on the Cookie Consent folder in the page tree
3. To create a data set for the first time, click on the "+" in the content area. Under GDPR: Cookie Consent --> Service, select Service.
4. To create all further data records, click on the "+" next to Provider
5. Under "Provider", select the service you want to integrate (Youtube or Vimeo)
6. Enter a name under Title of the service or script
7. Add a description in the Description field (explanation of how to use the service or script)
8. Navigate to the Cookies tab and click on + Add another cookie
9. Add the cookie name, the cookie purpose and the cookie lifetime in accordance with the GDPR requirements (in the Cookie lifetime input field, you can enter minutes, days or hours. It is important that you write the time unit behind it)
10. In the Settings tab, make the desired setting for how the script should be loaded
11. Click on Save

Your service is now displayed in the cookie consent overview.

1. Navigate to the List module
2. Click on the Cookie Consent folder in the page tree
3. To create a data set for the first time, click on the "+" in the content area. Select the GDPR: Cookie Consent Service item.
4. To create all further data records, click on the "+" next to Provider
5. Under "Provider", select Additional service
6. Enter a name under Title of the service or script
7. Add a description in the Description field (explanation of how to use the service or script)
8. Navigate to the Cookies tab and click on + Add another cookie
9. Add the cookie name, the cookie purpose and the cookie lifetime in accordance with the GDPR requirements
10. In the Settings tab, make the desired setting for how the script should be loaded
11. In the Development tab, add the script for the desired service
12. Click on Save

Your service is now displayed in the Cookie Consent overview

There is a contextual consent for this service. This can be accessed via "other-ID", "data-name" and "data-src".
The ID corresponds to the ID of the provider. 
The attributes "data-name" and "data-src" are used to automatically output the contextual consent in the code if there is no consent for the provider yet.

Example with provider "other-43":

1. Navigate to the List module
2. Select Cookie Consent in the page tree
3. Click on the "+" to create a new data record
4. Under "Provider", select Google Tag Manager
5. Enter a name under Title of the service or script
6. Add a description in the Description field
7. Navigate to the Cookies tab and click on + Add another cookie
8. Add a cookie name, the cookie purpose and the cookie lifetime
9. In the Settings tab, make the desired setting for how the script should be loaded
10. In the Authentication tab, add the Google Tag Manager ID in the format GTM-XXXXXXX
11. Click on Save

1. Navigate to the List module
2. Select Cookie Consent in the page tree
3. Click on the "+" to create a new data record
4. Under "Provider", select Google Tag Manager - Service
5. Enter a name under Title of the service or script
6. Add a description in the Description field
7. Navigate to the Cookies tab and click on + Add another cookie
8. Add a cookie name, the cookie purpose and the cookie lifetime of the service
9. In the Settings tab, make the desired setting for how the script should be loaded
10. Add the ID of the desired service in the Authentication tab
11. Navigate to the "Google Tag Manager" tab. Fill in all fields here! You will need these entries again in the Google Tag Manager interface
12. Click on Save

The categorization of a service is based on TYPO3's own system category data set. To do this, proceed as follows:

1. Navigate to the List module
2. Select Cookie Consent in the page tree
3. Click on the "+" to create a new category
4. Save the category
5. Go back to the Cookie Consent overview
6. Edit the service to which you want to assign a category
7. Click on the Categories tab
8. Select the desired category and click on save

(https://www.google.com/intl/de/tagmanager/)

1. Log in (https://www.google.com/intl/de/tagmanager/)
2. Click on Variables in the left-hand area
3. Create a new user-defined variable in Google Tag Manager
4. Give the variable a name
5. Select the variable type data layer variable
6. Give the data layer variable the identical name that you selected in the Cookie Consent Extension for the corresponding service.
7. Save the variable
8. Create a new trigger in Google Tag Manager
9. Give the trigger a name
10. Select the trigger type "User-defined event"
11. Give the trigger the identical event name that you have selected in the Cookie Consent Extension for the corresponding service.
12. Select some user-defined events under "Trigger this trigger"
13. For "Trigger this trigger when an event occurs and all these conditions are met", select the variable created for this service "is equal to" "true"
14. Create a tag for the corresponding service and select the associated trigger that you created previously
15. Click on the "Send" button at the top left of the Google Tag Manager interface
16. Enter a version name and a version description
17. Click on "Publish" at the top left of the Google Tag Manager interface

- Needs to be done -

1. Navigate to the module Page
2. In the page tree, navigate to the page with your privacy policy
3. Create a new content element by clicking on + Content
4. In the "Create new content element" window, navigate to the Plug-ins tab
5. Click on Cookie list
6. Click on the Plug-in tab
7. Click on the folder icon in the Services & Scripts area on the left
8. The Data set selection window opens
9. Select the folder in which you have created your cookies
10. Select the desired data set
11. Under Provider, add all the cookies that you want to be displayed later in the privacy policy

Click on Save after you have added all cookies

The Cookie Consent Extension can be run in test mode during setup and before going live. To do this, append #klaro-testing to your domain.

Example:
https://www.yourdomain.com/#klaro-testing

1. Storage folder: The ID of the data record folder is stored here. See point 2.4.2.
2. Privacy page: You must enter the UID of your privacy page in the Privacy page input field. See point 2.4.2.
3. Style Prefix: In the Style Prefix input field, you can adjust the positioning of the cookie banner.
   Input options:
   • Display at the bottom of the screen: klaro we_cookie_consent (default)
   • Display at the top of the screen: klaro we_cookie_consent notice--top
   • Display in the middle with the buttons below each other: klaro we_cookie_consent notice--center
   • Display in the center with the buttons below and next to each other: klaro we_cookie_consent notice--center--floated
   • Unstyled output without CSS: nostyle
4. Additonal Class: Here you can add an additional CSS class for the styling
5. Storage Method: Here you can set whether the user settings should be saved in a cookie or in the browser's local storage. (Default: Cookie)
6. Cookie Name: You can change the name of your consent cookie in the Cookie Name input field. This was designed for the use of different language versions with different services that are provided via directories and not via different top level domains.
7. Lifetime: In the Lifetime input field, you can specify the validity period of the cookie. After this time has expired, the user is asked to accept the cookies again. The default setting is 365 days.
8. State: In the State input field, you can set whether your cookies are preset to activated or deactivated in the cookie banner. Input options: false (default), true (not GDPR compliant!)
9. Must Consent: In the Must Consent input field, you can set whether users can use your website without interacting with the cookie banner. Input options: false (default), true (not GDPR compliant!)
10. Group Service: Here you can activate or deactivate the grouping of services into categories. The grouping is based on TYPO3 system categories.
11. Accept all: Here you can set whether all services are activated when the banner is clicked away without user action.
12. Hide Decline all: Here you can set whether the "Decline" button should be displayed. (The button is displayed by default)
13. Hide Learn more: Here you can set whether the "Edit settings" button should be displayed. (The button is displayed by default)
14. Cookie domain: Here you can configure whether the settings made are only valid for the current domain or also for subdomains.
15. Consent Mode Basic: The default settings for Google Consent Mode Basic can be activated here: With Google Consent Mode Basic, NO Consent Mode default settings are initially loaded for the consent types!
16. Consent Mode Advanced: The default settings for Google Consent Mode Advanced can be activated here: With Google Consent Mode Advanced, ALL Consent Mode default settings for the consent types are initially loaded with "Denied"! This makes it possible to model the data with Google Analytics, for example, without consent.

IMPORTANT: Before using Google Consent Mode, please check how you are allowed to handle the data and which jurisdiction or company guidelines apply to you!

In the settings of the constant editor, do not enter a value for Language or leave it set to Default (en).

All labels are stored in the locallang.xlf files. These can be overwritten using TypoScript, for example. This could then look like this:

If you want to make CSS adjustments, please first create a copy of the supplied CSS file so that your changes are not lost with the next update.

To do this, proceed as follows:

1. Copy the file from the path /typo3conf/ext/we_cookie_consent/Resources/Public/Stylesheet/style.css
2. Into the fileadmin, your sitepackage, or another location of your choice
3. Overwrite the path to the CSS file using page.includeCSS.we_cookie_consent_style=/fileadmin/mypackagename/css/we_cookie_consent_style.css
4. Make the adjustments in your copied file

You want to make adjustments but don't know how. Our support team will be happy to help you.

You can find our contact details at:
https://consent.websedit.de/ 

The current version of the extension we_cookie_consent offers the activation of the Google Consent Mode in the modes "Basic" or "Advanced".

* If tags are blocked due to the user consent settings, no data is collected. A general model is then used for conversion modeling in Google Ads. Characteristics such as browser type, type of conversion action, time of day and other general, non-identifiable variables are used for the models.
Source: https://support.google.com/analytics/answer/9976101

The default content types are activated via the TYPOScript parameters, as described in section 7.1. Initially, the following content types are supported and set depending on whether they work WITH or WITHOUT Google Tag Manager:

When selecting a Google service such as Google Analytics or Google Tag Manager Service, the respective consent types can be selected via the data records in the Google Consent Mode tab after an update. These are set in the cookie as soon as a user agrees to the service.

There are three modes to choose from:

IMPORTANT: Leave consent types on "Not set" if they do not play a role for a service and only set consent types to "denied" or "granted" if they are relevant.

When using an integrated or individual service WITHOUT Google Tag Manager (e.g. Google Analytics), proceed as follows:

1. Activate the Consend Mode "Basic" or "Advanced" in the TYPO3Script parameters
2. Navigate to the List module and select Cookie Consent in the page tree
3. Click on the edit icon of the corresponding Google service
4. In the Google Consent Mode tab, make the settings for the consent types in case of consent
5. Click on Save
6. Done

When using an integrated or individual service WITH Google Tag Manager (Google Tag Manager service), proceed as follows:

1. Activate the Consend Mode "Basic" or "Advanced" in the TYPOScript parameters
2. Navigate to the List module and select Cookie Consent in the page tree
3. Click on the edit icon of the corresponding Google service
4. In the Google Consent Mode tab, make the settings for the consent types in the event of consent
5. Click on Save
6. Download the GTM template (template.tpl) for we_cookie_consent from Github (https://github.com/websedit/gtm-template-typo3-we_cookie_consent-cmp)
7. Switch to the Google Tag Manager interface (https://www.google.com/intl/de/tagmanager/)
8. Click on Templates in the left-hand area
9. Click on "New" in the "Tag templates" area on the right to create a new template
10. In the subsequent window, click on the three dots at the top right and select "Import"
11. Select the downloaded template.tpl file and click on "Open"
12. Finally, click on "Save" in the top right-hand corner of the template editor. The template is now imported.
13. Switch to Tags in the left-hand area
14. Create a new tag, give it the name "TYPO3 we_cookie_consent CMP" and select the template "TYPO3 we_cookie_consent CMP" in the tag configuration
15. Configure the setting options (Default consent settings, Wait for Update, Redact Ads Data, Enable URL passthrough, Cookie ID to check) according to your requirements.
    Important: You do not need to carry out any configuration. The template is structured in such a way that it is compatible with the default settings of the TYPO3 extension we_cookie_consent. Entries for the "Default consent settings" and "Cookie ID to check" are therefore not mandatory.
16. Set the value for "Wait for Update" to "500" ms. This is usually sufficient.
17. Assign the trigger "Consent Initialization - All Pages" to the new tag
18. Also assign each trigger that contains a Google service to the new tag using the "or" link
19. Then use the preview function of the Google Tag Manager to check extensively whether all services with the correct consent types are being rolled out and your tags are being fired in the right place.
20. Once all tests have been completed, you can publish the new tag via "Send"

After maintaining the cookie consent extension, make sure that each tracking code only appears once on your website. If you have maintained the same tracking code multiple times on your website, this may result in data collection errors.

We use open source software.
We would like to thank all those involved in the Klaro!
https://github.com/KIProtect/klaro