Customizing Read More Link In Blogger

This tutorial will gonna help you to customize your read more link in your Blogger. Showing summaries of your blog posts in your homepage is always a good idea since showing full post of your recent post will gonna occupy a large space and your readers would have to scroll to see your below posts.

By showing summaries of your posts you are also enabling your readers to look up at the posts below your most recent post. Blogger includes this READ MORE feature but for more better look I am gonna explain you step by step procedure to customize your READ MORE link in your Blogger.


Steps To Customizing Read More Link In Blogger:-


1--> Login to your Blogger Account.

2--> Go to Blogger Admin Page > Template > Click on Edit HTML.

3--> Check Expand Template.

4--> Ctrl + F and find  <data:post.body/>


You will find codes like given below:-

      <data:post.body/>

      <div style='clear: both;'/> <!-- clear for photos floats -->

    </div>

    <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--> Now replace the blue codes with codes given below:


 <!--READ-MORE-STARTS--><b:if cond='data:blog.pageType != "item"'> <a expr:href='data:post.url'><div style="text-align: right;">Read More ->></div></a> </b:if>            

<!--READ-MORE-STOPS-->

You can Replace the Red text with anything you want to show up in your Read More link. You could also show up image in ths link now. Just replace the Red text with <img src='Link-of-the-image'/>

6--> Save your template and its done.