Is there a way to control where utag.js injected?

[hai_ly]

Hi, Currently it seems like the utag.js is injected into the html tag. How can we configure it to inject at the bottom of the html page? Thanks, Hai

[Clint]

Hello Hai, this question seems very similar to this one: https://community.tealiumiq.com/questions/120318-can-we-control-where-third-party-tags-are-injected that you also asked. Would it be possible to combine the two questions as the answer (which I am asking our Solutions team to look into) will likely be the same for both.

[Seth]

Hey Hai, The answer to this question should answer the question you asked about where 3rd-party tags are injected (https://community.tealiumiq.com/questions/120318-can-we-control-where-third-party-tags-are-injected) as well. The quick answer is yes, you could use the synchronous version of our code and place it at the bottom of the HTML page. However, this is not our best practice. Placing Tags at the bottom of the HTML page is a practice developed when most Tags loaded synchronously, which meant the browser could only process them one at a time. In an asynchronous paradigm, which is the method Tealium uses and prefers, this isn't necessary as the browser doesn't stop parsing the page when it encounters an asynchronously loading resource; it continues uninterrupted. Our implementation best practices insist that you place the reference to utag.js within the HTML tags, preferably close to the opening tag. We do this so that you can load the utag.js, as well as your 3rd-party Tags, as quickly as possible, and thus capture as much visitor activity data as possible. However, to make sure that the Tags load properly, by default we have them wait for the DOM Ready signal before they load. In addition to this, we load everything asynchronously, so that if any referenced resource (scripts, etc.) takes a while to load, it doesn't halt the loading of the rest of the page. However you're inspecting the DOM and you're seeing utag.js and many other scripts show up in the head element. The reason this happens is because the utag.js file tells the browser to place it (and the 3rd-party Tags that load through it) at the first script block it finds when it starts building the DOM. This is often in the head element. Why do this? Well, it's an industry standard. You may have noticed that Google Universal Analytics does the same thing. The original references aren't necessarily contained in the head, but for readability all the scripts are put together in the same place in the DOM. They're still loading asynchronously, so your page load isn't affected, and they're waiting for DOM Ready, so they're not going to load too soon either. I suspect that if you look at the page source, you'll find the reference to utag.js in the element. I hope this answers your questions. Let us know if you have any other questions. Seth