Display ads

This section will present a list of ways to add a display ad (leaderboard, skinny skyscraper, MPU) to your webpage.

Placement tags

The simplest way to get a hold of the relevant display ad is to head over to your Dashboard, select the placement you want to add, and click on the button marked Get Placement Tags.

Get Placement Tags

Then click on either the Live Tag or Test Tag buttons to copy the tag.

  • Live tags should be added only when you have a live campaign running on your placements; otherwise, nothing will display.
  • Test tags will always show a SuperAwesome test image corresponding to the type of placement chosen.

Tag Buttons

After that, you can add the copied tag in any part of your web app:

<div id="top_leaderboard">
    <script type="text/javascript" src="https://ads.superawesome.tv/v2/ad.js?placement=31428&test=true"></script>
</div>

Notice the tag you copied from the dashboard is identical to the one presented in the Integrate the SDK chapter. The dashboard is just a convenient way of obtaining the correct, right code for your app without much hassle.

Javascript object

If you want to create the ad as a Javascript object, you’ll need to first add the AwesomeAds SDK into your header (as presented in the Integrate the SDK chapter), then:

<!-- define a div to display the ad in -->
<div id="top_leaderboard" style="width:728px; height:90px"></div>

<!-- and once the page gets loaded -->
<script type="text/javascript">
    (function() {

        // parent element
        var el = document.getElementById("top_leaderboard");

        // create a new AwesomeDisplay object
        var ad = new AwesomeDisplay(31428).test();

        // add callbacks
        ad.onEmpty(function() {
            console.log('empty callback');
        });

        // append element
        el.appendChild(ad.element);

    })();
</script>

Result

In both cases, the result will be an ad showing on your page, similar to this:

Ad Example