If are using Google Adsense for earning revenue from your blog, I think you already know about Google Page-level ads which is in beta version. If you log into your Google Adsense account, you should see the below notification from Google:
If you did not get the notification, you can check under “My Ads” >> Content and you should see “Page-level Ads BETA”, if it is still not there, you will have to wait for a notification from Google about Page-level Ads.
What is Page-Level Ad and How it Looks Like?
Google Page level ads is only for mobile devices or you can say small screen devices. This is quite similar to AdMob ads. Those who use different mobile apps in Android or iOS they know how they monetize the apps with Ads and how those ads show on mobile devices or even in tabs. The page-level ads are also like these. There are two type of page-level ads: Anchor/overlay ads and Vignette ads.
Anchor/overlay ads:
This ad will only cover the lower portion of the mobile screen and the users will be able to close the ads easily just by clicking on the x button. I have got a sample of Anchor/overlay ad from my website TechnTechie’s mobile version. You can have a look at it.
Vignette ads:
Vignette ads are just awesome and this ad will generate a lot of money from the mobile version of your blog. So, how the Vignette ads look like? Yeah, the Vignette ads will cover the whole screen of the mobile device and readers will get attracted by the colorful ads and most probably they will click on those ads which will generate good money for your blog. Below is a sample of a Vignette blog from one of my blogs:
So, how is the ad? Isn’t it COOL? I believe this is cool. Now lets learn how to enable this page-level ads in the mobile version of your blog.
How to Add Google Page Level Ads on Your Mobile Version of Blog or Website?
To enable these page-level ads in your blog is really simple and easy. If you have got a Google page-level ads request in your Adsense dashboard, then just click on “Test it out” and this will guide you to a window like below:
From the above picture, you can see, it will give you two options : Anchor/overlay ads and Vignette ads. This is your choice to choose any one of them or choose both of them. I have chose both of them for maximum exposure of my mobile web version. You can take your decision. To enable it, just click on those buttons which are shows in the picture with the black arrow. NOW, you are half way done!
The next thing you will have to do is to get the code for these ads.
You will have to get the code by clicking on the “Get Code” button and you will have to insert the ad code in your website code. You will have to add the ad code in the <head> tag or at the top of the body tag.
How to Insert the Code in the Appropriate Location of Your Website:
If you are using a WordPress theme, you will have to click on the header.php file. (Caution: Please always do it on a Child theme). If you go to your header.php file, to get the <head> tag, search the page with Ctrl+F with <head>. In my case the <head> is below:
You will have to insert the code in this part or at the top of the <body> tag. You can get the <body> tag in the same header.php file if you search for it. Just add the code before the <body> tag and save the file.
You can also check for Google Instructions (which is highly recommended):
The Google instructions are gathered below step by step:
Instruction 1 to add Page-level ad code to your blog:
Instruction 2 to add Page-level ad code to your blog:
Instruction 3 to add Page-level ad code to your blog:
Following above instructions, hopefully you will be able to insert the ad code inside your website. Now the question comes how to check whether the ads are working or not?
How to Check Google Page-level Ad in Mobile Version of Website?
Note: You cannot just go to your website in a mobile and check it! You will have to follow some procedure!!
This is really easy to check whether the Page-level ads are showing in your blog or not. You will have to have one mobile device to check it. Next thing is, type your website address and add #googleads at the last and you will be able to show the Page-level ads on your mobile device. It will show like below:
In the above picture, you can see the Page-level ad at the bottom of the mobile device screen which is cool and going to give a lot of revenue from your mobile version of website.
“the viewport is not between 320 and 420 pixels wide” whatever I do, I keep getting this error. Any solutions?
This is because the theme does not support viewport. If you are using WordPress, you can use a plugin. To enable viewport, we can install one plugin – Definitely allow mobile zooming. After activating them, you can try again.