ရိုးရိုးရွင္းရွင္း Related Post ေလးထည့္နည္း

ကဲသည္တစ္ခါေတာ့  ထူးဆန္းလွပတဲ့ Related Post ဆိုတာေလးထည့္နည္းကို မွ်ေ၀သြားပါ့မယ္..
ဒါေလးက ဘေလာ့ေတြမွာ ထားသင့္တဲ့ နည္းလမ္းေလးပါ  ဘာေၾကာင့္ဆိုေတာ့ သူက ကိုယ္တင္ထားတဲ့ ပို႕စ္ေလးေတြကို လင့္ေလးေတြနဲ႕ ေခါင္းစဥ္ေလးသာ ေဖၚျပေပးထားျပီး လိုျခင္တဲ့ေနရာကို ပလြယ္တကူ ကလစ္ကာ ၀င္ေရာက္နိဳင္တဲ့ နည္းေလးေပါ့... ပုံမွာ ျပထားသလိုေပါ့ေနာ္.. စမ္းသတ္လိုက္ၾကပါ...နည္းလမ္းနဲ႕ ကုဒ္ေတြကို ေပးထားပါတယ္..

ထည့္နည္းေလးကို ေသျခာ ၾကည့္ လုပ္လုိက္ပါ အဆင္ေျပပါတယ္...

အဆင့္  (၁) ..... အေနနဲ႕...ေအာက္ကတိုင္းသြားလိုက္ပါ။
►1-  Blogger Singin ၀င္လိုက္ပါ။
►2-  DASHBOARD ကိုသြားလိုက္ပါ။
►3-  LAYOUT    ကိုကလစ္ပါ..။
►4-  EDIT HTML  ကို၀င္ပါ.. Process ကိုကလစ္ျပီးဆက္၀င္လုိက္ပါ။
►5-  Ctrl+F အကူညီျဖင့္ ေပးထားတဲ့ ကုဒ္ကို ရွာလိုက္ပါ။
            <div class='post-footer'>  ကုဒ္ကိုရွာပါ ေတြ႕တာနဲ႕ သူ႕ေအာက္ကပ္လွ်က္ ေပးထားေသာ ဇယားထဲကကုဒ္ေတြ ထည့္ေပးလိုက္ပါ...

<!-- 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-->

အဆင့္   (၂)   .... အေနနဲ႕ အေပၚကရွာနည္းတိုင္း မိမိတို႕ Html မွာဘဲ ေအာက္ကကုဒ္ကိုရွာပါ
                      </head>  ကိုရွာလုိ္ကပါ ေတြ႕တာနဲ႕ သူ႕ေအာက္ကပ္လွ်က္  ဇယားထဲကကုဒ္ေတြကို ထည့္ေပးလို္က္ပါ။

<!--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-->

 အဆင့္  (၃)... အေနနဲ႕  maxresults=5 သည္ကုဒ္ေလး အေပၚဇယားမွာပါ ပါတယ္.. သဴ႕ကို မိမိတို႕ ေဘလာ့မွာ ေပၚေစျခင္သေလာက္ နံပါတ္ေျပာင္းေပးနိဳင္ပါတယ္... ျပီးတာနဲ႕  save template လုပ္နိဳင္ပါျပီဗ်ာ.... ဘေလာ့ိကု ၾကည့္လိုက္ပါ.. ပို႕စ္တုိင္းရဲ႕ ေအာက္မွာ ေပးေနပါျပီ။

ေအာင္ေအာင္(မကစ) ရဲ႕ ဘေလာ့ခရီးသည္ေလးအား အားေပးေနၾကတဲ့အတြက္ ေက်းဇဴးအထူးတင္ပါတယ္.. တုန္႕ျပန္မွဳအေနနဲ႕ fb like ေလးေတာ့ လုပ္ေပးခဲ့ၾကပါေနာ္.. တတ္စြမ္းသမွ် ေတြ႕ ရွိသမွ်ေလးေတြကို ျပန္လည္ မွ်ေ၀ေနပါ့မယ္...။ အဆင္မေျပတာမ်ားရွိခဲ့ပါက...cbox မွာ ေျပာခဲ့ၾကပါေနာ္..

 ေအာင္ေအာင္(မကစ) ပိုင္ဆိုင္ေသာ ေနရာေလးမ်ားကိုလာလည္ၾကပါ။

Posted in: Blogs Html, Blogs Post