This article is about Safari Smart App Banner. For AppsFlyer Smart Banners, see here.
Since version iOS 6.0+, Safari has a Smart App Banner feature providing a standardized method of promoting apps in the Apple® iTunes® App Store from a website.
Smart App Banners only appear in Safari on iOS, but not Safari on Mac OS X.
Generally, Smart App Banners appear at the top of a web page in Safari, as follows:
App install attribution
Installs from Smart App Banners are attributed by measuring them as view-through (impression) conversions. AppsFlyer supports view-through attribution only when it includes the Device ID (IDFA). However, for smart app banner view-through attribution, the Device ID is not provided, so the click recording link is used to measure the view-through conversion.
Each time the web page is viewed, a click recording event is sent to AppsFlyer. This includes all the pre-configured attribution parameters (e.g. Campaign Name, pid, Site ID). When the user downloads and installs the app and launches it for the first time, AppsFlyer takes this impression as a candidate for attribution. If this impression is the last touch, this install is attributed to iOS Smart App Banner attribution using AppsFlyer's NativeTrack™ method.
Setting a web page with a smart app banner and click attribution link
1. Paste the following code into the header element of the HTML of your web page.
<meta name="apple-itunes-app" content="app-id=123456789">
2. Generate an attribution Link for the same mobile app that you are promoting in the Smart App Banner.
The following URL example shows an attribution Link for the mobile app (being promoted in the Smart App Banner).
You can also use shortened custom attribution links.
For details on how to build an attribution Link, see here.
3. Insert the generated attribution link inside an image pixel.
Your image pixel with the measurement URL is formatted as illustrated below:
<img src="https://app.appsflyer.com/id123456789?pid=ios_smart_banner&c=ios_campaign height="1" width="1" border ="0" />
The final HTML page with the image pixel should appear as shown in the following HTML example.
<html> <head> <meta name="apple-itunes-app" content="app-id=123456789"> </head> <body> <p>This is my website</p> <img src="https://app.appsflyer.com/id123456789?pid=ios_smart_banner&c=ios_campaign" height="1" width="1" border ="0" /> </body> </html>