Skip to content

Web Setup

Integrate the ADvantage SDK into your project

Ad Spaces

Before you start integrating ADvantage into your project please follow the following steps:

  • Plan the positions:

    Together with your product manager and with your sales team define the exact positions and behaviour of each ad space on your website (e.g. which ad format you want to display). If you need assistance please contact our sales team.

  • Prepare your website:

    Prepare your website in order to show the ad spaces.

  • Integrate ADvantage:

    Start integrating ADvantage. If you need assistance please contact our support team.

Browser/Platform Support

The ADvantage WebSDK supports the following platforms and browsers:

  • Mobile:

    • iOS 10.x (Safari)
    • Android 4.4 (Chrome)
  • Desktop:

    • latest Browser Version IE 11, Chrome, Safari, Opera and Firefox

For more information please check our FAQ.

Prerequisites

  • Valid HTML5 page

    • Your mobile or responsive website must be compatible with HTML 5. The ADvantage WebSDK is designed for HTML 5.
    • If you use any polyfill library, please use always the latest version of it.
  • Correct viewport

    You must add a view port to your mobile or responsive page.

    <!DOCTYPE html>
    <html>
         <head>
                <meta name="viewport" content="width=device-width,initial-scale=1.0,maximum-scale=1.0,user-scalable=0"/>
         ...
         </head>
    ...
    

  • Correct Content Type

    Always use the content type text/html.

Unsupported HTML standards

HTML 4, XHTML, etc. are not supported. Only HTML 5 websites are supported.

Import the ADvantage WebSDK to your website

Add a script tag which links to the WebSDK into your website.

Adding the script

It is highly recommended to add the WebSDK in the <head> tag of your website.

<!DOCTYPE html>
<head>
    ...
    <script src="https://advantage.digitalsunray.com/v2/ADvantage_WebSDK.class.js"></script>
</head>
...

How ADvantage displays HTML5 ads

The ADvantage WebSDK is using an sandbox Iframe system to display HTML 5 advertisements on your webpage. In this sandbox the creative developer is not able to access or interfere with your webpage, assuring high security and protection for your webpage.

License Key

Each website needs an own license key. The license key is bound to a specific (sub-)domain of the website.

For all license related topics contact our sales team.

License key and Ad positions settings

Each ad space has a license key and ad position settings Side ID and Position.

  • License key The license key is a unique key for each website (domain) it will be provided by our sales team.

  • SITE_ID The site id represents a category/structure on the ad server. This information will be forwarded to the ad server. On some ad servers this value has to be empty.

  • POSITION The position is linked to a specific ad position on the ad server and will be also forwarded.

Permissions

Since Version 2.5.0 you can set two permissions: allowReadCookies and allowWriteCookies.

allowReadCookies and allowWriteCookies allow the creative developer to read and write cookies from and into your website. Both permissions should be granted together. This feature can be used for retargeting campaigns to identify users.

Security Notice

All cookies which the creative developer want to read or write will be prefixed with ADvantageSandboxCookie_. This means all your cookies are save, the creative developer will not be able to read or overwrite your cookies.

Select an ad format

An ad space is the area where the advertisment will run and show up. An advertisement could be fullscreen or just use a small portion of the screen and entice the user to interact (touch, wipe, click, ...) with the advertisement, which typically triggers an event such as opening up the app store or a landingpage (in the browser).

In the following sections you will see some examples on how to implement ADvantage into your project.

Banners

Banner ads are rectangular ads that take a spot within an website's layout. They stay on screen while users are interacting with the website, and can refresh automatically after a certain period of time. If you're new to mobile advertising, they're a great place to start.

How to implement a banner

Interstitial

Interstitial

Interstitials are fullscreen ads that cover the whole screen of the browser window until closed by the user. They're best placed at startup, natural pauses in the flow of an website's execution, such as in between levels of a game or after completing a task.

How to implement an interstitial

Legal information/GDPR (General Data Protection Regulation)

You must add a legal information into your privacy policy for your customers, letting them know that you are using an ads. Some campaigns are using tracking technologies or setting cookies.

For more information please check our privacy policy.