How to Integrate ads below blogger post

Saturday, November 8, 2014

How to place an advertisement below each blog post, publisher always ask. Because of now publisher problem, which occurs when readers ignore side bar display ads while reading. This phenomena affects both blog publisher and brand advertisers. For instance, according to bannerblindness.org the average blog reader sees 1,903 adverts a month, while just 2.8% of the readers find these advertisement relevant. 


How to Integrate ads below each post on blogger blog?



Here are the step by step procedure on how to place your advertisements below on each post of your blogger blog. But before you start doing this, please back - up a copy of code using notepad in just case. Good luck...

1. Login to Blogger account and go to Template.



2. Click on Edit HTML.

You will be prompted html codes like what we have below.

<div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='description articleBody'>
        <data:post.body/>
 <div style='clear: both;'/> <!-- clear for photos floats -->
      </div>
    <b:else/>
      <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'>

        <data:post.body/>
        <div style='clear: both;'/> <!-- clear for photos floats -->
      </div>
    </b:if>

    <b:if cond='data:post.hasJumpLink'>
      <div class='jump-link'>
        <a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
      </div>
    </b:if>


3. Look for <data:post.body/> using keyboard shortcut Ctrl+F and key in data:post.body. There were three of them.

4. To integrate ads below each of your blogger blog post. Just past java script below data:post.body by refering below codes.

<div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='description articleBody'

        <data:post.body/>

            Your Java Scripts code are place here!!!!!!!
        

<div style='clear: both;'/> <!-- clear for photos floats -->
      </div>
    <b:else/>
      <div class='post-body entry-content' expr:id='&quot;post-body-&quot; + data:post.id' itemprop='articleBody'>

        <data:post.body/>
        <div style='clear: both;'/> <!-- clear for photos floats -->
      </div>
    </b:if>

    <b:if cond='data:post.hasJumpLink'>
      <div class='jump-link'>
        <a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
      </div>
    </b:if> 

5. Copy and paste script on that portion and click save template.

Happy blogging.

No comments:

Post a Comment

 

Enter your email address:

Delivered by FeedBurner

Blogroll

Popular Posts

Technology & Computers - Top Blogs Philippines