Complete Guide to Implement AdSense Ad Unit in AMP Blogger Template
Google AdSense is almost supportive in all programming languages, including on Google AMP HTML-based websites. However, to place AdSense ads on AMP, a different script code is needed, according to the guidelines of AMP HTML.
This time I will explain some of the implementation of AdSense ads on Blogger AMP, along with Layout options for amp-ad. But before implementing the amp-ad on Blogger, make sure you have placed the amp-ad component below, before the code
</head>on your Blogger AMP template.
<script async='async' custom-element="amp-ad" src="https://cdn.ampproject.org/v0/amp-ad-0.1.js"></script>
<amp-ad width="100vw" height="320"
width='100vw'means that the ad will fill the entire space in the container, including filling the margin. But if your container has a
margin: 0, that attribute same as with
<amp ad layout='fixed-height'data-ad-client="ca-pub-1234567891234567"data-ad-slot="1234567890"
layout='fixed-height'on this amp-ad does not require
width=' ', where the width of the ad will adjust the selected banner ad format. This amp-ad layout attribute is recommended for those of you who choose native AdSense ad type.
Fixed AdSample code of Layout Fixed:
<amp ad layout='fixed'data-ad-client="ca-pub-1234567891234567"data-ad-slot="1234567890"
Layout='fixed'need the width and height attributes in the amp-ad code. This code is used for those of you who use AdSense ads of a certain size, for example banner ads 336X280.
Why My Ad Not Appear in AMP Blogger?Google AdSense is quite strict in displaying AdSense ads, here are some reasons why ads not appear on the AMP Blogger.
- AdSense ad AMP-AD may not be placed on parent containers that have position fixed.
- If ads are not appearing in a new article, it is reasonable. You just have to wait up to 10 minutes after the article was published.
- Ads are placed on parent containers that have a fixed height. This will make the ads damage the layout of your blog, and ads will not appear.
- Your blog is not approved to place AdSense ad.
Actually there are still several styles and types of AdSense ads that you can apply to the AMP Blogger Template. For example, auto ad, parallax style, ad sticky ad, and others. Please read the article below: