- utag v4.38 or higher
How it works
This new publish workflow ensures that your code doesn’t get published until it’s ready. It allows you to see what code has been published to each environment and easily compare code between drafts and environments.
Use drafts to maintain different versions of the code without affecting your published profile. Drafts are only published when you specify an environment using the Approve for Publish workflow.
Follow this workflow:
When you are ready to publish, approve the draft to be published for one or more publish environments. The draft enters read-only mode (indicated by the lock icon) until the next publish to the selected environments, at which point it becomes editable again, except in libraries. The color of the lock next the draft matches the icon next to the corresponding environment.
Once a draft has been published, the live code is only reviewable (read-only mode) in the corresponding publish environments. You cannot edit the code in a publish environment directly. To make changes, edit a draft and repeat the publish workflow process.
Code editor features
- Syntax Checking
See syntax errors, warnings, and tips as you type. The margin displays helpful icons to indicate that your attention is needed on the affected line.
- Syntax Highlighting
- Auto Indent and Outdent
Automatic indenting as you type. Supports the
- Code Folding
Collapse blocks of code to eliminate distractions and focus on your changes.
- Full Screen Mode
Expand the Code Editor window to full screen mode to work on larger code projects.
Once a draft is published, the code is added to one of the utag files (depending on the scope). It’s important to note that the code runs just as it appears in the code editor, but is wrapped in the following anonymous function:
The two parameters passed to the function are:
a- the event type (“view” or “link” or a custom value)
b- a reference to
utag_dataallowing you to set UDO values as
Be sure to scope all of your variable references accordingly to avoid overwriting global variables.
Compare a draft or a publish environment to any other draft or publish environment. The comparison window displays the versions of the code side by side with highlights for each line that differs. For example, compare Prod vs QA, Draft 1 vs Draft 2, or Draft 1 vs Prod.
Using the extension
Before you begin, familiarize yourself with how extensions work.
Once the extension is added, create a draft as described below.
Working with drafts
To create a draft:
- In the sidebar, under Drafts, click + Add.
- Save the profile to preserve your changes.
The following functions are available when working with a draft:
- Draft Name: Set the name of the draft. The name appears in the sidebar, sorted alphabetically in the list of drafts.
- Reset: Undo all code edits made to a draft since the last time the profile was saved.
- Delete: Delete the draft. To undo, refresh the profile without saving.
- Compare Diff: Compare the draft with another draft or with a publish environment.
- Queue for publish: Mark the draft to be published in one or more publish environments.
Copy the file to draft mode
Files added through GitHub are read-only and cannot be edited. To edit these files, edit directly in GitHub or copy the file to Draft mode and edit the draft copy.
Use the following steps to copy the file to draft mode, edit, and save prior to publishing:
Select the file you want to copy to Draft mode.
Click Copy to Draft to copy the content of the file into a new draft template.
Enter a name and press Enter.
Enter a new name or keep the same name.
If you choose to keep the same name, names remain the same as the file name. For example, if the GitHub filename is
Tealium.js, the first copy becomes
Tealium.js(if a draft with that name does not already exist). Subsequent copies are named
Tealium.js-2,and so on.
Open and edit the copy.
Publish a draft
Publishing a draft is a two-step process. First, in the extension the draft must be added to the publish queue for the desired publish environment. Second, the profile must be published to the corresponding target.
Remember, by default, drafts are not included in a publish unless they have been explicitly queued for publish.
To publish a draft:
- Select the desired draft in the sidebar.
- Click Queue for publish….
- Check the box next to the desired publish locations.
- Click Continue.
The draft is now in read-only mode (indicated by the padlock icon) and the queued publish environment is indicated in the sidebar and in the draft details.
- Perform a save and publish on the profile, selecting the publish target matching the publish queue.
The published draft now appears as the active code in the corresponding publish environment in the sidebar.
Working with GitHub
The following sections describe how to reference files in a GitHub respository. Use this feature instead of writing code directly in the extension.
To work with GitHub files you must link your GitHub account to your iQ Tag Management account. Learn more about Linking to GitHub.
Add a GitHub file
To reference a file from a GitHub repository:
You are prompted to enter the URL for the file you want to add.
- Enter the URL, for example:
- Click Add File, and the code is now referenced in the extension.
To access files in a private repository, you must link your GitHub account with a personal access token that has the repo scope selected.
Synchronize the file
All GitHub files attempt to sync when you open the extension unless the file is approved for publish.
Use the following steps to manually synchronize a file, including those approved for publish:
- Select the file to synchronize.
- Click Sync File to retrieve the latest copy of the file from the repository.
The updated file appears with the time and date and a green check mark to indicate that the file is up-to-date.
When working with GitHub files, the filename you are working with always appears at the top of the interface. To view the full file path, hover over the filename.
Queue the file for publish
Files queued for publish cannot be synchronized and display a lock icon next to the filename. If you attempt to synchronize a file that is queued to publish, an warning icon displays to indicate that the you are unable to connect to synchronize to new version.
- Select the file to queue for publish.
- Click Approve for Publish, then the file status displays a new line with the timestamp and username showing the environments the file published to.
Use the following tips to make the best use of this extension and avoid common mistakes:
<script>Tags: Do not surround the code with
- Reference the UDO: If you are referencing a variable from the
utag_dataobject, such as
page_name, use the
bobject like this:
- Reference Tag Template Variables: If you are referencing a variable defined in the tag template of the scoped tag, such as
- Create Useful Draft Names: Your TiQ profile is a shared working environment so use meaningful names for drafts to make them easily identifiable to you and others.
- Comment Your Code: Write useful comments to make it easier for your future self and other users to understand your code and how to maintain it.
Understanding the pros and cons
Consider your environment and the following pros and cons prior to using this extension:
- Difficult for non-developers to understand and edit.
- More difficult to maintain over time.
- Prone to typos and logic errors.
- A draft becomes in read-only mode if it has been queued for publish and the publish has yet to occur. Remove the draft from the publish queue or publish the profile to make the draft editable again.
- The code displayed in publish environments cannot be edited directly. This is a read-only view of the published code.
Why can’t I select a publish environment in the Queue for Publish dialog?
Why can’t I set the scope to Pre Loader?
If you have a condition defined, the Pre Loader option is no longer available. In Pre Loader scope, the data layer is not yet populated so there is no data object with which to evaluate the conditional logic. Likewise, the Add Condition option is disabled when the scope is set to Pre Loader.
What’s the difference between Pre Loader and Run Once before Load Rules?
Both Pre Loader and Run Once Before Load Rules cause the extension to run once before the data layer is populated and before load rules are evaluated. The difference is that conditions are not supported in the Pre Loader scope.
Thank you for your feedback!
This page was last updated: January 7, 2023