Setting up and using custom templates in Google Tag Manager (GTM) allows you to create reusable, standardized tag and variable configurations. Custom templates enhance flexibility, ensure consistency, and simplify tag management, especially for non-standard implementations or third-party tags not natively supported by GTM. Here’s a step-by-step guide on how to set up and use custom templates in GTM.
Table of Contents
Toggle1. Understanding Custom Templates
Custom templates in GTM come in two types:
- Tag Templates: Define custom tags.
- Variable Templates: Define custom variables.
2. Create a Custom Tag Template
2.1 Create the Tag Template
- Log in to GTM:
- Go to Google Tag Manager and log in with your Google account.
- Navigate to Templates:
- In your GTM container, click on the Templates section in the left-hand menu.
- Create a New Tag Template:
- Click on New under the Tag Templates section.
- Click on Create in the template editor.
2.2 Define Tag Configuration
- Add Tag Fields:
- Click on Add Field and choose the field type based on the information your tag requires (e.g., text, URL, number).
- Configure the Fields:
- For each field, provide a name, label, and any necessary validations (e.g., required, URL validation).
- Set Default Values:
- Optionally, set default values for fields to streamline tag setup for users.
2.3 Write the Tag Code
- Open the Code Editor:
- Click on the Code tab in the template editor.
- Use the provided sandboxed JavaScript environment to write the code that will execute when the tag fires.
- For example, if creating a custom remarketing tag, include the script to send data to your remarketing endpoint.
2.Write JavaScript for the Tag:
3. Test the Code:
-
- Click on Preview to test your custom tag code in a sandbox environment.
2.4 Save and Publish the Template
- Save the Template:
- Once your tag configuration and code are complete, click Save.
- Provide a name and description for your custom template.
- Publish the Container:
- Click Submit in GTM, provide a version name and description, and then click Publish.
3. Use the Custom Tag Template
- Create a New Tag Using the Template:
- Go to the Tags section and click on New.
- Click on Tag Configuration and select your custom tag template from the list.
- Fill in the Required Fields:
- Enter the necessary information in the fields you defined in the template.
- Add Trigger:
- Click on Triggering and select an appropriate trigger for when the tag should fire.
- Save and Publish:
- Save the tag configuration.
- Submit and publish the container to make the tag live on your website.
4. Create a Custom Variable Template
4.1 Create the Variable Template
- Navigate to Templates:
- In the Templates section, click on New under Variable Templates.
- Create a New Variable Template:
- Click on Create in the template editor.
4.2 Define Variable Configuration
- Add Variable Fields:
- Click on Add Field and choose the field type based on the data your variable needs to collect or generate (e.g., text, number, regex).
- Configure the Fields:
- Provide a name, label, and any necessary validations for each field.
- Set default values if needed to streamline variable setup for users.
4.3 Write the Variable Code
- Open the Code Editor:
- Click on the Code tab in the template editor.
- Write JavaScript for the Variable:
- Use the provided sandboxed JavaScript environment to write the code that will define the variable’s behavior.
- For example, if creating a custom variable to extract a value from the URL, write the necessary code:
Test the Code: -
- Click on Preview to test your custom variable code in a sandbox environment.
4.4 Save and Publish the Template
- Save the Template:
- Once your variable configuration and code are complete, click Save.
- Provide a name and description for your custom template.
- Publish the Container:
- Click Submit in GTM, provide a version name and description, and then click Publish.
5. Use the Custom Variable Template
- Create a New Variable Using the Template:
- Go to the Variables section and click on New.
- Click on Variable Configuration and select your custom variable template from the list.
- Fill in the Required Fields:
- Enter the necessary information in the fields you defined in the template.
- Save the Variable:
- Save the variable configuration.
6. Testing and Debugging
- Enable Preview Mode:
- In GTM, click on Preview to enable preview mode.
- Verify Custom Tags and Variables:
- Open your website in a new tab with the GTM debug console active.
- Verify that custom tags fire correctly and custom variables return expected values.
- Use Debugging Tools:
- Utilize browser developer tools and GTM’s built-in debugging tools to troubleshoot any issues.
7. Maintain and Update Custom Templates
- Regular Updates:
- Regularly review and update your custom templates to ensure they remain compatible with any changes to your website or third-party services.
- Documentation:
- Keep detailed documentation for each custom template, including its purpose, configuration options, and any known issues.
By following these steps, you can effectively set up and use custom templates in Google Tag Manager. Custom templates enhance flexibility, streamline tag and variable management, and ensure consistency across your GTM implementation. Regular testing, updating, and documentation will help maintain the effectiveness and reliability of your custom templates.
