<h1>Dev instructions - drugsinfoteam.nl</h1> <p>What will you find in this document:</p> <ul> <li>Instructions on measurement</li> <li>Links to resources and documentation for implementation</li> <li>Advice on how to proceed with migration to GA4 specific for this case</li> </ul> <p>What will you NOT find in this document:</p> <ul> <li>Code for implementing the logic behind events triggering</li> <li>Advice on full-scale migration to GA4 for the whole website</li> </ul> <h2>Current implementation (and its issues)</h2> <p>Currently the tracking is implemnted with analytics.js. This is an old legacy implementation which is working only with the Universal Analytics. To be able to track your form in GA4 there are two ways to go about it:</p> <ul> <li>upgrade fron analytics.js to gtag.js</li> <li>upgrade from analytics.js gtm.js</li> </ul> <h2>Difference between gtag.js and Google Tag Manager</h2> <span><strong>gtag.js</strong></span> <p><strong>gtag.js</strong> is a library that allows you to track multiple hings on your website. It is a more robust and better version on analytics.js that also inlcudes analytics.js library in it. This library is used inline via <script></script> tag and is implmented by a developer on every page and for every element that you want to track.</p> <span><strong>Google Tag Manager</strong></span> <p><strong>Google Tag Manager</strong> is a tag management solution that reduced the involvement of developer and allows to configure tags and send events from a centralised point. One benefit is that with GTM it is easy to see an overview of everything that is currently tracked on the website while in gtag.js and analytics.js this information is not so readily avaialble.</p> <h2>Implementation through gtag.js</h2> At the moment, gtag.js is instlled on the drugsinfoteam.nl website and it is configured to send data to the GA4 proporty. What is left is to implement the following events: <p style="color: red"> 1) Submitting question </p> <p> <strong>If</strong> </p> <p> Question is submitted </p> <p> <strong>Then</strong> </p> <p> Execute a script </p> ```javascript gtag('event', 'niewe_vraag', { 'postcode': '<submitted_postcode>', /*postcode that was entered in * the form. * If no postcode provided, value * of postcode * should be postcode_onbekend*/ 'leeftijd': '<submitted_age>' /*age that was entered in * the form. * If no age provided, value * of postcode * should be leeftijd_onbekend*/ }); ``` <p style="color: red"> 2) Publishing the question (answred not published) </p> <p> <strong>If</strong> </p> <p> Question is published </p> <p> <strong>Then</strong> </p> <p> Execute a script </p> ```javascript gtag('event', 'vraag_beantwoord', { 'auteur': '<username>', /*name of the user who wrote the question*/ 'category': '<drug_category>' /*the category of drugs to which question * was related*/ }); ``` <p style="color: red"> 3) Publishing the question (answered and published) </p> <p> <strong>If</strong> </p> <p> Question is answered but not published </p> <p> <strong>Then</strong> </p> <p> Execute a script </p> ```javascript gtag('event', 'vraag_gepubliceered', { 'publiek': '<username of publisher>', /**/ 'prive': '<username of publisher name>' /**/ }); ```