Table of Contents
2. Enable & Customize Cookie Banner
3. Modify Cookie Groups & Consent Types
3.1 Edit or Create a New Cookie Group
3.2 Assign Cookie Types to Groups (Parameters)
4. Cookie Consent V2 on the Front End
1. Extension Installation
For Magento Marketplace Customers:
Find the extension’s Composer name and version in its composer.json file.
- Login to your SSH and run:
- composer require meetanshi/magento-2-google-consent-mode
- Enter your authentication keys. Your public key is your username; your private key is your password.
- Wait for Composer to finish updating your project dependencies and make sure there aren’t any errors.
- To verify that the extension is installed properly, run the command:
- php bin/magento module:status Meetanshi_GoogleConsentV2
- By default, the extension is probably disabled. Enable the extension and clear static view files:
- php bin/magento module:enable Meetanshi_GoogleConsentV2 --clear-static-content
- php bin/magento setup:upgrade
- For Magento version 2.0.x to 2.1.x - php bin/magento setup:static-content:deploy
- For Magento version 2.2.x & above - php bin/magento setup:static-content:deploy –f
- php bin/magento cache:flush
For Meetanshi Customers:
- Download the extension zip file and extract it to your Magento’s root directory.
- Login to your SSH and run below commands step by step:
- php bin/magento setup:upgrade
- For Magento version 2.0.x to 2.1.x - php bin/magento setup:static-content:deploy
- For Magento version 2.2.x & above - php bin/magento setup:static-content:deploy –f
- php bin/magento cache:flush
2. Enable & Customize Cookie Banner
Once the extension is installed, log into your Magento admin panel.
Navigate to Stores > Configuration > Meetanshi > Cookie Consent V2 and enable the extension.
This will enable the Google Cookie Consent functionality in your Magento 2 store.
To customize its design, you can use the following configuration options under Cookie Consent Settings.
General
The cookie preference button helps store visitors change their preferences anytime. It’s displayed on the website once the preferences are set.
- You can choose to hide or show this preferences button
- Set its background color to match your store’s style
For example, here’s what it looks like using the above configuration:
Cookie Notice Display Customization Settings
You can also change the cookie notice content and set the expiration time.
- Notification Text: Enter a text that you want to display in the cookie notice which is displayed when the customer first visits the website.
- More Information Link: Link to your cookie policy page that contains more information about the cookies your site uses.
- Consent Restriction Timeline: Enter the number of days for which the cookie consent preferences will be stored. The cookie notice will be displayed again to the visitors once the preferences expire.
The cookie notice has the following buttons:
- Accept - It marks all consent types as ‘granted’
- Decline - It marks all content types as ‘declined’ except the essential ones
- Set Custom Preferences - Opens the cookie preferences popup where the user can choose the cookies they want to accept
You can customize the text, text color, and background color for these buttons.
For example, here’s what the cookie consent notice customized using the above settings looks like:
3. Modify Cookie Groups & Consent Types
In the extension, you can create cookie groups and assign consent types to them. On the front end, when the customer chooses to allow/deny a specific cookie group, the state of all the assigned consent types is changed.
For example, the default configuration comes with the following cookie groups and consent types assigned to them:
Cookie Group | Consent Types (Parameters) |
Essential | - |
Advertisement | ad_storage ad_user_data ad_personalization |
Analytics | analytics_storage |
3.1 Edit or Create a New Cookie Group
Go to Cookie Consent V2 > Manage Cookie Groups where you can find all the existing cookie groups.
You can edit the existing cookie groups or create a new one by clicking the Add a New Group button.
For the cookie group, you can configure the following settings:
- Enabled: If enabled, the cookie group will be shown on the preferences
- Set as Essential: If enabled, it will be set to essential and users will not be able to disable it
- Cooke Group Code: Enter a unique identified code for the cookie group (you can keep it the same as the group name)
- Cookie Group Name: Enter a name for the cookie group that will be displayed on the preferences popup
- Description: Enter a description for the cookie group
- Sort Order: Set the sort order of the cookie group in the preferences popup
Once done, click the Save Group button.
3.2 Assign Cookie Types to Groups (Parameters)
Go to Cookie Consent V2 > Manage Consent Parameters where you can find all the existing consent types.
Here, you can edit the existing ones or create a new one to add to a cookie group.
Click the Add a New Consent Parameter button.
Now, set the following for the consent parameter:
- Parameter Code: Enter the consent code that you want to send to Google tag
- Default Status: Set the default status for the consent type (you can keep it granted or denied; it’s the status when the user has not set any preferences)
- Cookie Group: Assign the consent to a cookie group
Once done, click the Save Parameter button on the top right.
4. Cookie Consent V2 on the Front End
Once the extension is configured, the Google Cookie Consent Mode V2 becomes active on the front end.
Initially, the default consent preferences is sent to Google tag and the consent notice is displayed to the users on their first visit. Once they set their preferences, the updated consent states are sent to Google tags via data layer.
The customers can choose to accept all or only necessary cookies. They can also choose custom preferences and select the cookie groups they want to allow.
Based on the backend configuration and the customer’s selection, the consent states are sent to Google Tag via data layer. You can use Google Tag Assistant tool to debug the consent states in real-time.
For instance, here’s what the consent states look like in the current example:
Once the user sets the preferences, the cookie consent is not displayed till it expires. (You can specify the number of days to expire the consent in the configuration.)
If enabled, the cookie consent preferences button is displayed on the website, using which the users can modify their preferences anytime.
5. View Cookie Consent Logs
In the Magento 2 backend, you can also get insights on the cookie consent preferences of users. The Cookie Consent V2 > Cookie Consent Logs grid displays the log of preferences.