Google Tag Manager Installation
When using Osano CMP together with Google Tag Manager you have 2 options for how to install the osano.js script.
- Direct install (recommended): place osano.js first in the <head> tag of your page so that it loads before Google Tag Manager
- Install via Google Tag Manager (not recommended): Use Google tag manager to manage your osano.js tag.
Please be aware that in order for Osano's obligations under the “No fines, No penalties” pledge (Section 4.7 of the Enterprise Terms of Service - Reimbursement of Regulatory Fines or Penalties) to apply, you must use the Direct Install method (in accordance with the documentation on this page) and be on the most up-to-date version of Osano CMP.
Get the osano.js script
- Before you can install osano.js, you must first generate the script by creating and publishing a CMP configuration. Navigate to the "Consent Management" tab in my.osano.com and create a new Consent Configuration.
Once published, use the "Get Code" button to copy the osano.js script tag.
Osano.js can work on any platform and with any script manager or loader when added directly to the <head> element of a website. This means that Osano will work without having to do any additional configuration within Google Tag Manager or other script management solutions, if you choose this install method.
To install, simply copy and paste the osano.js code snippet into the header <head> for all pages you wish to monitor. Ensure that osano.js is the first script that loads on your site. If possible, we recommend testing in a staging/pre-production environment.
Note: If your pre-production environment has different tags than your production environment, it will be beneficial to test in "Permissive" mode before switching into "Strict".
Install via Google Tag Manager
While it is possible to load osano.js via Google Tag Manager, we strongly recommend loading it outside of Google Tag Manager in the site <head>. If you must implement osano.js via Google Tag Manager, then all non-essential scripts, cookies, and iframes must also be implemented and classified through Google Tag Manager and you will need to follow the steps below. Any resources loaded outside of Google Tag Manager (directly on the page, for instance) will be able to load before osano.js can intercept them.
Important note: scripts, cookies, and iframes that are not managed by Google Tag Manager will not be reported by osano.js in my.osano.com.
1. Set up Osano’s consent manager community template
Add osano.js using our community template and set it up to trigger before all other scripts.
- In Google Tag Manager under Tags, add a new tag.
- Name it “Osano CMP”
- When choosing a tag type, select the option to discover or browse tags in the Community Template Gallery. Search for “osano”.
- Google Tag Manager will show you what permissions the template requires to operate correctly. Review and then add the template to your workspace.
- The tag configuration will require that you provide your Osano customer ID and configuration ID. These can be found in the “Get Code” dialog within your consent configuration:
- In the trigger field, select “Consent Initialization - All Pages”. This step is critical to correctly implement functionality.
- Save the new tag.
2. Set up an Osano trigger
This trigger will fire when osano.js has loaded and is ready to evaluate scripts for consent compliance.
- In Tag Manager under Triggers, add a new trigger.
- Name your trigger “Osano CMP ready”.
- For trigger type, choose “Custom Event”.
- For the event name, use this exactly: osano__cm--load-.+
- Check the option to use regex matching.
- Select the option to fire the trigger on all custom events.
- Save the trigger.
3. Set all of your other tags to use the new trigger
For every tag in your Google Tag Manager workspace (other than Osano CMP), set the trigger to be the one you created in step 2.
- Open the tag.
- Remove any existing trigger.
- Set the new trigger to be “Osano CMP ready”.
- Ensure that osano.js is the first script that loads on your site.
- It is not required to enable Google Consent Mode setting on your configuration when implementing osano.js through our Osano community template. For more information on when this setting is required, please see Osano and Google Consent Mode.
Setup consent listeners in a custom tag
You can also set up consent listeners in a custom tag by hooking into Osano’s public API (linked).
- Create a new "Custom HTML" tag
- Use window.Osano.cm.addEventListener to add your own custom events to the dataLayer and listen for osano-cm-initialized. Once initialized, all subsequent tags can be triggered.