From 3366b89e12398d8660cd333da091897f28cedae4 Mon Sep 17 00:00:00 2001 From: davidsertillange-optimizely Date: Thu, 16 Aug 2018 16:28:45 +0200 Subject: [PATCH 1/2] adding in Google Site Tag integration --- .../Analytics/Google Site Tag/.gitignore | 1 + .../Analytics/Google Site Tag/License | 13 +++++ .../Analytics/Google Site Tag/README.md | 53 +++++++++++++++++++ .../Analytics/Google Site Tag/config.json | 17 ++++++ .../Analytics/Google Site Tag/integration.js | 23 ++++++++ 5 files changed, 107 insertions(+) create mode 100644 Integrations/Analytics/Google Site Tag/.gitignore create mode 100644 Integrations/Analytics/Google Site Tag/License create mode 100644 Integrations/Analytics/Google Site Tag/README.md create mode 100644 Integrations/Analytics/Google Site Tag/config.json create mode 100644 Integrations/Analytics/Google Site Tag/integration.js diff --git a/Integrations/Analytics/Google Site Tag/.gitignore b/Integrations/Analytics/Google Site Tag/.gitignore new file mode 100644 index 0000000..b7ff13a --- /dev/null +++ b/Integrations/Analytics/Google Site Tag/.gitignore @@ -0,0 +1 @@ +.DS_STORE \ No newline at end of file diff --git a/Integrations/Analytics/Google Site Tag/License b/Integrations/Analytics/Google Site Tag/License new file mode 100644 index 0000000..02ad1fa --- /dev/null +++ b/Integrations/Analytics/Google Site Tag/License @@ -0,0 +1,13 @@ +Copyright 2017 Optimizely Inc + +Licensed under the Apache License, Version 2.0 (the "License"); +you may not use this file except in compliance with the License. +You may obtain a copy of the License at + + http://www.apache.org/licenses/LICENSE-2.0 + +Unless required by applicable law or agreed to in writing, software +distributed under the License is distributed on an "AS IS" BASIS, +WITHOUT WARRANTIES OR CONDITIONS OF ANY KIND, either express or implied. +See the License for the specific language governing permissions and +limitations under the License. \ No newline at end of file diff --git a/Integrations/Analytics/Google Site Tag/README.md b/Integrations/Analytics/Google Site Tag/README.md new file mode 100644 index 0000000..0874648 --- /dev/null +++ b/Integrations/Analytics/Google Site Tag/README.md @@ -0,0 +1,53 @@ +## Prerequisites + +This integration is aimed at customers who are using Google Analytics and have transitioned to the new [Google Site Tag tracking code](https://developers.google.com/analytics/devguides/collection/gtagjs/). + +The below guide also implies that you plan on using 1 Google Analytics Custom Dimension per experiment. + +This guide also implies that you have also created the Custom Dimensions you plan on using in the Google Analytics interface. + +## Installation + +Contrary to analytics.js, the new Global Site Tag tracking code (gtag.js) requires to reference the custom dimensions prior to using them. + +Therefore, in order to use this integration you'll need to update the Global Site Tag and add the list of custom dimensions you want to use to store Optimizely experiment data. + +By default, the Global Site Tag looks like this: + +```javascript + window.dataLayer = window.dataLayer || []; + function gtag(){dataLayer.push(arguments);} + gtag('js', new Date()); + + gtag('config', 'GA_TRACKING_ID'); +``` + +where `GA_TRACKING_ID` is your Google Analytics tracking ID. + +We'll need to update it the last line of code to look like this: + +```javascript +gtag('config', 'GA_TRACKING_ID', { + 'custom_map': {'dimension': 'DIMENSION_NAME'} +}); +``` + +where `GA_TRACKING_ID` is your Google Analytics tracking ID, `` is the custom dimension index and `DIMENSION_NAME` the name of the custom dimension. This information can be found by going into your Google Analytics dashboard->Admin->Property->Custom Definitions->Custom Dimensions. + +Note that you need to add each custom dimension you plan on using to store Optimizely data (including the ones that will be used for future experiments). +If there are multiple custom dimensions, the code will look like this: + +```javascript +gtag('config', 'GA_TRACKING_ID', { + 'custom_map': + {'dimension': 'DIMENSION_NAME'}, + {'dimension': 'DIMENSION_NAME_2'}, + {'dimension': 'DIMENSION_NAME_3'}, +}); +``` + +Next, go into Optimizely, head to the experiment that you want to integrate Google Analytics with. + +Turn on the [Google Site Tag Custom Analytics extension]() and in the experiment integration settings, enter the Custom Dimension name as you see it in the Google Analytics interface. + +Save and you should be good to go! \ No newline at end of file diff --git a/Integrations/Analytics/Google Site Tag/config.json b/Integrations/Analytics/Google Site Tag/config.json new file mode 100644 index 0000000..337e9d9 --- /dev/null +++ b/Integrations/Analytics/Google Site Tag/config.json @@ -0,0 +1,17 @@ +{ + "plugin_type": "analytics_integration", + "name": "Google Site Tag Integration", + "form_schema": [ + { + "default_value": "", + "field_type": "text", + "name": "dimension_name", + "label": "Custom Dimension Name", + "options": null + } + ], + "description": "", + "options": { + "track_layer_decision": "/*\n * Javascript written in this tab will run every time a user is\n * assigned to an experiment and variation, but before any experiment\n * code runs. This hook is useful for tracking which variations a\n * visitor has been assigned to. Click the help icon for more information.\n */\n\nvar decisionString = optimizely.get('state').getDecisionString({\n campaignId: campaignId,\n shouldCleanString: true,\n maxLength: 255\n});\n\nif(!!decisionString) {\n optimizely.get('utils').waitUntil(function() {\n return window.gtag !== undefined\n }).then(function() {\n var payload = {};\n payload[extension['dimension_name']] = decisionString;\n payload['event_category'] = decisionString;\n gtag('event', 'Optimizely Experiment', payload);\n }); \n}\n" + } + } \ No newline at end of file diff --git a/Integrations/Analytics/Google Site Tag/integration.js b/Integrations/Analytics/Google Site Tag/integration.js new file mode 100644 index 0000000..34cb9ca --- /dev/null +++ b/Integrations/Analytics/Google Site Tag/integration.js @@ -0,0 +1,23 @@ +/* + * Javascript written in this tab will run every time a user is + * assigned to an experiment and variation, but before any experiment + * code runs. This hook is useful for tracking which variations a + * visitor has been assigned to. Click the help icon for more information. + */ + +var decisionString = optimizely.get('state').getDecisionString({ + campaignId: campaignId, + shouldCleanString: true, + maxLength: 255 +}); + +if(!!decisionString) { + optimizely.get('utils').waitUntil(function() { + return window.gtag !== undefined + }).then(function() { + var payload = {}; + payload[extension['dimension_name']] = decisionString; + payload['event_category'] = decisionString; + gtag('event', 'Optimizely Experiment', payload); + }); +} From 68dea786e8ee30b17d7d6c5b29aba686c3c3f688 Mon Sep 17 00:00:00 2001 From: davidsertillange-optimizely Date: Thu, 16 Aug 2018 16:31:01 +0200 Subject: [PATCH 2/2] update to readme --- Integrations/Analytics/Google Site Tag/README.md | 6 +++--- 1 file changed, 3 insertions(+), 3 deletions(-) diff --git a/Integrations/Analytics/Google Site Tag/README.md b/Integrations/Analytics/Google Site Tag/README.md index 0874648..bd32352 100644 --- a/Integrations/Analytics/Google Site Tag/README.md +++ b/Integrations/Analytics/Google Site Tag/README.md @@ -24,7 +24,7 @@ By default, the Global Site Tag looks like this: where `GA_TRACKING_ID` is your Google Analytics tracking ID. -We'll need to update it the last line of code to look like this: +We'll need to update the last line of code to look like this: ```javascript gtag('config', 'GA_TRACKING_ID', { @@ -46,8 +46,8 @@ gtag('config', 'GA_TRACKING_ID', { }); ``` -Next, go into Optimizely, head to the experiment that you want to integrate Google Analytics with. +Next, go into Optimizely, head to the experiment that you want to integrate Google Site Tag with. -Turn on the [Google Site Tag Custom Analytics extension]() and in the experiment integration settings, enter the Custom Dimension name as you see it in the Google Analytics interface. +Turn on the Google Site Tag Custom Analytics extension and in the experiment integration settings, enter the Custom Dimension name as you see it in the Google Analytics interface. Save and you should be good to go! \ No newline at end of file