Expand Your Post!!

Expandable Post means when you create a long article post, (which forcing your reader to scroll all the way down to read the entire of your blogpost) it could save more of the loading time and save their time from just reading the exciting post only. Actually for those who always used to write short story, this tweaking tips doesn't really necessary to be implemented.

But it will be a big help (and really does help) for those who likes to make long reading article post.

Let us see the steps to be followed for modifying the template to implement this

1. Log in to your blogger account select Layout of the blog which you want to modify


2. Navigate through Template –> Edit HTML


3. Take backup of your template by clicking Download Full Template. This backup will help you if you want to revert to old template


4. Search for ]]></b:skin> in your template HTML and paste the following piece of code in between ]]></b:skin> and </head>








<!-- Style to implement "Read more on this Article" link in all the posts (Start) --> <style> <b:if cond='data:blog.pageType == "item"'> span.fullpost {display:inline;} <b:else/> span.fullpost {display:none;} </b:if> </style> <!-- Style to implement "Read more on this Article" link in all the posts (End) -->







• Save your template and click on select Expand Widget Templates Search for <data:post.body/> in the template HTML and paste the following piece of code after <data:post.body/>











<!-- Code to show "Read more ..." Link (Begin) --> <b:if cond='data:blog.pageType != "item"'> <span> <a expr:href='data:post.url' style='color:#0000FF; text-align:right; font-weight:bold; text-decoration:none' >Read more ...</a> </span> </b:if> <!-- Code to show "Read more..." Link (End) -->






You can change the red text with any Text like “Continue reading..” “Read rest of this entry” “Read more” etc as per yours blogs content.

Post Modifications - The final piece that we need is a little bit of code in your actual post. Each post that you want to use this feature on will need this code





<span class="fullpost">
</span>




This part can actually go in the post template, if you don’t want to have to type it for each post. You’ll enter the summary text outside the span tags and the remainder inside.










Beginning of post.<span class="fullpost"> here is the rest of it.</span>






Now, when a reader visits your blog, this post will appear like below: