Tuesday, November 20, 2012

Add Read More link to your posts in your Google blogger site


Add Read More link to your posts in your Google blogger site


Most of the bloggers, want to show more than one post in their blog's home page, but displaying all the content on the home page of each and every post makes the home page very lengthy, and visitors may miss out any article while scrolling down the entire length of the page.
So here's a method for bloggers to display only a part of the posts, and not the entire posts. If a visitor wants to read the complete article then he/she will click on the "Read More" link at the bottom of the post, which will be redirected to the particular post.

READ MORE



Steps to follow:
1. Log into the Blogger.com account
2. Go to "Template" section and Click on "EDIT HTML"
3. Back up your current template, by downloading it.
4. Now click on "Expand Widget Templates"
5. Now find this code -
]]></b:skin>
6. Just AFTER that code add these lines

<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>

7. Now again find this code :
<data:post.body/>

8. And just after this, add these code lines:
<!--READ-MORE-STARTS--><b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'>Read More!</a>
</b:if><!--READ-MORE-STOPS-->

If you want to shift the "Read More!" text to the extreme-right side, use this code:

<!--READ-MORE-STARTS--><b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'><div style="text-align: right;">
Read More !</div>
</a>
</b:if><!--READ-MORE-STOPS-->

9. Now save the template.
IMPORTANT :Now these adjustments will NOT show your previous posts with "Read More" tag, but you can display them with Read More tags, by editing them with instructions as below:

From now on, whenever making a new post, the part you want to be seen on the homepage including images should be here "Post in brief, may include pictures too" then the concluding part that you want to hide, that will be seen after they click on Read More should be here "Hidden part" as shown below. Note that you dont need to past the first part in the "Hidden part" it will automatically be brought on the new page.


<div style="text-align: left;">
Post in brief, may include pictures too
<span class="fullpost">Hidden part</span>
</div>


For quicker posting next times Go to Setting-Post and comment setting- click add template and paste the code above, so that you dont have to be looking for the code each time you want to post a new blog, but rather anytime you wanto post a new blog like tis just click on New Post, the above HTML will already be there, so all you have to do is to edit you new content into "Post in brief, may include pictures too" and here "Hidden part" . thats all. leave you comments and thanks and please refer my forum and facebook and all you can find...


No comments:

Post a Comment