In addition to serving ads that have been sold directly by your team, you can also incorporate ads from Audience Network into your Instant Articles.
To get started, access the Audience Network tool through the Instant Articles configuration located under the Publishing Tools section of your Facebook Page. Even if you already use Audience Network, you will need to create a new Audience Network app dedicated for use within Instant Articles. If you have enabled multiple pages for Instant Articles, you will need a separate app for each page.
Note: You will need to register as a developer to create an app, and you will need to be an admin of the app in order to integrate Instant Articles.
Once you are connected to Audience Network, create a placement in the Audience Network UI. To generate Placement IDs and integrate Audience Network ads within your Instant Articles, reference the Audience Network documentation. Once you are set up, don’t forget to input your payment information.
To embed Audience Network ad tags in your article, use the op-ad class. These ads are served within a webview when they scroll into the reader’s view.
In the following example, you would simply replace PLACEMENT_ID with the placement ID you generated from the Audience Network dashboard.
<figure class="op-ad"> <iframe width="300" height="250" style="border:0; margin:0;" src="https://www.facebook.com/adnw_request?placement=PLACEMENT_ID&adtype=banner300x250"></iframe> </figure>
Auto placing your ads maximizes the amount of ads displayed per article. There are two steps to enable this feature with Audience Network ads:
<meta> element in your articles <head> section:
<meta property="fb:use_automatic_ad_placement" content="enable=true ad_density=default">You can change the ad density to control the UX, here are the three options currently available:
<header> element of your article. This will place the same ad tag into each slot available for each article (aggregated Audience Network reporting on one placement id).You may want to see performance by ad slot for reporting purposes. To do this, you can leverage the multi ads template.
The template allows you to specify different placement ids for each tag by using a <section> element with the op-ad-template class.
For example, if most of your articles have three ad slots, you may use the following:
<section class="op-ad-template">
<!-- Audience Network tag for slot #1 -->
<figure class="op-ad">
<iframe width="300" height="250" style="border:0; margin:0;" src="https://www.facebook.com/adnw_request?placement=PLACEMENT_ID_1&adtype=banner300x250"></iframe>
</figure>
<!-- Audience Network tag for slot #2 -->
<figure class="op-ad">
<iframe width="300" height="250" style="border:0; margin:0;" src="https://www.facebook.com/adnw_request?placement=PLACEMENT_ID_2&adtype=banner300x250"></iframe>
</figure>
<!-- Audience Network tag for slot #3 -->
<figure class="op-ad">
<iframe width="300" height="250" style="border:0; margin:0;" src="https://www.facebook.com/adnw_request?placement=PLACEMENT_ID_3&adtype=banner300x250"></iframe>
</figure>
<!-- Default Audience Network tag - will fill all slots below slot #3 -->
<figure class="op-ad op-ad-default">
<iframe width="300" height="250" style="border:0; margin:0;" src="https://www.facebook.com/adnw_request?placement=PLACEMENT_ID_4&adtype=banner300x250"></iframe>
</figure>
</section>NOTE: The fourth tag in this example is utilizing the op-ad-default class which specifies which tag to use if the article has more than 3 slots available. You can choose to omit this class and tag. In that case our system would use the tag for slot #3 for any extra slots available in the article.
You can also place Audience Network within the recirculation units at the bottom of your Instant Article. These ads are likely relevant to readers who want to continue their consumption experience after reading one article.