> ## Documentation Index > Fetch the complete documentation index at: https://docs.paraminternationalltd.com/llms.txt > Use this file to discover all available pages before exploring further. # Googl-Tag-Manager > Use the Twinalyze Google Tag Manager template to install Twinalyze Web Analytics SDK on your website without manually adding SDK code to every page. With this integration, you can initialize Twinalyze Analytics, enable automatic tracking, and send custom events from Google Tag Manager. *** ## Overview The Twinalyze GTM integration works like this: ```txt theme={null} Website ↓ Google Tag Manager ↓ Twinalyze Initialize SDK Tag ↓ Twinalyze Web Analytics SDK ↓ Automatic Tracking + Custom Events ↓ Twinalyze Dashboard ``` | Feature | Description | | ---------------------- | ----------------------------------------------------------- | | Initialize SDK | Loads and initializes the Twinalyze Web Analytics SDK. | | Page View Tracking | Tracks page visits. | | Scroll Depth Tracking | Tracks how far users scroll. | | Element Click Tracking | Tracks clicks on buttons, links, menus, and other elements. | | Form Tracking | Tracks form start and form submit activity. | | Site Search Tracking | Tracks search keywords from URL parameters. | | File Download Tracking | Tracks downloadable file clicks. | | Custom Event Tracking | Sends custom business events from GTM to Twinalyze. | Before you start, make sure you have: * A Twinalyze account * A Twinalyze project * API Key and Public Key * A Google Tag Manager account * GTM container access * Website code or admin access Use only client-safe keys inside Google Tag Manager because GTM runs in the browser. *** ## Install Google Tag Manager First, add the Google Tag Manager script to your website. Open Google Tag Manager and select your website container. Click your GTM container ID, such as GTM-XXXXXXX. Google Tag Manager will show two code snippets. Add the first GTM script as high as possible inside your website \ tag. Add the second GTM noscript code immediately after the opening \ tag. Save and publish your website changes. Head script: ```html theme={null} ``` Body noscript: ```html theme={null} ``` Replace GTM-XXXXXXX with your actual Google Tag Manager container ID. *** ## Initialize Twinalyze SDK After GTM is installed, create the Twinalyze initialization tag. In Google Tag Manager, go to Tags and click New. In Tag Configuration, select Twinalyze Web Analytics SDK. In the Tag Type dropdown, select Initialize SDK. Enter your API Key, Public key, and API Base URL. Enable the tracking options you need, such as page view, scroll depth, element click, form, site search, and file download tracking. Select the All Pages trigger. Name the tag Twinalyze - Initialize SDK and save it. Recommended setup: | Field | Recommended value | | ------------------------ | ------------------------------------------------------ | | Tag name | Twinalyze - Initialize SDK | | Template | Twinalyze Web Analytics SDK | | Tag Type | Initialize SDK | | Trigger | All Pages | | API Base URL | [https://api.twinalyze.com](https://api.twinalyze.com) | | Debug mode while testing | Enabled | | Debug mode in production | Disabled | The Initialize SDK tag should fire on All Pages. This makes Twinalyze available across your complete website. Your Twinalyze project API Key. This connects website activity with your Twinalyze project. Your Twinalyze project Public Key. This is used by the Web SDK while sending analytics data from the browser. The API endpoint where Twinalyze events are sent. ``` Default value: https://api.twinalyze.com ``` You can enable page view, scroll depth, element click, form start/submit, site search, and file download tracking. Add search URL parameters used by your website. ``` Recommended value: q,s,search,query ``` Add file extensions you want to track. ``` Example: pdf,zip,apk,doc,docx,xls,xlsx,ppt,pptx ``` Enable debug mode while testing. Disable it before publishing to production. SDK version example: 1.0.19 ``` SDK URL example: https://cdn.jsdelivr.net/npm/@twinalyze/web-analytics ``` *** ## Track Custom Events To track custom actions like add to cart, purchase, signup, or form submit, push an event into GTM dataLayer. Example website code: ```html theme={null} ``` Common event examples: | Event name | When to send | | ------------------- | ------------------------------------- | | add\_to\_cart | When user adds a product to cart. | | checkout\_started | When user starts checkout. | | purchase\_completed | When user completes a purchase. | | signup\_completed | When user creates an account. | | button\_clicked | When user clicks an important button. | | form\_submitted | When user submits a form. | Now create GTM variables, trigger, and tag. Go to Variables, create new Data Layer Variable entries, and use the exact keys from your dataLayer event. Go to Triggers, create a Custom Event trigger, and enter the event name. For this example, use add\_to\_cart. Go to Tags, create a new Twinalyze tag, select Track Event or your custom event option, and set event name as add\_to\_cart. Map GTM variables as event properties, such as product\_id, product\_name, price, currency, and quantity. Attach your custom event trigger, such as CE - add\_to\_cart, to the Twinalyze custom event tag. Recommended Data Layer Variables: | GTM variable name | Data Layer Variable Name | | ------------------- | ------------------------ | | DLV - product\_id | product\_id | | DLV - product\_name | product\_name | | DLV - price | price | | DLV - currency | currency | | DLV - quantity | quantity | Custom Event Trigger example: | Field | Value | | ------------ | ------------------ | | Trigger name | CE - add\_to\_cart | | Trigger type | Custom Event | | Event name | add\_to\_cart | Twinalyze custom event tag example: | Field | Value | | ---------- | --------------------------- | | Tag name | Twinalyze - Add To Cart | | Template | Twinalyze Web Analytics SDK | | Tag Type | Track Event / Custom Event | | Event Name | add\_to\_cart | | Trigger | CE - add\_to\_cart | Event property mapping:
Property name GTM value
product\_id {"{{DLV - product_id}}"}
product\_name {"{{DLV - product_name}}"}
price {"{{DLV - price}}"}
currency {"{{DLV - currency}}"}
quantity {"{{DLV - quantity}}"}
Complete custom event flow: ```txt theme={null} User clicks Add to Cart ↓ Website pushes add_to_cart to dataLayer ↓ GTM Custom Event Trigger detects add_to_cart ↓ Twinalyze - Add To Cart tag fires ↓ Twinalyze receives the event ↓ Event appears in Twinalyze dashboard ``` *** ## Test and Publish Test your setup before publishing. In Google Tag Manager, click Preview and connect your website. Visit your website and confirm that Twinalyze - Initialize SDK fires on page load. Perform the action, such as clicking Add to Cart, and confirm that add\_to\_cart appears in GTM Preview Mode. Confirm that Twinalyze - Add To Cart fires on the custom event. Open your Twinalyze dashboard and confirm that events are visible. Disable debug mode and publish your GTM container. Production checklist: * GTM script is added to the website * Twinalyze Initialize SDK tag is firing * Initialize SDK trigger is set to All Pages * API Key is correct * Public key is correct * API Base URL is correct * Required automatic tracking options are enabled * Data Layer Variables are created correctly * Custom Event Trigger event name matches the dataLayer event * Twinalyze custom event tag is firing * Debug mode is disabled * GTM container is published * Events are visible in Twinalyze dashboard *** ## Troubleshooting Check that both GTM snippets are added correctly. The script should be inside \ and the noscript should be immediately after \. Check that the tag trigger is set to All Pages. Check that the SDK URL is correct and allowed in template permissions. ``` Default SDK URL: https://cdn.jsdelivr.net/npm/@twinalyze/web-analytics ``` Check that your website is pushing the event to window\.dataLayer. The pushed event name must match the Custom Event Trigger name. Check that Data Layer Variables use the exact same names as the keys pushed in dataLayer. For example, if dataLayer has product\_id, the Data Layer Variable Name must also be product\_id. Check API Key, Public key, API Base URL, GTM publish status, Twinalyze tag firing status, and whether your website blocks the SDK CDN URL. Make sure only one Twinalyze Initialize SDK tag is firing on the same page. Also check that your custom event is not pushed multiple times from your website code.
‹ Previous Microsoft Connect Slack with Twinalyze.