Tutorials

Shared template

It is often convenient to use the same HTML template for True Native and Content Display. This can be achieved using the render adapter option. Here is an example where the same template is used with different ad marking text using templateValues and the conditional block feature of the ADK Template language.

Setup

adk.config()
    // a single template is added
    .addTemplate('com.advisible.native.teaser', adk.template.config()
        .url('teaser.html'))

    // this placement has a source connected to the 'com.advisible.native.teaser' adapter
    // -> this container will automatically use the template since the name matches the adapter
    .addContainer('native-teaser', adk.container.config())

    .addContainer('content-display', adk.container.config()
        .params({
            adapters: {
                'com.advisible.content-display': {
                    // reference the template added above by adapter
                    render: 'com.advisible.native.teaser',
                    target: '_blank',
                    templateValues: {
                        external: true,
                    }
                },
            },
        }))

Template

<a class="native-teaser" href="%url%">
    <div class="native-teaser__marking">AD {#ifdef external}&bull; EXTERNAL LINK{/ifdef}</div>
    <!-- rest of the teaser template -->
</a>

True Native result

Content Display result