ADD AUTO JUMP BREAK TO YOUR BLOG POST

Blogger offers  auto jump break to a post which shows the summary of your post on your homepage with a link "Read more..", with this link it enable the user to know the summary of your post on your homepage before reading the full content of the post without giving visitor problem of scrolling down to check your full page . Although your may use manual jump break but to be factual it waste time, just try to use this auto hack and is very easy to use.

Benefits Using this Hack

* Including jump break speed up your homepage to load faster .

* It increase the no of your page view. etc

Using the Jump Break

Be careful in editing your template , kindly backup your template on a drive for easy recovery

* Go to blogger Dashboard or blogger.com

Note: Log in to your account first

* Click on Template , Next to Edit HTML make sure you Tick The Expand Widget Templates Box

* Next,find the following piece of code in your blogs Html : (Using CTRL + F and locate) </head>

* Copy the code below Above or Before the this code </head>

<script type='text/javascript'> var thumbnail_mode = "no-float" ; summary_noimg = 430; summary_img = 340; img_thumb_height = 120; img_thumb_width = 120; </script> <script type='text/javascript' src='http://widgets.way2blogging.org/blogger-widgets/w2b-auto-readmore-blogger.js' ></script>


Note: You can only change the value of the code in blue in your code 

summary_ noimg= 430; --> this shows the length of the summary if the post does not have a thumbnail.

summary_img = 340; --> this shows the length of the summary if there is an image in the post that will be converted into a thumbnail. 

null_thumb_height = 120; --> The height in pixels of the thumbnail. 

null_thumb_width = 120; --> The width in pixels of the thumbnail. 

* Now,find the following piece of code in your blog's Html : (Using the same  CTRL + F and locate the below code) <data:post.body/>

* Now,replace <data:post.body/> With The Code Below

<b:if cond='data:blog.pageType == "item"'> <data:post.body/> <b:else/> <b:if cond='data:blog.pageType == "static_page"'> <data:post.body/> <b:else/> <div expr:id='"summary" + data:post.id'> <data:post.body/> </div> <script type='text/javascript'> createSummaryAndThumb("summary<data:post.id/>"); </script> <div style='clear: both;'/> <span class='rmlink' style='font-weight:bold;padding:5px;float:right;text-align:right;'><a expr:href='data:post.url' >Read more ... </a></span> </b:if> </b:if>

Note here: You can change "Read More..." to any content of your choice like "continue reading" or Read more post".

* Make sure your preview to see how it work.

* Finally save your Templates.

If you undergo this tutorial by now you must be able to do this by yourself. Your comment is needed on this blog and make sure you share with others.

Tweet

Thanks for visiting Informative Blog . You can subscribe via email to receive more updates:

We love to give you the best on Informative Blog just follow our blog:

Related Topics:

Posted byUnknown on April 8, 2013