With an integration of ADTECH Mobile SDK in your iOS and Android app, booking of rich media / HTML5 interstitial ads in your e-paper publication is possible. These HTML ads will be presented as full-screen ads presented between the publication pages.
In this article, you will find documentation of which possibilities Visiolink offers for booking interstitials to your e-paper through ADTECH Mobile SDK and a guide to booking the HTML interstitials in the ADTECH IQ interface.
Understanding the ADTECH IQ ad booking interface might require some basic introduction. If you are new to the interface and have questions regarding basic functionalities, please contact ADTECH support.
Creating HTML ads requires a high level of technical skills. At Visiolink we have teamed up with the digital ad agency OnAds providing two ways of helping you create HTML interstitial ads:
Rich Media Template Ads: Access to a self-service ad builder tool for creation of 6 predefined easy to build creative formats. Please read this article for details and video examples: http://blog.visiolink.com/new-concept-for-interactive-ads
Rich Media Premium Ads: Full creative corporation with our digital ad agency for creating custom ads.
Contact Visiolink to hear more about these solutions.
1.0 Visiolink HTML ad solution
At Visiolink, we have built a clear concept for inserting both fixed ad placements and frequency-controlled ad placements in the e-paper for iOS and Android. This concept will be presented here.
1.1 What you need
In order to display HTML interstitials booked through the ADTECH IQ interface in your e-paper app, you need:
- The Interstitial feature in your app
- Integration of the ADTECH Mobile SDK in your app
- Access to ADTECH IQ
1.2 Fixed Placements
You can create up to five fixed placements in your e-paper publication. The concept Placement is used in ADTECH IQ to define an ad space to which campaigns can be booked. A placement equals an ad space placed after an odd page in the e-paper publication, see illustration 1.
These are the requirements:
- You must create one placement per ad space you would like to insert in the app
- Placements can only be inserted after odd page numbers
- There must be at least three pages between each placement. If there is a placement after page 1, the next possible placement is after page 5, See illustration 1
- Once the app is submitted, placements and ad spaces cannot be changed
Besides Fixed Placements it is possible to create one CU containing Frequency-Controlled interstitials. These are shown in the app according to a set number of swipes. If the frequency is set to 7 swipes, the interstitial will be shown for each 7 swipes between pages (3 swipes is subtracted from the frequency number when first opening a publication. This optimizes the likeliness that more readers will be exposed for the ad).
1.3 Frequency-Controlled Interstitials
The frequency number cannot be lower than 5. You can book more interstitials (campaigns) to this placement at the same time.
1.4 App logic and general requirements and restrictions
To fully understand the behavior of interstitial display in the app, please take notion of these rules controlling the display logic:
- The app will preload the interstitial closest to the page that is being read. The interstitials are preloaded in order to minimize load time when the reader reaches an interstitial placement. This means that swiping fast between pages can course an interstitial to not be displayed.
- Due to performance considerations, the app can only preload the interstitial of one placement at the time.
- If more than one interstitial is booked in one placement (only possible with frequency-controlled interstitials), the app will display the interstitial that has been displayed the least amount of times on the reader’s device.
- Display of any interstitial will reset the frequency counter of frequency controlled interstitials
- An area of three swipes before and after a fixed placement will be held free of frequency-controlled interstitials in order to avoid spamming the reader with several ads within a short page span.
- If no campaigns are booked to a placement within the app, the placement will be skipped and the user is led to the next coming page of the publication.
- When testing fixed placement interstitials, you should simulate a normal reader behavior. Rushing between interstitials might not leave the device enough time register that an interstitial is active and thus skip the placement.
- A campaign cannot be limited to a specific edition of your publication. Once it is booked on a placement, it will appear in all editions available in the app throughout the booked period
- Interstitials will only be displayed when the device is online
- Visiolink allows an interstitial to take over the whole screen including control of gestures. To prevent that the reader gets stuck on an interstitial that has taken over the swipe gesture, which is usually used to turn to next/previous page, we have built in three different page turn options:
- Edge swipe: Swipe from the edge of the device on to the screen in order to turn to next/previous page, see illustration 2
- Arrows: Press the arrows on the left or right in order to turn to next/previous page. The arrows will appear every time the reader swipes within the app, see illustration 2
- Multiple Swipes (iOS only): Swiping three times within two seconds in the same direction will turn to the next/previous page as this behavior indicates that the reader is no longer absorbing the message of the ad, but rather that he or she is interested in turning the page.
2.0 HTML5 ad display through the ADTECH Mobile SDK
The ADTECH mobile SDK expects HTML interstitials that work both on phone and tablet full-screen and both landscape and portrait. It is up to the producer of the interstitial to make sure that it is responsive and looks as desired on all screen sizes and both orientations.
When an interstitial is to be presented, the app will ask the ADTECH SDK to serve the ad booked on the placement corresponding to the upcoming placement in the app. If any active campaigns are available, an in-app ADTECH web view will open and the control is handed over to the logic within the HTML ad.
The ad is displayed full-screen, so you have all normal possibilities to make use of the full-screen as with a normal web page. No restrictions are made in the web-view so best practice for general web development apply. When links in the ad are activated, a popover browser view takes the user to the landing page, which can be closed to return to the ad.
The ADTECH SDKs are MRAID compatible.
Please note that we for Android 4.3 and lower advise to use static ads as alternative/fallback to interactive ads, as these Android versions are not suited for all HTML5 elements.
2.1 SDK Pre-load and html5 polite load
The SDK and the Visiolink app pre-load your next ad to the user’s device to speed up the flow and presentation of the ad. But even when preloaded, a heavy HTML5 ad can take time to load into the web view. To further optimize, you can add “polite load” to your ad before the entire ad is to be presented. Polite load can be managed by ordering the ad to present a static picture at first, and only afterwards present the heavy animations and video.
2.2 Hooks for starting and stopping animations (iOS only)
If you want to make sure that animations stop when the user has moved away from the ad, please use this hook:
This hook is especially useful when performing ads with audio, so that you can make sure that the audio stops when the user moves away from the ad.
2.3 How to get clicks and tracking
To get clicks and tracking correct, it is important that the ADTECH click macro is correctly integrated in the interstitial.
ADTECH click macro is: _ADCLICK_
Example for using ADTECH click macro in HTML5 banner:
<a href=”_ADCLICK_=http://yourhomepage.com”>Go to homepage</a>
If you use any other way to redirect to your homepage / destination url, simply apply _ADCLICK_ before the url.
2.4 How to setup ADTECH IQ for interstitial booking
In order to make ready for displaying HTML interstitials in your e-paper app(s), you need to do the following:
- Create up to 5 individual placements for Fixed Placements
- These must be given a placement alias. Please name them logically according to the placements in the app, e.g. “newspapertitlepage1”, “newspapertitlepage5” etc. Do NOT use capital letters, spaces, special characters and underscores.
- Create 1 placement for frequency-controlled interstitials
- When creating the placement you will be asked to state a height and a width of the placement. If you plan to execute HTML ads only, the size is irrelevant as scaling is controlled by the ad. Set the size to e.g. 1x1 px (it is important that you use the same size when creating banners, as placement size and banner size must match)
- When creating placements, you must press “Enable SDK Settings” on the “Mobile” tab. Please set “Refresh Interval / Interstitial Viewtime” to 3.600.
- You must provide Visiolink with the placement alias of each placement and the corresponding page numbers (odd numbers only) after which you will like to place the placements
- You must also provide Visiolink with Domain, Network ID and SubNetwork ID of your ADTECH account.
- Both placement aliases, domain, Network ID and SubNetwork ID can be sent directly from the ADTECH IQ interface, see illustration 3 below
- Create a new campaign
- Give the campaign a name
- Provide a start date and an end date indicating the period the campaign should be active
- On the “Banner” tab, press “Add banner”
- Give the banner a name
- Size must correspond with the size of the placement that you have planned to use for this campaign (e.g. 1x1 px)
- Press “Create new HTML file”
- Paste the tag into the window, see ill. 4
- Press “Save”. Now an index.html file has been created and you have the opportunity to test the banner by pressing “Test with JS tag”
- Press “Save” again
- Go to the “Placements” tab and add the campaign to the placement(s), you like the ad to be displayed on
- Go to the Volume/Frequency tab and set “Total Impression” (this is the only mandatory field)
- Go to the “Status” tab and change the status from “Entered” to “Validated”
- Press “Save”
Now the campaign will be ready for execution in the app on the first date of the campaign.
2.5 Examples of JS tags
Example of a responsive image ad:
Example of a 3D cube with up to four sides: