Tutorials

How to display native ads in iframes

Here we show how to setup native ads to load in an iframe. ADK will automatically resize the iframe to fit the content.

setup.js

adk.config()
    .addTemplate('com.advisible.native.teaser', adk.template.config()
        .url('native/teaser.html'))
    .addContainer('native-teaser', adk.container.config()
        .provider('adk.placement')
        .fullWidth()
        .params({
            adapters: {
                'com.advisible.native.teaser': {
                    iframe: {
                        classes: ['native-iframe'],
                        stylesheets: [
                            window.location.origin + '/teaser.css',
                            'https://fonts.googleapis.com/css2?family=Nunito+Sans:wght@300;700&display=swap',
                        ],
                    },
                },
            },
        }))
    .apply()
    .init(publisherId)

Result