Blogger Auto Read More Hack : Improved With Many Control Options

Blogger auto read hack is the best hack available for blogger.Almost every blogger use this hack.This hack automatically create post summaries with thumbnails.We already shared a auto read more hack for blogger but this time we are sharing updated auto read more hack.With using this can controls following options as you wish,

1. You can add default thumbnail image when your posts don't have any image.
2. You can turn off auto read more for some first posts.
3. Option to turn on/off read more for home page and labels page.

Above are the some features of this new auto read hack the script of this new hack is created by Rilwis.Now lets see how to apply this hack,

How To Add Auto Read More Hack To Blogger?

If you have already added a old read more hack then you have to remove it first.

1. First go to Blogger Dashboard > Template
2. Download a copy of your template
3. Click Edit HTML
4. Hit Proceed
5. Check Expand Widget Template checkbox
6. Find below code in your template

</head>

add below piece of code just above it,

<script type="text/javascript">
var summaryConf = {
    showImage: true,
    imgFloat: 'left',
    imgWidth: 120,
    imgHeight: 90,
    defaultThumb: 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwNiECo0AGaNsXue-XGRjW1ylWh5hyIGEFO5eko8UNN-XiMQlrDWhRe7D43d-xDHZG120H8ORhKB6XCl5LKShN9KkylLl_eweklNJxPZZtHtaB2DyZiLU9EcodTjN8yhBUl3jEe9qOtQc/s1600/no-thumb.jpg',
    words: 65,
    wordsNoImg: 80,
    skip: 0,
    showHome: true,
    showLabel: true
};
</script>
<script type="text/javascript" src="http://code.helperblogger.com/summary.min.js"></script>

You can easily customize above highlighted values,below are their meaning

• showImage: true, If you don't want to show image thumbnail then simply replace true with false
• imgFloat: 'left', If you want to float image at the right of summary then simply replace left with right
• imgWidth: 120, This is width of image
• imgHeight: 90, This is height of image
• defaultThumb: 'https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjwNiECo0AGaNsXue-XGRjW1ylWh5hyIGEFO5eko8UNN-XiMQlrDWhRe7D43d-xDHZG120H8ORhKB6XCl5LKShN9KkylLl_eweklNJxPZZtHtaB2DyZiLU9EcodTjN8yhBUl3jEe9qOtQc/s1600/no-thumb.jpg', If you want to set your own default thumbnail then replace above image URL with yours.
• words: 65, This is number of words when there is a thumbnail
• wordsNoImg: 80, This is number of words when there is no thumbnail
• skip: 0, skip some first posts, don’t apply auto readmore for them. If this option is set to 0 so that all posts are applied auto readmore.
• showHome and showLabel: allow or not auto readmore for homepage and label page. true is allowed, false is not.

Now find below code in your template,

<data:post.body/>

replace it with below code,

<span expr:id='data:post.id'><data:post.body/></span>
 
<b:if cond='data:blog.pageType == "index"'>
    <script type='text/javascript'>summary("<data:post.id/>")</script>
<span style='float:right;padding-top:20px;'><a expr:href='data:post.url'>Read More</a></span>
<b:else/>
    <b:if cond='data:blog.pageType == "archive"'>
        <script type='text/javascript'>summary("<data:post.id/>")</script>
    </b:if>
</b:if>

Finally take a preview of your template,if you thing that everything is alright then save your template,if not then customize it as you wish and save it :)