How to align "Read More" link to the Right side

The "Read More" functionality is very much common in all the blogger blogs these days. Each customized template and even the default template has the

summary hack feature. The problem is many blogger templates has it with aligning in the left side, which is not very catchy and tends the users to search for the post link. So, in-order to make the "Read more" link grab attention to users, we must enhance it. I thought the best way of doing it is by aligning it to the right side and giving it text effects.

So, before we start doing this, lets start from the basics :) , backing up your template.


1. Login to your blogger account.

2. Go to "Design"  and "Edit HTML" link

3. Expand Widget Templates

4. Now find this piece of code in your template by copying this code and pasting it in the text box, that appears when CTRL + F is pressed.

<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>

6. Then replace the above code with the following code.

<b:if cond='data:post.hasJumpLink'>

<div class='jump-link'>

<a expr:href='data:post.url + &quot;#more&quot;'><p align='right'><b>Continue Reading-&gt;&gt;</b></p></a>

</div>

</b:if>

7. Save Your template. And its done !

Code Changes:
To make it italicized and blod, just add  <i> and </i> tags with "Continu Reading" in between.

To change the text "Continue Reading" to some other text, just modify the word directly.