Now you can Subscribe using RSS

Submit your Email

Friday, March 13, 2015

Post Snippets Replacement Auto Readmore Script on Blogger

Irvan Dev

Post Snippets Replacement Auto Readmore Script.  Several techniques to cut the content textual shown on the homepage. The most widely used is actually while using set of scripts auto readmore, but some are still using mannual way to jump break method provided by the bloggers in posting area compose mode and tag <! - More -> to post html mode.
Other alternatives which we will disccuss in this posting is usiing the metode of data:post.snippet to cut post articles or content and data:post.thumbnailUrl in order to call up the images on the article.  I'm sure using this metode is actually more simple and standard because its very easy and does not require the javascript to implemented. However, each method has definite disadvantages of each other, as well as this way. For application into a template, as a benchmark i use the default blogger template for easy and understandable.
Please follow the steps below:

Post Snippets

1. Login to your blogger panel adminn
2. Click On Template » Edit HTML
3. Find this code <b:includable id='post' var='post'> using Ctrl+F then underneath there will be two code <data:post.body/> replace the second code <data: post.body /> with the following code:

Post Snippets Irvandev Blog
Post Snippets[images source:www.acebangsam.us]
<data:post.body/>
<b:else/>
<b:if cond='data:blog.pageType == &quot;static_page&quot;'>
<data:post.body/>
<b:else/>
<b:if cond='data:post.hasJumpLink'>
<data:post.body/>
<b:else/>
<b:if cond='data:post.snippet'>
<b:if cond='data:post.thumbnailUrl'>
<div class='thumb'>
<a expr:href='data:post.url' expr:title='data:post.title' expr:alt='data:post.title'><img expr:src='data:post.thumbnailUrl'/></a>
</div>
<b:else/>
<div class='thumb'>
<a expr:href='data:post.url' expr:title='data:post.title' expr:alt='data:post.title'><img src='http://1.bp.blogspot.com/-1VKgle_TeUk/VQBGB2Z4b0I/AAAAAAAAAv4/chdblGxUfCs/s250-c/protect%2Blink.png'/></a>
</div>
</b:if>
<data:post.snippet/>
<div class='jump-link'>
<a expr:href='data:post.url + &quot;#more&quot;' expr:title='data:post.title'><data:post.jumpText/></a>
</div>
<b:else/>
<data:post.body/>
</b:if>
</b:if>
</b:if>
</b:if>
5. To adjust the appearance of the homepage you can use css code below than add  just above the code ]]></b:skin> or </style>
.thumbnail img{float:left;margin-right:15px;width:150px;height:90px}
.jump-link{display:inline;float:right;padding:7px;background:#fcfcfc;margin-top:17px}
Click save and see the results, good luck.

Irvan Dev / Author & Editor

I am Irvandev, I m a fairly easy blogger and it's, untill today My spouse and i still love writing and submitting articles for blog site "Blog Irvandev".

0 comments:

Post a Comment

Coprights @ 2016, Blogger Templates