[amp-auto-ads] No anchor element found – How I solved it

I just enabled AMP Auto ads on my personal blog after making some tweaks to how we implement Auto ads on AMP with our Responsive Ads add-on. Instead of seeing Auto ads show up on the AMP version of a page, I just saw a warning:

[amp-auto-ads] No anchor element found    log.js:251Code language: CSS (css)

The site has a long history, and the AdSense AMP ads I placed with Advanced Ads in the content are working as expected (and better, financially). Enabling Auto ads was a new experiment.

I should also mention that I had to enable AMP Auto ads in my AdSense account, which I did hours before writing this post. So that should not be the cause.

At the end, I found the explanation of why it doesn’t work and can provide three working solutions.

AMP auto ads No anchor element found – screenshot of the warning
Don’t worry if you see the “No anchor element found” warning

Works in Reader mode

I am using the official AMP plugin in the “Transition” mode, which means that the plugin tries to convert my current theme into an AMP-compatible version.

As soon as I changed the AMP mode to “Reader”, Auto ads started to appear and the issue was gone.

Template Mode option in the AMP plugin for WordPress set to "Reader"
Switching the Template Mode option to “Reader” helped solving the “no anchor element found” issue.

Problem solved? My small blog can work with the Reader mode, no problem. Though, my curiosity as a developer was bigger. So I wanted to learn how to fix it and help others who are not satisfied with that option.

How to fix the “No anchor element found” issue in your theme

It struck me when I changed my blog’s theme to the default Twentytwenty theme that WordPress currently comes with. This theme even showed AMP Auto ads with the Transition mode of the AMP plugin.

So I asked myself what “anchor” means in [amp-auto-ads] no anchor element found. There is no anchor tag in Twentytwenty, so what does it mean? What does Twentytwenty have that my theme is missing?

I started adding and removing elements in my custom theme without any effect on Auto ads until I decided to read the source code of the AMP project, where I found the solution. AMP Auto ads are only placing ads within sections wrapped in the <article> or <header> tags.

Screenshot of a warning in the browser console saying "amp-auto-ads no anchor element found" indicated, that this happens twice.
Do you see the (2) in front of the issue? One is for the missing <article> the other for the <header> tag.

Once I added the <article> tag to my theme’s single.php template, the AMP Auto ads showed up as expected. Depending on how your theme works, you might have to add it to other template files as well or ask the theme developer to implement them.

The solution is to wrap your post content into <article> tags.

Give me an hour and I come up with such smart statements.

One of the warnings is still there because I didn’t add the <header> tag. That does not have any influence on the Auto ads in the content and allows me to keep the header free of Auto ads.

Update: Google AdSense seems to have several selectors they are looking for and seems to adjust that list. Other working selectors I found so far are

  • div.post-content
  • div#post-container
  • div#comments
  • div#main-navigation-wrap

Subscribe to our newsletter and get 2 add-ons for free!

* indicates required

Place AdSense AMP ads manually

If you still don’t see AdSense Auto ads on your AMP pages or don’t like their position, then you can always place AdSense Auto ads manually. Our AMP Ads add-on converts them into the correct AMP format without you having to touch any code.

Make it better

Increase your ad management skills without spending more time.
Join over 150,000 publishers and AdOpts increasing their ad revenue.