Creating a post summary only format (selective expandable posts) is very useful for bloggers especially for those who write long posts. Besides, this method provides a teaser of their full post on the main page that would encourage readers to read the whole article on the exact post pages instead.

The circled “Read More……” method above is what we are going to create to prevent from showing long long post.

This method will also makes a tidy blog, prevent long loading time of showing all the exact full post of your blog if you have lots of long long post as below in font page of your blog.


With a combination of JavaScript and Blogger code, you can edit to select which summary post format will be displayed on your main, archive and search pages.
Only on the exact post pages, the full content of your post will be displayed.

This is an improved method adapted from the previous hackosphere’s original method.

Guide below showing steps to do it.

The blue color code is your original code in blogger, while the red color is the add on code.

This modification only add on the red color code into the original code, that’s it.

Make sure you download your existing blogger template for backup before you start.

Ok, Let’s start.

Step 1.
Select the checkbox named “Expand Widget Templates”, which is right above the
template code, to expand it into more code. You can use “Ctrl + F” to find the code for replace.
Instruction step 1

Step 2.
Find the div “post-body” and add the portion of code in red color.
Instruction step 2

Step 3.
Create a blank test post in your blog with any title such as TESTING 123, select Edit Html mode, and paste the post code from “Instruction step 3” in your new post:
Instruction step 3

If you create a new post now, it shows you clearly where to type the summary and where to add the rest of the post.

Please notethat you could divide some or all of your old posts into summary and full post by editing them. The “Read more” link will appear only for the posts that have been divided like this.

Adding the circled “post code” from Instruction step 3 to where the summary stop.

Adding the circled “post code” from Instruction step 3 to the bottom of post.

Tips:

If you click “Older posts” link, the “Read more” link will not appear, you can use the same code method in step 3 for the test post you created to adjust the summary content that you want to show in your post.