How to get your AdSense Custom Search Ads to work with AMP pages v2

Loading your pages in AMP format (Accelerated Mobile Pages) can be a great way to dramatically improve your website’s user experience simply because AMP pages generally load lightning fast. One reason why not everyone has embraced AMP is due to the number of limitations imposed on AMP pages. One of the largest issues has always been AMPs lack of Ad components.

This guide will help publishers with active Google permission for AdSense Custom Search Ads implement AFS ads on their AMP pages.

AMP sample pages

Understanding AMP

AMP has come a long way since the early days of the project.

Google is keenly aware of how important it is for webpages to load fast, especially with more and more people having access to the internet around the world, and with the dominance of mobile phones. In many countries users do not have access to laptops or desktop computers and their only method of accessing the internet is through their mobile phone. Often those internet users do not have access to very fast internet connection and will often be reluctant to wait for a web-page to load if it takes too long.

That’s where AMP comes in. AMP loads extremely fast since a lot of the technologies that often bloat and slow down a site are not permitted to be used on AMPs. Unfortunately this also meant that ad implementation on AMPs was always very difficult. However, a lot has changed with the AMP project and these days developers can find dozens of official containers that can be used on AMP pages.

AMP Ads

Monetizing AMP has been notoriously difficult, however, that is a problem of the past.

There are several official AMP containers specifically designed to display ads.

The easiest way to show ads on an AMP is the amp-ad / amp-embed container.

A container to display an ad. The amp-embed is an alias to the amp-ad tag, deriving all of its functionality with a different tag name. Use amp-embed when semantically more accurate. AMP documents only support ads/embeds served via HTTPS.

amp.dev

The second method to inject ads into an AMP page is by using the amp-auto-ads component. This component is designed for AdSense account holders in order to automatically have ads shown in dynamic positions on your AMP page. This component also works with Google Ad Manager using the Fast Fetch method using the AMPHTML Ad Creative Format.

You can find more information on how to use Google Ad Manager on AMPs on Github here.

AMP performance statistics from publishers

AMP for AdSense CSA / AFS

Putting normal AdSense ads or Ad Manager ad units on an AMP is pretty well covered in the official AMP.dev documentation. What is not explained anywhere is how to get AdSense Custom Search Ads to load correctly on AMP.

To get AdSense for Search Ads to show on AMP, you would still use the amp-ad component however, you need to add the data-afs-page-options and data-afs-adblock-options attribute within the amp-ad tags.

You code will look like this:

<amp-ad 
    height=450
    type='csa'
    data-afs-page-options='{"pubId": "partner-pub-id", "query": "hotels"}'
    data-afs-adblock-options='{"width": "auto", "number": 1}'>
</amp-ad>

For those publishers who run e-commerce or shopping sites with active AdSense permissions for AdSense for Shopping Ads (AFSh), you will be able to use the same method. You would just switch to using data-afsh-page-options attribute and the data-afsh-adblock-options instead.

<amp-ad 
    height=500
    type='csa'
    data-afsh-page-options='{"pubId": "partner-vert-pla-pubid-pdp", "query": "flowers"}'
    data-afsh-adblock-options='{"width": "auto", "height": 300}'>
</amp-ad>

AFS AMP Requirements

There are several important requirement to keep in mind:

  • You cannot mix the AFS and AFSh data ad slots. You need to use one attribute or the other.
  • On AMP the above the fold ad unit must always receive a designated minimum height. The height has to be at least set to 300px.
  • Since the ad unit above the fold is set to 300px, if no ad loads you need to offer fallback content in order to avoid displaying an empty white block to the end-user.
  • Above the fold unit has to be set to “maxTop: 1”. Only one ad can be requested in the top ad unit.
  • The maxTop parameter has to be used for the first ad unit that is shown above the fold.

Get AdSense Custom Search Ads for your website

Pubprime AdSense Custom Search Ads site monetization banner

At Pubprime we specialize in helping publishers earn more with their websites using AdSense Custom Search Ads. We work closely with publishers to apply for AdSense for Search Ads; we completely manage the ad implementation and optimization on your website; and select publishers join our Growth Accelerator program to help their website grow even faster. We welcome you to submit your site and apply for AdSense Custom Search Ads.

Learn more about AdSense for Search: