Contact Us:

If You Have Any Problem, Wanna Help, Wanna Write Guest Post, Find Any Error Or Want To Give Us Feedback, Just Feel Free To Contact Us. We Will Reply You Soon.

Name: *


Email: *

Message: *


Skillblogger

Download our app on Google Play Store

Thursday, April 4, 2013

Fixed: Customize Your Read More Buttons

Customize Your Read More Buttons
Welcome again dear bloggers, in this new topic, after my last article about how to Add some effects of mobility on the images to blogger Blogs will learn today how to add a very important feature in the special field of additions, it is the property of blogger "Read more".
As you are aware, many websites and blogs with most widely known in the field of blogging use this property in most of the articles that their liberation - if not all - this considering the importance gained by the its role, which focuses on shorten articles  to a small articles.
I'm not saying that it delete the sentences and words from the original article, but rather showing this last on the home page as a brief includes the title of the article and some sentences that commence and an Introduction as well as a thumbnail image if available, and of course this post will be beside the shortcut button "Read more "and which would transmit it if pushed to display the full original post as a vector of sentences and details, do not forget to mention the importance of this topic in addition give an impressive beauty to the blog rather than the traditional form that appears entries complete and long on the main page,
which could affect way or another on the performance of the blog and in causing weight browse, which makes visitor alienate them and thus reduce the order of the blog in Google, in addition to what are adding this addendum, from splendor and attractive appearance of the blog it contribute also to benefit of the number of visits considerable compared to previously where we force through which the visitor to browse all blog entries on the unit and thus ensure more visits.
     After identifying the benefits of add "Read More" move on Beware dear readers to the most important thing in this whole subject is to explain how to add this feature, I suggest you to preview first an example of added here



     After previewing the previous example we turn to the control panel of the Blog, press the "design", then "Edit HTML" then tick the box templates expand the user interface elements.
Find the following code, through the use control panel (CTRL + F). 


</head>


Paste the following code directly above it (before)


<script type='text/javascript'> var thumbnail_mode = &quot;float&quot; ; summary_noimg = 430  summary_img = 340  img_thumb_height = 100; img_thumb_width = 120  </script> <script src='http://keerthiset2.110mb.com/excerpt.js' type='text/javascript'/>
 
in above codes you can change the numeric numbers according to our use
summary_noimg = 430;:Summary length if no image
summary_img = 340;:Summary length if it has image
img_thumb_height = 100;:Thumbnail image height
img_thumb_width = 120;:Thumbnail image width
 After that find this code in your template:
<data:post.body/>
And replace it with below code:
<b:if cond='data:blog.pageType == &quot;item&quot;'> <data:post.body/> <b:else/> <div expr:id='&quot;summary&quot; + data:post.id'> <data:post.body/> </div> <script type='text/javascript'> createSummaryAndThumbundefined&quot;summary<data:post.id/>&quot;); </script> <div style='clear: both;'/> <span style='padding-top:5px;;float:right;text-align:right;'><a expr:href='data:post.url' rel='bookmark'><b>Reade More >></b></a></span> </b:if>
You can also change the phrase read more of any the phrase you like, and you can also add a picture place of the previous statement, which refers to the pressure to follow up on reading, and this is by copy the code below and paste it place the phrase read more :


<img src="Enter The Image Link" title="read more" alt="read more"/>

You can use the engine google gigantic to search for a different picture write the words "Read More Buttons" and press search then it will appear before you, a wide range of results is in a variety of colors and other buttons to read more, choose one of them then copy the link and paste it place the blue link above,But if you are a professional designer then you can make your own button Read more according to the specifications that you want so characterized from the rest of the sites. Dear so we got to the end beware our theme for the day, I hope that I have managed to raise this issue, that the gain you like it, please publish it to your accounts on Facebook Twitter. Greetings.

Like the Post? Share with your Friends:-

Team SB
Posted By: Team SB
Comment Using

Comment Policy : We’re enthusiastic to see your comment. However, Please Keep in mind that all comments are moderated manually by our human reviewers according to our comment policy, and all the links are nofollow. Using Keywords in the name field area is forbidden. Let’s enjoy a personal and evocative conversation.

17 comments :

  1. Many Many  
    Many Many  
    Many Many   Thanks 4 it....

    ReplyDelete
    Replies
    1. @Irfan Doggar

      You're welcome Irfan, any time ;)

      Delete
  2. worked for my blog http://www.ultimateprogrammingtutorials.blogspot.com


    thanks alot

    ReplyDelete
  3. you just spoilt my blog with your code. All my posts are deleted. Thanks!

    ReplyDelete
  4. before it was working but now its not working why i dont know please help me fast bro

    ReplyDelete
  5. my blog name www.DjFilmi.Com

    www.HindiBollyWoodBuzz.Blogspot.com

    ReplyDelete
  6. thnx so so much!! was super easy and help me tooooooo much! Mwa

    ReplyDelete
    Replies
    1. You're welcome Thandi, feel free to browse more posts.

      Delete
  7. @King Salman & @Surfme I think that you have some problems on your blogs

    ReplyDelete
  8. @Thandi Le'mana You're welcome my dear friend if you need more help any time just PM me :)

    ReplyDelete
  9. It's not working. I followed all your steps correctly but it didn't showing up on my blog.my blog address is this

    http://www.onlinetechtricks.com/


    but it is working fine on this blog instead of above blog

    http://demoblog786.blogspot.com/

    what is wrong with the blog why it is not working with onlinetechtricks.com

    Thanks In Advance

    ReplyDelete
    Replies
    1. It's Work Bro, you need just to change the template into a responsive one, you can browse our professional templates if you like ;)

      Delete
  10. Replies
    1. You're welcome Muhammad be free to browse what you like ;)

      Delete
  11. Nice info dude..thanks for sharing ...
    You can also add this without any modification in template.
    The info is given here : http://goo.gl/rSWFnK

    ReplyDelete
  12. In my templates there are 3 ... which one have to replace?
    http://boxygames.blogspot.com/

    ReplyDelete

Download our app on Google Play Store

Contact Us

Name

Email *

Message *

 
Copyright © . Skill Blogger . All Rights Reserved.
Designed by :- Way2themes