Tealium GitHub

Tealium GitHub Integration

The first time I heard about the Tealium Github integration was almost a year ago, around the time when Digital Velocity ’18 was in London. It sounded like an exciting feature to enhance your data collection process. And it finally got here: Tealium GitHub Integration documentation.

Tealium initially introduced this feature as part of their beta features and it got me really excited! It really changes your daily work and it becomes much smoother. You can find more information about the setup of the extension in the documentation link. However I would like to mention a few points that I personally find helpful.

Delivery from Visual Studio Code to Tealium extensions

Visual Studio Code is the code editor of my choice. I do all my JavaScript/Python work there. Till recently I felt I was under utilising it for my data collection tasks. Before this update this is how it looked like:

  1. Copy code from the extension (need to have latest version)
  2. Edit code
  3. Copy code from editor
  4. Paste within the extension
  5. Pray that you did not copy any accidental change!

Far from ideal. Now with the integration:

  1. Pull latest version locally from Github
  2. Edit code and commit changes
  3. Push to repository
  4. Synchronize extension

It really makes your life smoother when it comes to editing big and complicated JavaScript files. Below a few useful links that can assist in the overall setup:

Cross-profile code re-use

In some cases companies have multiple profiles. How would you manage 5, 10 or more different profiles? How would you manage a change that needs to be deployed across multiple profiles and/or accounts? You can easily reference the same file in all of them and all you have to do is sync to the latest version.

Streamline the delivery of updates

The most beneficial scenarios that come to my mind is managing marketing tags IDs and generic functions (i.e. cleaning URLs, parsing names, managing cookies/storage). You can maintain a central lookup of all your Facebook IDs, AdWords IDs/labels, Google Analytics IDs, Adobe Analytics report suites IDs etc. and make sure you enforce consistency across your sites. Think about how much more streamlined your work can be! The only consideration in the above is that you need to make sure that your code is cross-profile compatible. But I am a firm believer that this exercise will benefit you a lot in the long run. So do it!

Collaboration and code management

This is applicable to bigger teams or teams with tighter release permissions. With the extra features Github offers, you can now organise, review and scrutinise your work much more. For example, you are allowed to release on the site once every 2 weeks. You want to make sure that all the developers have done their work properly. The native version control in Tealium is good but let’s be honest, it has limitations. Now they are gone! Let’s investigate the following:

  • Organising GitHub
  • Using single or multiple extensions per file

Organising GitHub

You can have 3 distinct branches in Github (development, QA, production).

github branches
GitHub Branches

You development work will take place in the Dev branch where multiple people can contribute. Once the work is considered ready, you have to create a pull request from your Dev environment into the QA.

Provide all the details (i.e. what is the purpose of the update).

Pull request from Dev into QA

Approve (or reject the work) performed. This will lead into merging your changes into the next environment.

All set. Your QA environment just got updated.

Successful merge

The workflow is more or less the same regardless of how you configure the actual extensions within Tealium. What might change is the number of branches. You might decide to opt-in for just 2; dev/qa and production.

Option A – Single Extension with multiple files

This is relatively simple to implement and does not complicate your overall setup. You need one extension per file i.e. for Adobe Analytics doPlugins file in GitHub you will create only one doPlugins extension in Tealium. Within the extension you can link the same file for each branch (Dev, QA, Prod).

Github files
Linking single extension to multiple branches – branch is visible only during mouse over.

Time to fetch the code into Tealium. Go into the relevant file and click “Sync File” (this also triggers automatically when you expand the extension).

Synchronize Tealium with GitHub

You can switch between branches by clicking the appropriate GitHub file from above, sync it and publish it to the respective environment.

GitHub publish locations
Publishing to QA environment

The main caveat I have spotted so far is the branch name is only visible if you hover over the file (easy to mis-publish branches). Maybe Tealium can change that in the future.

Option B – Multiple Extensions

The alternative option is having 3 extensions, one for each branch.

tealium-extensions
Tealium Extensions

Each extension is configured to be deployed in a different environment through detecting the Tealium current environment.

Environment Condition – Dev Environment

The data layer variable has as a source the variable “ut.env”. That is a default Tealium data layer variable that depicts the current Tealium environment (dev/qa/prod).

udo variable
Tealium Environment Data Layer Variable configuration

Now you can link the doPlugins file from the GitHub Dev branch with the equivalent extension in Tealium; same applies for the rest of the branches (just make sure you use the correct path for each branch).

Linking extensions – The underlined part represents the branch.

This approach provides more clarity to your work but also creates a lot of duplication within the UI.

Regardless of which option you select (or if you come up with your own structure) you can now have a much smoother merge issues resolution and code review.

Same functionality, 3 extensions, 3 deployment environments

As a recap, your BAU will look something like this:

  1. Do you work on the dev branch.
  2. Commit/push to GitHub and perform pull request to QA.
  3. After merge, go in Tealium and sync your QA branch. Time for testing!
  4. Once happy, merge your code into the production branch.
  5. Back into Tealium, sync the production version. Ready to go live!

Overview

Obviously you can simplify/complicate things as much as you want – totally up to your personal and business requirements. The important thing is that now you have option to do adjust your processes in much more flexible way than before!

Hints:

  • Make sure you create all your repositories under an organisation in GitHub. Highly recommended to avoid issues with individual accounts.
  • Tealium offers also resource locks which limit edit access to particular resources (tags, extensions etc.). This is an alternative method to manage access.