iFrame Integration

If you want to integrate FeedAd as a mediation step of an ad mediation framework, chances are that the SDK will be loaded inside an iFrame. When using the SDK within iFrames, you need to decide between two integration strategies:

  1. Use the iFrame-Loader script explained on this page for an easy integration that fits most use-cases.
  2. Load the SDK via script tag inside the iFrame for a manual integration.

Cross-Origin Frames

FeedAd is not supported within cross-origin frames (aka Safe-Frames)! The iFrame must either be an inline frame (no src attribute) or run on the same domain as the main window.

iFrame Loader Script

When to use it

  • You want to add FeedAds through iFrames on your website.
  • You are using Google DFP or similar ad mediation services to integrate ads on your website.

What it does

  • It checks if the browser is compatible with the FeedAd SDK.
  • It loads the most recent version of the FeedAd SDK.
  • It loads the SDK only once. Regardless of how many times you execute the iFrame loader script.
  • It manages multi slot ad playback if you integrate more than one iFrame on your website.
  • It supports callbacks to execute backfill methods when no FeedAd is available.
  • It supports automatic cleanup of ad elements once the ad playback has been completed.

What it cannot do

How to use it

Include the loader script and ad request within the body of your iFrame:

<script type="text/javascript" src="https://web.feedad.com/loader/feedad-iframe-loader.js"></script>
<script type="text/javascript">
    feedad.loadFeedAd({
        clientToken: "your-client-token",
        placementId: "your-placement-id",
        // more options see below
    });
</script>

Placement ID?

You can choose placement IDs yourself. A placement ID should be named after the ad position inside your product. For example, if you want to display an ad inside a list of news articles, you could name it "ad-news-overview".
A placement ID may consist of lowercase a-z, 0-9, - and _. You do not have to manually create the placement IDs before using them. Just specify them within the code, and they will appear in the FeedAd admin panel after the first request. Learn more about Placement IDs and how they are grouped to play the same Creative

The loadFeedAd method accepts the following options:

Name Importance Default Description
clientToken required undefined Your web client token.
placementId required undefined The placement id for the ad that should be loaded.
sdkOptions optional {} Configuration options for hybrid apps.
adOptions optional {} Configuration options for the ad request.
removeOnComplete optional true If the ad placements should be removed when the ad playback completed.
beforeAttach optional el => el A method that is called with the iFrames parent element before the ad is attached to it. It should return the element which the ad should be attached to. This can be used to modify the ad element before playback or to add styles, dimensions, etc.
globalKey optional __feedad The name of the global object the FeedAd SDK will be assigned to in the main window.
onComplete optional didReceiveAd => void A callback that is called when the ad playback completes. It accepts one boolean parameter indicating if at least one ad was received.
onSdkLoaded optional sdk => void A callback that is invoked once the SDK is loaded and before the first ad request is made. This callback can be used to send custom events or to supply custom targeting parameters to the ad request. This callback is available from version 1.2.10 upwards.