Showing posts with label Blogging Tutorials. Show all posts
Showing posts with label Blogging Tutorials. Show all posts

Monday, August 29, 2016

How to Insert Adsense Inside Posts: After the First Paragraph

Want to know which part of your site or blog will bring you more profit? Add AdSense inside posts and then check out the famous Google AdSense heat map. Recent studies, however, showed that placing AdSense after the first paragraph of a site or blog is one of the best AdSense placement. Unfortunately, the default Blogger platform offered by Google doesn't allow placement of ad after the first paragraph. But because it has become one of the most profitable areas, plenty of webmasters have tried to take advantage of the best AdSense placement. How can you enjoy the same level of profit?

To solve the problem, we will just move the locations of the ads to be displayed by adding JavaScript and DIVs. With the following script, you can easily choose the paragraph or heading after which you want to inject the ad to. This way, you won't have to manually change every post.

adsense inside posts, adsense placement

How to Display AdSense Ads after the First Paragraph in Blogger

1. Log into your Blogger account, select your blog and click "Template" on the left side. Open the Template editor using the "Edit HTML" button. Once the editor has opened, click anywhere inside the code area and press the CTRL + F keys (or Command + F) on your keyboard to open the editor' search box. Search the following line: 
<data:post.body/>
Note: You will find multiple occurrences of <data:post.body/>, stop at the second one or if you don't see any changes, test the last one.

2. Add the below DIVs in red before and after, like this:
<div id='adsense-target'><data:post.body/></div>
3. Copy the AdSense code that you want to show and use this tool to convert it into plain text. Just above the line that we just found, add the following HTML and replace the "ADSENSE CODE HERE" text with the converted ad code:
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='adsense-content' style="display:block;text-align: center">ADSENSE CODE HERE</div></b:if>
Screenshot:


Align AdSense Left or Right

By default, the Google AdSense ad unit will appear in the middle just after the first paragraph. If you are unhappy with the results and want to wrap text around the ad, you can choose one of the options below:

a) Align AdSense to the left: change <div id='adsense-content' style="display:block;text-align: center">with
<div id='adsense-content' style="display: inline-block;float: left;margin:15px 15px 15px 0px">
After modifying it, the ad will display something like this:

adsense inside posts, adsense placement

b) Align AdSense ad to the right of the content: change <div id='adsense-content' style="display:block;text-align: center">with
<div id='adsense-content' style="display:inline-block;float:right;margin:15px 0px 15px 15px">
4. Finally, right after <div id='adsense-target'><data:post.body/></div> (step 2), add this script:
<script type='text/javascript'>
function insertAfter(addition,target) {
var parent = target.parentNode;
if (parent.lastChild == target) {
parent.appendChild(addition);
} else {
parent.insertBefore(addition,target.nextSibling);
}
}
var adscont = document.getElementById(&quot;adsense-content&quot;);
var target = document.getElementById(&quot;adsense-target&quot;);
var linebreak = target.getElementsByTagName(&quot;br&quot;);
if (linebreak.length &gt; 0){
insertAfter(adscont,linebreak[0]);
}
</script>
Note:
- To insert the ad after the second paragraph, change "0" from the line in red with "2".
- If you want to put AdSense just below the heading h2 or heading h3 of a post, replace br from &quot;br&quot; with h2 orh3. 

5. Click "Save template" to save the changes and you're done.

With this trick, you can insert AdSense after the first paragraph automatically in Blogger with ease. Now it's your turn to decide which format works best on your site.
Read More »

Monday, August 22, 2016

How to Add AdSense Page-level ads in Blogger

How to Add AdSense Page-level ads in Blogspot
Recently, page-level ads were made available for blogspot bloggers and webmasters which means that you can now display AdSense Ads right on your mobile templates. You can now monetize your efforts on the templates as you do with mobile apps thanks to the Google Admob Ads.
 How to Add AdSense Page-level ads in Blogger

how to add adsense page-level ads in blogspot

Why Choose AdSense Page-level ads?
There are a number of reasons why you choose page-level ads from AdSense to bolster your revenue stream.

- Increase Revenues
- Provide Better User Experience
- Two New Formats
- Doesn't Count Against 3 Ad Limit
- Optimized and Responsive to Mobile Needs

Page-level Ad Formats
Today, the two types of page-level ads available include Anchors which are ads places at the bottom of the screen and Vignettes which are full screen ads that work similar to Admob's Interstitial adverts.
Vignettes tend to be more effective for mobile advertising.

How to Setup Page-Level Ads in Blogspot Blogs
The good news is that you can install these ads from AdSense fairly quickly and easily thanks to the process which guides you through.

1. Log into your AdSense Account
2. Click on this link
3. Click the two toggle buttons to switch on "Anchor/overlay ads" and "Vignette ads"

enable adsense page-level ads in blogger

4. Scroll down and click the "Get Code" button

enable adsense page-level ads in blogger

5. Copy the code

google adsense page-level ads code

6. Go to Blogger, then Template and Backup your Template
7. Click the 'Edit HTML' button and search for </head> tag
8. Paste the page-level ad code above the </head> tag

Note: You will also need to replace the attribute async with async="async" in order to help complete the process, otherwise Blogger will give you an error message. Once you have completed the process, all you need to do is save it to your template.

Test Page-level ads in your Blogger template
After installation, get out your mobile device so you can test the AdSense page-level ads and see if they are working correctly. You will need to be a visitor to your site in order to check out the ads.

- Type #googleads at the end of the URL so you can start to access them
- Select the ad format from the tabbed box that will appear above the body of the blog
- Check out the ads

You will get to see the ads in action before the public does so that you can tell if they are working fine. If you are impressed with what you see, then it is ready to go. However, if you see something that you want to change or if the ads are not present you’ll need to start over again.

The Effectiveness of Page-level ads
Since October, 2015 when these ads were first rolled out the effectiveness that they have demonstrated is considerable. Today, the ads have been used in countries all over the world and they continue to impress. For those who have already used these mobile ads on WordPress or other blogger blogs you can see just how effective they have been in terms of reaching all of your visitors. In addition, the effect on your revenue may be considerable depending on the popularity of your blog.

In the end AdSense page-level ads are remarkably effective for mobile use and will help you build a stronger income base for your blog.
Read More »
Designed by gendermoment'z Blog