-
Expand/CollapseMenu
- TLC Home Home
- Discussions Discussions
- Documentation Documentation
- Knowledge Base Knowledge Base
- Education Education
- Blog Blog
- Support Desk Support Desk
-
Expand/CollapseMenu
craig_rouse
Prerequisites
- You must have utag.sync.js enabled in your publish settings and deployed synchronously in the <head> section of your web page. If you're not sure what this means, contact your account manager.
- You must have the "edit templates" permission in order to make this configuration change
Summary
This guide will show you how to deploy a "Smart App Banner" on your website using Tealium IQ. For reference, please see Apple's documentation on this topic:
The purpose of this technology, is to display a banner on your web page to prompt the user to install your app. This is handled automatically by the mobile Safari web browser, and just requires very minimal setup in IQ.
The resulting banner will look something like this:
Steps
1. Log into Tealium IQ, and edit the utag.sync.js template (User Menu > Edit Templates > uTag Sync)
2. Paste the following code at the bottom of the file, replacing the "XXXXXXXXX" placeholder with your 9 digit app ID from the Apple App Store:
(function(){
var elem = document.createElement("meta");elem.name="apple-itunes-app";elem.content="app-id=XXXXXXXXX";document.head.appendChild(elem);
}());
3. Click "Save Profile Template".
4. Save and publish your profile.
There are no further requirements; after you have successfully published your profile, you will automatically see an app install banner in the mobile Safari browser.
Advanced users: If you wish, you can amend the above code snippet to add the other (optional) meta tag elements that Apple supports, which are referenced in the documentation linked above. These are: affiliate-data and app-argument.
Caveats: There is an equivalent system for Android apps, but it is not possible to implement this via IQ. This is because Google requires you to host a "manifest.json" file on your web server, containing the relevant config, which is not something that Tealium can do. For reference, here are the docs provided by Google if you wish to read more:
Docs:
Examples:
Copyright All Rights Reserved © 2008-2023