2. Installing Ensighten
This comprehensive course covers everything you will need to become a Manage power user - from deploying tags, data layers and event tracking to organizing your TMS strategy and properly QA and troubleshoot.
Learners should have a basic grasp of client-side web technologies.
Installing the Ensighten bootstrap is as simple as adding a single line of HTML code to your page. This can be accomplished through your web hosting system, a CMS directly written into the page's HTML, a global header or footer, or any number of other options. The format of the URL for the bootstrap has a standard shape as shown on the screen, but can also appear in a first-party fashion using a CNAME-style setup. You'll hear more about that when we get to the UI later. Some of the fields in this URL won't look exactly the same for your account. The client ID piece will be your Ensighten account's name, not your user name, but the name of the account itself. And the publish path piece could be almost anything, but you'll see it as prod or dev in some examples. This is because the publish path represents a subcategory of tagging, in familiar terms this can be shown as dev stage and prod options. But as we'll see in the future, it could also be US prod or UK prod.
You'll also notice that in both examples here, there is no URL protocol included. This isn't mandatory, but it helps to let the bootstrap know it should load using whatever protocol your page is already using. When it comes to installing your bootstrap, the placement and manner of insertion into the page are very important. The bootstrap can function in both synchronous and asynchronous fashion, but we do strongly advise that you load the file synchronously in the head of the page. If you're unfamiliar with the terms, synchronous loading or execution is when files and their contents are loaded into the page and executed completely before the next one is allowed to do so. Synchronous files block the page from performing any other actions until they are finished. Asynchronous is just the opposite, in that any other files or tasks are allowed to continue on while asynchronous files are running. Loading synchronously in the head is the suggested path because many products and tags depend on a specific timing or rigid order of execution in order to properly perform their duties.
If you're also an Ensighten privacy customer, loading the bootstrap synchronously in the head is mandatory for consent, compliance and security implementations. We'll cover more on synchronous versus asynchronous in tagging conditions. But in the context of the bootstrap itself, loading asynchronous means that you lack control or assurance over the execution time of your tags. For some tagging, privacy, for example, this means you may find yourself non-compliant or non-functional, and others such as the analytics tools, you may miss important events or data as the user is still loading the page. Additionally, if the bootstrap is very low on the page, or in some form of footer, or perhaps if the user's browser or internet is very slow, your likelihood of losing data and increasing variance raises significantly in the asynchronous use case.
Once your bootstrap is installed, QA'ing the setup is quite simple. In all modern browsers, you will find the browser's developer tools will be able to tell you everything you need to know for this task. Start by opening your browser's developer tools. This can typically be accomplished in the browser's options menus in the upper right corner. Alternatively, they should all have keyboard shortcuts such as F12 for Windows users, or Option+J on Mac. Once the developer tools are open, navigate to the tab that shows the current HTML of the page. For example, in Chrome, this is the elements tab. Within the HTML, you should be able to locate either visually or with a search feature the bootstrap that you've placed on the page. If you can do so, that's half the task done. You can also check in the network tab for files that have loaded into the page. You may want to refresh the page once you've got the network tab open to ensure it was capturing data when the bootstrap would have been loading. In the tab search bar, type bootstrap and you should see your bootstrap file ideally with a good indicator like 200 or 204. If it's showing status 400 or 404, the bootstrap URL may not be correct or it hasn't been set up yet inside of Manage.