This repository contains the necessary specifications to build an event driven data layer.
The embed code is a script tag that you put on your web pages to load and execute the logic you build in Launch. If you load the library asynchronously, the browser continues to load the page, retrieves the Launch library, and executes it in parallel. In this case, there is only one embed code, which you put in the <head>
(When Launch is deployed synchronously, there are two embed codes, one which you put in the <head>
and another which you put before the </body>
).
From the property Overview screen, click on the Environments tab to go to the environments page (Note that Development, Staging, and Production environments have been pre-created for you):
Development, Staging, and Production environments correspond to the typical environments in the code development and release process. Code is first written by a developer in a Development environment. When they have completed their work, they send it to a Staging environment for QA and other teams to review. Once the QA and other teams are satisfied, the code is then published to the Production environment, which is the public-facing environment which your visitors experience when they come to your website.
Launch permits additional Development environments, which is useful in large organizations in which multiple developers are working on different projects at the same time.
These are the only environments we need to complete the tutorial. Environments allow you to have different working versions of your Launch libraries hosted at different URLs, so you can safely add new features and make them available to the right users (e.g. developers, QA engineers, the public, etc.) at the right time.
Now, let's copy the embed code:
In the Development row, click the Install icon to open the modal. Note that Launch will default to the asynchronous embed codes.
Click the Copy icon to copy the embed code to your clipboard.
Click Close to close the modal.
The embed code should be implemented in the element of all HTML pages that will share the property. You might have one or several template files which control the globally across the site, making it a straightforward process to add Launch.
1<!--Launch Header Embed Code: REPLACE LINE 39 WITH THE EMBED CODE FROM YOUR OWN DEVELOPMENT ENVIRONMENT--> 2<script src="<your_library_url>" async></script> 3<!--/Launch Header Embed Code-->
Make sure you build a version of the library and then test that the JS file is correctly loading on the page.
For more information refer to the official documentation.
Each file inside the events folder corresponds to a single use case or site event that needs to be implemented. These events are leveraged to trigger tracking rules in the tag management tool of choice and share data with the analytics reporting tool.
As the data layer is event-based, the order in which the events are fired is critical. In general, events should be pushed onto the data layer in the following sequence when a page load (virtual or otherwise) occurs:
Page Load Started > Other Page-level Events > Page Load Completed
If an Event is part of the page load sequence, it will be indicated in the corresponding event file.
Events that occur outside of the page load sequence should be pushed onto the data layer as they occur.
For any questions or comments, please contact [email protected].