3
comments
" Read More : & Keep your Reader "
Does your Blog run on forever....with no end in sight ? .If so , then it's no wonder you cannot keep your reader on your page for more than 2 minutes ! You need to implement the " Read More " option on your page immediately !
Yes, I am quite aware of the problem which many Bloggers have concerning their pages which tend to run on forever into next week ! Honestly Bloggers , it does not help your page , you nor your reader in any way , and chances are : Most of your readers will run as far as they can from your page once they see that your blog is longer than the Gettysburg Address ! and I am not exaggerating at this point .
So, what do you say we put an end to this problem and get you to implement a Read More so that you can save the life of your Blog and your reader ? ( and possibly your own :)
This procedure will be as painless and as easy as crossing the street - so , lets begin :
<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>
<div class='post-body entry-content'>
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'/>
</b:if>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'><img align='left' src='http://img87.imageshack.us/img87/9306/92702304.png' style='border:0px;'/></a>
</b:if>
</b:if>
<div class='post-body entry-content'>
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'/>
</b:if>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'><img align='left' src='http://img87.imageshack.us/img87/9306/92702304.png' style='border:0px;'/><br/><b>Read More</b></a>
</b:if>
</b:if>
Now if you have done this , please click Save Template and let us complete one more step before this can take effect and appear on your page ok ? Lets go onto the next & final step now :)
....Title....
<span class="fullpost">
The rest...
</span>
Now hit "Save" and go to your Posting ; You will now see this code within your posting box .
Where you see the " Title " , you will post exactly that - your sub-title to your post ( as your Main Title will go above into your Main Title ) . You will write your subtitle and a BRIEF outline of your post there . Now below where it says : " The rest " you will go on to write the rest of your article / post , and you will stop exactly above the </span> tag . Once you are done with your article , filling in your labels & such - just hit the Publish Post button and you are done ! Voila !!!
Now that wasn't so difficult was it ? . This function will appear every time you write a new post . Enjoy & happy blogging ! * If you should run into any trouble , drop me a comment and I will assist you .
Keep smiling , Mootools & JQuery love you :)
So, what do you say we put an end to this problem and get you to implement a Read More so that you can save the life of your Blog and your reader ? ( and possibly your own :)
This procedure will be as painless and as easy as crossing the street - so , lets begin :
Please go to your Dashboard : go to EDIT HTML > EXPAND WIDGETS and apply the following code precisely above or anywhere above the </head> tag :
Please copy & paste the code below, above the </head> code as specified :
<style>
<b:if cond='data:blog.pageType == "item"'>
span.fullpost {display:inline;}
<b:else/>
span.fullpost {display:none;}
</b:if>
</style>
Now that you have done this , let us scroll further down within our template and find the following code : **[ Please note : Some templates have 2 <p><data:post.body></p> elements - make sure you apply the code below under the 2nd one ! , now look at the entire code below , and look for the Highlighted part of the code , that is exactly where you will place your own code , lets go :
<div class='post-body entry-content'>
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'/>
</b:if>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'><img align='left' src='http://img87.imageshack.us/img87/9306/92702304.png' style='border:0px;'/></a>
</b:if>
</b:if>
The code above is only with an image ( which is a clear arrow , such as the one running on my page here ) Now the second code below is with the Arrow Image + text which says " Read More " if you would prefer to have the text as well . Copy which ever code you prefer , or you may choose to change the clear arrow for a different image of you dont like the clear arrow .
<div class='post-body entry-content'>
<b:if cond='data:blog.pageType == "item"'>
<style>.fullpost{display:inline;}</style>
<p><data:post.body/></p>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'/>
</b:if>
<b:else/>
<style>.fullpost{display:none;}</style>
<p><data:post.body/></p>
<b:if cond='data:blog.pageType != "item"'>
<a expr:href='data:post.url'><img align='left' src='http://img87.imageshack.us/img87/9306/92702304.png' style='border:0px;'/><br/><b>Read More</b></a>
</b:if>
</b:if>
Now if you have done this , please click Save Template and let us complete one more step before this can take effect and appear on your page ok ? Lets go onto the next & final step now :)
Please look up at your control panel and click on SETTINGS | then click on : FORMATTING from the sub panel below . *** While you are on this page now , you may wish to choose the number of posts which will appear on your page - as most of you have like 20 articles running on your page - and this is a big NO-NO . The best number of posts to have on your page are 3-4 . It makes your page nicer - shorter - and the load time is much better on your users browser and they wont be scared of their browser crashing while they wait for your long page to load , so now would be a good time to choose 4 posts to be displayed on your page :) ***
Ok, if you are finished choosing your number of posts , let us move further down on the same page and all the way at the very bottom , you will see : " Post Template ". Please copy and paste the code below into that box :
....Title....
<span class="fullpost">
The rest...
</span>
Now hit "Save" and go to your Posting ; You will now see this code within your posting box .
Where you see the " Title " , you will post exactly that - your sub-title to your post ( as your Main Title will go above into your Main Title ) . You will write your subtitle and a BRIEF outline of your post there . Now below where it says : " The rest " you will go on to write the rest of your article / post , and you will stop exactly above the </span> tag . Once you are done with your article , filling in your labels & such - just hit the Publish Post button and you are done ! Voila !!!
Now that wasn't so difficult was it ? . This function will appear every time you write a new post . Enjoy & happy blogging ! * If you should run into any trouble , drop me a comment and I will assist you .
Keep smiling , Mootools & JQuery love you :)
Hello and Welcome to MiaZoe.com , I have recently ( about 1 month ago) begun this site as an Art and Design blog where resources will be offered on CSS , HTML, XHTML , JavaScript Source , feature profiles on ' New Up and Coming Web Designers ' and anything and everything pertaining to Development , Web Design , the Arts , Creativity and the like . Hope you will enjoy passing through and will love to hear from you on occasion , if you have ideas suggestions and information you would like to submit please feel free to do so . If you're a Rocker , you can check out my 
