Debugging and troubleshooting tags with Google Tag Manager (GTM) using its preview mode involves a series of steps. Here’s a comprehensive guide:
1. Enable Preview Mode
- Open GTM: Log in to your Google Tag Manager account.
- Enter Preview Mode: Click on the “Preview” button in the top right corner of the workspace. This will open the Tag Assistant interface in a new tab.
2. Connect Your Site
- Enter the URL: In the Tag Assistant interface, enter the URL of the site you want to debug and click “Start.”
- Site Loads in Debug Mode: Your website will open in a new window with the debug console at the bottom of the page.
3. Understanding the Debug Console
The debug console is divided into several sections:
- Summary: Shows an overview of all tags, triggers, and variables loaded on the page.
- Tags: Displays tags that have fired and those that haven’t, along with reasons.
- Variables: Shows the current state of variables at different points during the page load.
- Data Layer: Lists the contents of the data layer and changes over time.
- Errors: Highlights any errors encountered.
4. Analyze Tag Firing
- Check Fired Tags: In the “Tags” section, you can see which tags have fired on the page. This is useful to confirm if a tag is working as expected.
- Check Non-Fired Tags: This shows tags that didn’t fire, which can help identify why a tag isn’t working.
5. Inspect Triggers
- Trigger Conditions: In the “Tags” section, click on a tag to see its trigger conditions. This helps verify if the conditions are set correctly.
- Trigger Events: In the left panel, you can see the list of events that occurred on the page. Click on an event to see which tags fired during that event.
6. Review Variables
- Variable Values: Go to the “Variables” tab to see the values of different variables at each event. This can help troubleshoot why certain conditions might not be met.
- Custom Variables: Ensure custom variables are being populated correctly as per your configurations.
7. Check Data Layer
- Data Layer Changes: Review the “Data Layer” tab to see how the data layer changes over time and ensure it contains the expected values.
- Pushes: Verify that data layer pushes are happening correctly at the right times.
8. Address Errors
- Review Errors: In the “Errors” section, look at any errors listed and address them accordingly.
- Tag Errors: If a specific tag has an error, clicking on it will provide more details.
9. Real-Time Verification
- Use Google Analytics Real-Time: If your tags are for Google Analytics, check the real-time report in Google Analytics to see if events, pageviews, or other hits are being sent correctly.
10. Publish Changes
- Once you have verified that your tags are working correctly in preview mode, you can publish the changes by clicking the “Submit” button in GTM.
By following these steps, you should be able to effectively debug and troubleshoot tags using Google Tag Manager’s preview mode.