Adsense

How to embed Google Adsense AMP ads in AMP pages ?

Story Highlights

  • How to embed Google Adsense Ads in AMP pages

In this adsense tutorial, you can learn how to embed Google Adsense AMP ads in AMP pages. You can easily embed Google adsense in amp pages. For adding ads you must have approved Google Adsense Account and your website must support AMP pages.

Steps to embed Google Adsense ads in AMP web pages

Open Adsense official website and then Sign In with your gmail account.

Get Adsense Account Approve

Once your Adsense dashboard load then you can see My Ads option in right side bar. Now click on My Ads then Click on New Ad unit as shown below

Embed Google Adsense on Amp Pages

When you click New Ad Unit then a new window will open showing Ad Types. Click on Text & Display Ads as shown below

Adsense Ad Types

A form will open that will show option related to ad sizes. Select Responsive ad size as shown below and then click Save and Get Code.

Responsive Ad Unit

When you click Save and Get Code then pop up window will open showing you Code to be paste on web page but this is not for amp pages.

Google Adsense AMP ads

Code you get contains data-ad-client id that is called publisher id and data-ad-slot that ad id. Copy both and save it in notepad. Now copy and paste below code in your amp pages to display ads. Google Adsense support only responsive ads on AMP pages. But you can make responsive ads to fix height or fix width as shown below

Fix Height Google Adsense AMP Ads

<amp-ad

layout=”fixed-height”

height=100

type=”adsense”

data-ad-client=”ca-pub-1234567891234567

data-ad-slot=”1234567890“>

</amp-ad>

In above code add your data-ad-client  and data-ad-slot id that you save in notepad. Set layout equal to fixed-height and define parameter height with value 100 as shown above. This will show ads with height 100 px maximum and minimum.

Fixed Width Google Adsense AMP Ads

<amp-ad

layout=”fixed-width”

width=300

type=”adsense”

data-ad-client=”ca-pub-1234567891234567

data-ad-slot=”1234567890“>

</amp-ad>

Copy and paste above code and then replace data-ad-client and data-ad-slot id with your save id’s. Set parameter layout equal to fixed-width then set width parameter equal to 300. This ad will show ads with width 300 px but height may vary in it.

Responsive Google Adsense AMP Ads

<amp-ad

layout=”responsive”

width=300

height=250

type=”adsense”

data-ad-client=”ca-pub-1234567891234567″

data-ad-slot=”1234567890″>

</amp-ad>

Copy and paste above code in your amp and then replace data-ad-client and data-ad-slot id with your id’s. Set parameter layout equal to responsive then define width parameter equal to 300 and height parameter equal to 250. This ad unit will show ads of width and height 300×250.

There is no option to define fixed width and height simultaneously but you can responsive ad unit because AMP pages are basically for mobiles.  This responsive ad unit will adjust size automatically and then customize width to device size.

Tags

Anil Mehra

I am Anil Mehra, a passionate, workaholic and a Full Stack Tech Savvy Programmer with true north towards growth. I have worked on 256 live projects in MNC. I am expertise in the field of Programming, Server Management, SEO, Blogging and SMO...

Leave a Reply

Your email address will not be published. Required fields are marked *

Back to top button