Announcement:

  Hello, We Changed Our Cloth, How It Is Looking? Leave Your Feedback At Our Page.

Monday, December 24, 2012

How To Change Read More Text With Your Image In Blogspot?

This Article Was Live On: Monday, December 24, 2012 And Till Now Have14 comments.
How To Change Read More Text With Your Image In Blogspot?

Do you want to change your "Read more" button with any other text or image? If you want to change i have very easy and simple method to change it. Its look very professional when visitors see different style of read more buttons. Lets see how to change this button. I will guide you in each and every step.

Change Read more button, Change text, Add images or animations. How to customize Blogger read more button. There are the topics we are going to learn on this post. If you don't know about blogger Jump breaks, You can read How to add Jump Breaks to Blogger posts article. Blogger will add " Read more >> " Text as default Jump Break text. we can easily change this text and its attributes like font, size align using basic Html and Css codes.

We also can link an image file for it. Have you seen animating read more buttons? It's very easy to do. Just make animating button and save it as .Gif image. now you can link that image to your Jump break as we learn on this post.

Features:

1.) Change The Text "Read More" To Another Words.
2.) Add An Image/Button To Your "Read More/Jump Breaks” In Blogger Links Instead Of Plain Text.
3.) Choose Your Read More Link/Button To Be Displayed On Left Side, Right Side Or Center it.

How To Add In Blogspot?

1.) Go To Your www.blogger.com
2.) Open Your Desire Blog.
3.) Go To "Template".
4.) Click "Expand The Widget Template" .
5.) Now Press "CTRL+F"Find The Below Code.
<data:post.jumpText/>
6.) Now Copy The Below Code And Replace It With The Above Code.
7.) Click Save, Now You Are Done.

Change With Text:

<p align="left">Read More</p>

Change With Image:

<p align="left"><img src="http://1.bp.blogspot.com/-UoDZufr55EU/TVRLFERHQTI/AAAAAAAAC4U/xbdf1z-WmSE/s1600/read-more-4.png" border="0" alt="Read Full Post" title="Read Full Post"/></p>

Customization:

1.) You Can Change Your Picture By Changing Blue URL.
2.) You Can Change Red Text With Your Desire One.
3.) Change left With right Or center As You Wish To Display The Button On That Position.

Some Gif, Png, And Animated Button Are Also Available Here.


You Like It, Please Share This Article Using...




Don't Forget To Read This Also...



14 comments :

  1. this code is not in my blog,,wat to do?

    ReplyDelete
  2. how To fix Read more position ?? it is showing on left side and i want to fix it on right side...

    ReplyDelete
    Replies
    1. Add < p align='right'> Before Your Image Code And < /p> After Your Image Code.

      Delete
  3. Thanks .. How To Add Auto Read More With Thumbnails For Blogger ?

    ReplyDelete
  4. I was able to do it on the first try, just wish the buttons were lightly larger.

    ReplyDelete
    Replies
    1. Thanks, Just Google The ReadMore Image For Your Desire Or Design Your Own On Any PhotoEditor Software...

      Delete
  5. the code doesn't appear on my blog. what should I do ?

    ReplyDelete
    Replies
    1. Now After UpDate, First Search (id='Blog1') Then Expand It And After It Search (id='post') And Expand It Then Find The Above Code And Add Our Code Below IT.

      Delete
  6. I recently set up another blog, the code is not there. The template i'm using is by Awesome Inc. My blog is maclovesmarilyn on blogspot. BTW, I have it installed on two of my other blogs and works perfectly, is there an alternative code that might work?

    ReplyDelete
    Replies
    1. Every Template Have It, Just Download Your Template And Send Us, We Will Fix It For You.

      Delete
  7. Oh my god. I usually never comment on websites but you REALLY helped me out. After trying all the html codes all over the internet and screwing up my template multiple times I have finally found something that WORKS!! Bless you!

    ReplyDelete
    Replies
    1. Welcome Here And Thanks For Using Our Codes. Be With Us To Get More Like This In Easy Steps...

      Delete

Speak Your Mind:



Please Read The Rules Before Commenting:-

1.) Your feedback is always appreciated. We will try to reply to your queries as soon as time allows.
2.) Make sure to click the "Notify me" link below the comment to be notified of follow up comments and replies.
3.) Please "Do Not Spam".
4.) Please "Do Not Add Links" to the body of your comment as they will not be published. If the quires contain link then never add HTML tag to it.
5.) Only "English" comments shall be approved and answered.
6.) If you have a problem check first the comments, maybe you will find the solution there.
7.) Your comments must contain 100+ characters to remain accepted.
8.) Never Use Keywords In The Name Section Otherwise Your Comment Will Be Deleted.
9.) All comment will be deleted if it will not fulfil the requirements.