How To Add Simple Related Posts Widget To Blogger

ဒီပုိ႔(စ္)ေလးကေတာ့ Simple Related Posts ေလးပါ။ တင္မယ္တင္မယ္နဲ႔ အလုပ္ေတြမအားလုိ႔ မတင္ျဖစ္ပါဘူး။ ဒီေန႔မွဘဲ ခ်စ္မိတ္ေဆြေတြအတြက္ ဘာတင္ေပးရင္ေကာင္းမလဲလုိ႔စဥ္းစားၿပီး က်ေနာ္သုံးေနတဲ့ Cond ေလးကုိ ေ၀မွ်ေပးလုိက္တာပါ။ ႀကဳိက္ၾကမယ္လုိ႔လည္း ေမွ်ာ္လင့္ပါတယ္။ ေအာက္မွာ Cond နဲ႔ Demo ပုံလည္းျပေပးပါတယ္။ Demo ဆုိရင္ေတာ့ ဤဘေလာ့မွာ ၾကည့္နုိင္ပါတယ္။

၁။Sign In Blogger

၂။ Template

၃။ Edit HTMl

၄။ Proceed
Expand Widget Templates ကုိအမွန္ျခစ္ေပးလုိက္ပါ

၅။ ေအာက္က Cond ေလးကုိရွာပါ။Ctrl + F ကုိတြဲနုိပ္၍ရွာပါ ၊ ရွာရလြယ္ပါတယ္။

</head>

ေတြၿပီးဆုိရင္ </head>  ရဲ႕ေအာက္မွာ ေအာက္က Cond ကုိ ထပ္ထည့္ေပးလုိက္ပါ။

<!--Related Posts Scripts and Styles Start-->

<!--Remove--><b:if cond='data:blog.pageType == &quot;item&quot;'>

<style type='text/css'>

#related-posts {

float:center;

text-transform:none;

height:100%;

min-height:100%;

padding-top:5px;

padding-left:5px;

margin-top: 20px;

}

#related-posts .widget{

padding-left:6px;

margin-bottom:10px;

}

#related-posts .widget h2, #related-posts h2{

font-size: 17px;

font-weight: normal;

color: black;

font-family: Arial Narrow;

margin-bottom: 0.75em;

padding-top: 0em;

}

#related-posts a{

font-size:16px;

color: #555555;

font-variant:small-caps;

}

#related-posts a:hover{

text-decoration: none;

color: #ffffff;

font-weight: bold;

}

#related-posts ul{

list-style-type:none;

margin:0 0 0px 0;

padding:0px;

text-decoration:none;

text-color:#000000

}

#related-posts ul li{

list-style-type: none;

border-left: 2px solid #1399CF;

border-bottom: 1px dotted #1399CF;

margin-bottom: 3px;

padding-left: 30px;

padding-top:0px;

}



#related-posts ul li:hover{

background-color: #1399CF;

border-left: 2px solid #B3CA3D;

border-bottom: 1px dotted #B3CA3D;

}

</style>

<script type='text/javascript'>

var relatedpoststitle=&quot;Related Posts&quot;;

</script>

<script src='http://mrthangming.googlecode.com/files/related%20post-MrThangMing.js' type='text/javascript'/>

<!--Remove--></b:if>

<!--Related Posts Scripts and Styles End-->

ေအာက္က Cond ကုိ ထပ္ရွာပါ။

<div class='post-footer'>

ေတြ႕ၿပီးဆုိရင္ <div class='post-footer'> ရဲ႕ေအာက္မွာ ေအာက္က Cond ကုိ ထပ္ထည့္ေပးလုိက္ပါ။

<!-- Related Posts Code Start-->

<!--Remove-->

<b:if cond='data:blog.pageType == &quot;item&quot;'>

<div id='related-posts'> <b:loop values='data:post.labels' var='label'> <b:if cond='data:label.isLast != &quot;true&quot;'> </b:if> <b:if cond='data:blog.pageType == &quot;item&quot;'> <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=6&quot;' type='text/javascript'/></b:if></b:loop>

<script type='text/javascript'> var maxresults=5; removeRelatedDuplicates(); printRelatedLabels(&quot;<data:post.url/>&quot;); </script> </div> <!--Remove--></b:if> <!-- Related Posts Code End-->

ထည့္ၿပီးရင္ Save Template ကုိနုိပ္လုိက္ပါ။

မွတ္ခ်က္။    ။ maxresults=5 မွာ မိမိေပၚေစခ်င္ တဲ့ အေရအတြက္နံပါတ္ ေျပာင္းနုိင္ပါတယ္။