How To Install Auto Read More For Blogger Or Blogspot

Auto read more function is to cut / summarize an article with only a few characters display text on the main page of the blog. In addition to shorten the sentence that is displayed on an article, auto read more automatic will work for all article posts that we make.

install feature Auto readmore we need to make put the code <! - More -> or clicking every time to post. Features auto readmore will reduce this work as it automatically all the posts that appear on the main pages (eg home, search query results, results tags, etc.) will be truncated to auto readmore.

Here are the steps:

1. Entered into an HTML template editor. Download template first just to be safe.
2. check expand widgets template.
3. Enter the following script RIGHT BEFORE the closing </ head> (use Ctrl + F to search)

<script type='text/javascript'>
thumbnail_mode var = "float";
summary_noimg = 230;
summary_img = 140;
img_thumb_height = 100; img_thumb_width = 100; </ Script>
<script src='https://sites.google.com/site/bukarahasiahost/azmeereadmore/azmee-readmore.js' type='text/javascript'/>

caption:

• Summary_noimg = 230; is the number of characters that will be displayed when there are no pictures in your post, you can change the amount.
• Summary_img = 140; is the number of characters that will be displayed when there is a picture in your post, you can change the amount.
• Img_thumb_height = 100; thumbnail images is high, you can change its value.
• Img_thumb_width = 100; was the width of the thumbnail image, you can change its value.
  But just to be safe abandon.

4. Continue to seek <data:post.body/> (as always, use Ctrl + F guns)
5. Then CHANGE <data:post.body/> with the following script:

<b:if cond='data:blog.pageType == "item"'>
<data:post.body/>
<b:else/>
<div expr:id='"summary" + data:post.id'>
<data:post.body/>
</ Div>
<script type='text/javascript'>
createSummaryAndThumb ("summary <data:post.id/>");
</ Script>
<div style='clear: both;'/> <span style='padding-top:5px;;float:right;text-align:right;'> <a expr: href = 'the data: post.url' rel = 'bookmark'> <b> Read more >> </ b> </ a> </ span>
</ B: if>

Caption:

• Padding-top: 5px, change the values ​​to make the distance with writing on readmore.
• Float: right, replace right to left if you want to readmore appears on the left.
• You can change the Read more with other words such as "read more", "Read the rest of this entry", continue Reading!", Or whatever it is ...

6. To verify the results, not in-save first. Use preview to check it out.
7. Once done, please be save.
8. Finished, you've now got an auto readmore for bloggers.

Posted in: Blogger Design,Blogger Layouts,Blogger Tutorials