Google Analytics (gtag.js) & Foundation - HL Vanilla Community
<main> <article class="userContent"> <p>This article applies to <strong>Higher Logic Vanilla</strong> (<strong>Vanilla</strong>) customers looking to use the native tracking code of Google Analytics without Google Tag Manager. It also applies to those using our Knowledge Base (KB) product.</p><p>📝 <strong>NOTE</strong>: Adding tracking code directly to a theme means you should be using the theme for mobile <strong>and</strong> non-mobile visitors.</p><h2 data-id="retrieve-your-tracking-code">Retrieve your Tracking Code</h2><p>Get your tracking code from Google Analytics from your Google Analytics console in the <em>Tracking Code</em> area.</p><div class="embedExternal embedImage display-medium float-none"> <div class="embedExternal-content"> <a class="embedImage-link" href="https://us.v-cdn.net/6030677/uploads/FIJ41OP555Y7/image.png" rel="nofollow noreferrer noopener ugc" target="_blank"> <img class="embedImage-img" src="https://us.v-cdn.net/6030677/uploads/FIJ41OP555Y7/image.png" alt="image.png" height="353" width="372" loading="lazy" data-display-size="medium" data-float="none"></img></a> </div> </div> <h2 data-id="add-your-tracking-code-to-vanilla">Add your Tracking Code to Vanilla</h2><p>1. Access the Dashboard.</p><p>2. Navigate to the Theme Editor and access the <strong>JavaScript</strong> tab.</p><p>3. Copy the code from below and paste it on the <strong>JavaScript</strong> tab.</p><p>📝 <strong>NOTE</strong>: We are using the <a href="https://success.vanillaforums.com/kb/articles/271" rel="nofollow noreferrer ugc">onVanillaReady</a> function.</p><pre class="code codeBlock" spellcheck="false" tabindex="0">onVanillaReady(function () { /** * Google Tracker */ addScript("https://www.googletagmanager.com/gtag/js?id=UA-xxxxxx-xx"); }) function addScript(src) { var s = document.createElement('script'); s.setAttribute('src', src); s.setAttribute("async", "async"); s.setAttribute("defer", "defer"); document.body.appendChild(s); } window.dataLayer = window.dataLayer || []; function gtag(){dataLayer.push(arguments);} gtag('js', new Date()); gtag('config', 'UA-xxxxxx-xx'); </pre><p>4. Replace both instances of <strong>UA-xxxxxx-xx</strong> with your own Google Analytics account.</p><p>5. Click <strong>Save</strong> in the upper right and return to the Dashboard.</p><h2 data-id="white-list-google-analytics">White-list Google Analytics</h2><p>Now you have to add the Google sites as <em>trusted domains</em> to ensure that Google Analytics traffic can be read. </p><p>1. In the Dashboard, navigate to <strong>Settings > Security</strong>.</p><p>2. In the <strong>Content Security Domains</strong> field, add:</p><pre class="code codeBlock" spellcheck="false" tabindex="0">*.googletagmanager.com *.google-analytics.com </pre><div class="embedExternal embedImage display-large float-none"> <div class="embedExternal-content"> <a class="embedImage-link" href="https://us.v-cdn.net/6030677/uploads/50GJ9QJV9TBR/add-domains.png" rel="nofollow noreferrer noopener ugc" target="_blank"> <img class="embedImage-img" src="https://us.v-cdn.net/6030677/uploads/50GJ9QJV9TBR/add-domains.png" alt="Add domains.png" height="536" width="893" loading="lazy" data-display-size="large" data-float="none"></img></a> </div> </div> <p>3. Scroll down and click <strong>Save</strong>.</p><h2 data-id="google-tag-manager">Google Tag Manager</h2><p>If you plan to implement Google Tag Manager, see:</p><div class="js-embed embedResponsive" data-embedjson="{"body":"Google Tag Manager Setup Setup Google Tag Manager for webpages, by using the following steps from Google - or watch the video above. Adding Google Tag Manager to Foundation Theme The following applies to Foundation themes and for those looking to measure Google Analytics activity in the Vanilla KB. You will have two…","photoUrl":"https:\/\/us.v-cdn.net\/6030677\/uploads\/VWGAXAF5OFCO\/microsoftteams-image.png","url":"https:\/\/success.vanillaforums.com\/kb\/articles\/136","embedType":"link","name":"Google Tag Manager & Vanilla Forums - Vanilla Success"}"> <a href="https://success.vanillaforums.com/kb/articles/136" rel="nofollow noreferrer ugc"> https://success.vanillaforums.com/kb/articles/136 </a> </div><p><br></p> </article> </main>