Automatic Post Summary or Expandable Post Summary is one of the most sought features by bloggers. What it really does is - Loads the Home page faster, Enhances blog space utilization and Gives the blog a simpler yet compact design.
Unfortunately this feature is absent by default on Blogger, so all I'm going to do is to explain a short and simple tutorial to create Automatic Post Summary with a Read More Button for each post of your Blog.
So let's Get started -
1. Login to your Blogger account.
2. Go to Dashboard > Template > Edit HTML.
3. Back Up your Template (as a precaution)
4. Check the Expand Widget Templates check box on top right of the HTML window.
5. Press CTRL+F and look for </head> tag.
6. Add the Read More code below the tag.
Download Read More Code with Instructions
CUSTOMIZATION INSTRUCTIONS
I.summary_noimg - change size of summary with no image thumbnail
II.summary_img - change size of summary with thumbnail
III. img_thumb_height, img_thumb_width - change dimensions of the image thumbnail
7. Now Press CTRL+F and search for <data:post.body/>
You are bound to have more than one such tags, choose the tag before the Jump-Link condition (generally the 2nd <data:post.body/> tag).
Replace the tag with the following Code - Download Read More Button Code
CUSTOMIZATION INSTRUCTIONS
I.Replace img src "https://dl.dropbox.com/u/110248421/light-blue.png" with your own Read More button image URL. Else you can use this image.
II. If you want to use a "Read More" text link only, then replace code no. 10 with this code:
"<a class='more' expr:href='data:post.url'><br/>Read More>></a>"
8. Click Preview to check if Automatic summaries are generated.
If it works the Save Template.
That's it. Now your Home page will have a all new look and will load faster than before.
You can customize the codes to suit your Template.
If you encounter any problem while adding these codes or you want any further help then do drop me a comment.
If you find this post useful then do share with your Blogger mates. To get regular updates Like Our Facebook Page
It's not working.
ReplyDeleteYour code for step 7 seems invalid.
Thanks, that cool
ReplyDelete