How to Make Your Amazon Native Shopping Ads AMP Compatible

While viewing reports from my Google Analytics account, I noticed that some AMP pages are really doing well on Google results. However, I didn’t notice a similar increase on my Amazon Associates dashboard and guess why?

Yeah, as you probably guessed, my Amazon Native Shopping ads don’t render on AMP pages. God bless Stack Overflow and fellow affiliate publishers. I found a solution for this issue. Now let me tell you how you can make your Amazon Native Shopping ads AMP compatible.

As the first step, make sure you have the following code snippet added in your AMP header:

<script async 
custom-element="amp-ad"
src="https://cdn.ampproject.org/v0/amp-ad-0.1.js">
</script>

 

If you don’t know how to add it, simply share this AMP Ad Documentation with your developer. This script is required to run ads from various ad networks on your website, it includes Amazon Associates as well. However, it’s not directly named “Amazon Associates” in the documentation, it’s Amazon’s “A9“, another subsidiary of Amazon that develops advertising technologies. So, we will need to define this detail in the code, too.

Here’s how a typical Native Shopping ad appears:

<script type="text/javascript">
amzn_assoc_tracking_id = "Your_Tracking_ID";
amzn_assoc_ad_mode = "manual";
amzn_assoc_ad_type = "smart";
amzn_assoc_marketplace = "amazon";
amzn_assoc_region = "US";
amzn_assoc_design = "enhanced_links";
amzn_assoc_asins = "Your ASIN ID";
amzn_assoc_placement = "adunit";
amzn_assoc_linkid = "Your Link ID";
</script>
<script src="//z-na.amazon-adsystem.com/widgets/onejs?MarketPlace=US">
</script>

When you wrap this one with AMP tags, it looks like this:

<amp-ad
width="100%"
height="200"
type="a9"
data-amzn_assoc_tracking_id = "Your Tracking ID"
data-amzn_assoc_ad_mode = "manual"
data-amzn_assoc_ad_type = "smart"
data-amzn_assoc_marketplace = "amazon"
data-amzn_assoc_region = "US"
data-amzn_assoc_design = "enhanced_links"
data-amzn_assoc_asins = "Your ASIN ID"
data-amzn_assoc_placement = "adunit"
data-amzn_assoc_linkid = "Your Link ID">
</amp-ad>

 

You can copy the code above and add your own tracking IDs, it will work fine.

Let me explain the code a little bit:

width: It defines the width of your ad container, I made it 100% so it resizes itself with the width of the main container. You can change it and give it a fixed width, however it might break in mobile views, so better if it’s kept 100%.

height: Similarly this defines the height of your ad. I made it 200px, but you can optimize it for yourself.

type: This is the network name. As I said, A9 is Amazon’s ad tech subsidiary.

How to insert your Amazon AMP ad code to your AMP pages?

If you’re working with a developer, you can tell him to do this for you and he will probably code a conditional rule that tells the script to run AMP ad code on AMP pages and, voila.

If you want to run this on WordPress site, simply place the code below your standard Amazon ad code as in the example below:

So WordPress run automatically AMP ads on AMP pages, and standard ads on non-AMP pages. The same logic can be applied to all other Amazon Native Shopping ad products.

Let me know if you have questions, I’d be more than happy to help!

About the Author: Onur Ozcan

I'm a digital marketer who has experience in SEO, affiliate and content marketing, making money money online and so on :)

Leave a Reply