Senin, 13 Januari 2014

Post Snippets Blogger


For me Post Snippets and Read More feature are not much different. The function is same : To shorten articles into summary or excerpt.
There some ways how to add post snippets with read more link at the end of the post summary.

This post will be about 2 other ways how to add the post snippets


Style 1.
  • Login to your blogger account ---> click   Template    ---> click   Edit HTML
  • Above / before    ]]></b:skin>    put these codes :
.thumb img{float:left; margin:0 10px 10px 0}
  • Next, find <data:post.body/> 
  • Replace the <data:post.body/> with the following codes : 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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='Image thumb'>
<img expr:src='data:post.thumbnailUrl'/>
</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 class='post-comment-link'>
<b:if cond='data:blog.pageType != &quot;item&quot;'>
<b:if cond='data:blog.pageType != &quot;static_page&quot;'>
<b:if cond='data:post.allowComments'>
<a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><b:if
cond='data:post.numComments == 1'>1 <data:top.commentLabel/><b:else/><data:post.numComments/>
<data:top.commentLabelPlural/></b:if></a>
</b:if>
</b:if>
</b:if>
</div>
</div>
<b:else/>
<data:post.body/>
</b:if>
</b:if>
</b:if>
</b:if>

  • Save template and done.

Style2.
  • Login to your blogger account ---> click Template ---> click Edit HTML
  • Above / before    </head>    put these codes :

<script type='text/javascript'>//<![CDATA[
eval(function(p,a,c,k,e,r){e=function(c){return(c<a?'':e(parseInt(c/a)))+((c=c%a)>35?String.fromCharCode(c+29):c.toString(36))};if(!''.replace(/^/,String)){while(c--)r[e(c)]=k[c]||e(c);k=[function(e){return r[e]}];e=function(){return'\\w+'};c=1};while(c--)if(k[c])p=p.replace(new RegExp('\\b'+e(c)+'\\b','g'),k[c]);return p}('5 6(s,n){b s.c(/<.*?>/d,"").e(/\\s+/).f(0,n-1).g(" ")}5 h(a){i p=j.k(a),3="",2=p.l("2");m(2.o>=1)3=\'<2 7="8" 4="\'+2[0].4+\'" />\';q 3=\'<2 7="8 r-2" 4="t://u.v.w/-y/z-A/B/C-D/E.F" />\';p.9=\'<a G="\'+x+\'">\'+3+"</a>"+"<p>"+6(p.9,H)+"...</p>"};',44,44,'||img|imgtag|src|function|stripTags|class|thumb|innerHTML||return|replace|ig|split|slice|join|readmore|var|document|getElementById|getElementsByTagName|if||length||else|no||https|lh4|googleusercontent|com||G9M2DTCTUwM|Tlh|2pwtc5I|AAAAAAAABKM|kCJg|Kf3W2M|no_image_yet|jpg|href|12'.split('|'),0,{}))
//]]></script>

  • Next, find     <data:post.body/> 
  • Replace the    <data:post.body/>     with the following codes : 

<b:if cond='data:blog.pageType == &quot;index&quot;'>
<span expr:id='&quot;p&quot; + data:post.id'><data:post.body/></span>
<script type='text/javascript'>var x=&quot;<data:post.url/>&quot;;readmore(&quot;p<data:post.id/>&quot;)</script><b:else/><data:post.body/></b:if>
<br/>
<b:if cond='data:post.hasJumpLink'>
<a class='jump-link' expr:href='data:post.url + &quot;#more&quot;' rel='nofollow'>READ MORE &#187;</a><b:else/>
<b:if cond='data:blog.pageType == &quot;index&quot;'>
<a class='jump-link' expr:href='data:post.url' rel='nofollow'>READ MORE &#187;</a>
</b:if>
</b:if>

  • Save template and done.

0 komentar:

Posting Komentar