Mr ThangMing: Related Posts

How To Add Thumbnail Related Posts Widget To Blogger

<div dir="ltr" style="text-align: left;" trbidi="on">
<div dir="ltr" style="text-align: left;" trbidi="on">
ဒီေန႔ထပ္တင္ေပးလုိက္တဲ့ ပုိ႔(စ္)ေလးကေတာ့ Thumbnail Related Posts Widget ေလးပါ။  <a href="http://www.blogger.com/blogger.g?blogID=7388332448929021318#editor/target=post;postID=3667000060437482372;onPublishedMenu=allposts;onClosedMenu=allposts;postNum=1;src=postname">Simple Related Posts Widget </a> လည္းတင္ေပးလုိက္ပါၿပီးဆုိေတာ့ ပုံေလးေတြနဲ႔ ေပၚေနတဲ့ ဟာလည္း ႀကဳိက္ရင္အလြယ္တကူ ယူလုိ႔ရေအာင္ ထပ္ေ၀မွ်ေပးခ်င္ပါတယ္။ သိၿပီးၾကေသာ မိတ္ေဆြေတြလည္းမ်ာေတာ့မွာပါ ၊ ဒါေပမယ့္ မသိေသးတဲ့ မိတ္ေဆြေတြအတြက္ အခက္အခဲျဖစ္နုိင္ပါတယ္။ ဒါေၾကာင့္ရွိတာထက္ ပုိတင္ေပးရျခင္ျဖစ္ပါတယ္။<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiH53v_8t-WBYxzo_Ng1OTaIf_CrOHBL9iS8C05b84BO85u5n8kjM1cuj98ibfvMP-y8MeG5JvzOAHrXguxw-qbIwY8IQIeVKSQ0JM-AACe4R8mlhdwWZVxCsS5ehgkygarHnGNrJpePAk/s1600/related+posts.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiH53v_8t-WBYxzo_Ng1OTaIf_CrOHBL9iS8C05b84BO85u5n8kjM1cuj98ibfvMP-y8MeG5JvzOAHrXguxw-qbIwY8IQIeVKSQ0JM-AACe4R8mlhdwWZVxCsS5ehgkygarHnGNrJpePAk/s1600/related+posts.png" /></a></div>
<div class="separator" style="clear: both; text-align: center;">
<span style="background-color: white; font-size: 18px; line-height: 24px; text-align: -webkit-auto;"><span style="color: purple;"><u>Modified Image</u></span></span></div>
<br /></div>
၁။<a href="http://blogger.com/" target="_blank" title="Enter Blogger">Sign In Blogger</a>
<br />
<br />
၂။ Template<br />
<br />
၃။ Edit HTMl<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHfgFBrshrABhXuNz_3i6lK4gr6ZFUSlCQlE3e21rqq8om6dJCjgGAeGuuZVIOamZFg_8qjsq3YNDZmCyr6dnZLzOXOpDiO5MyOTYdZP7Fpe-ss4Rdh-06_Zv11jCXaeoRM-bOBxBhrcE/s1600/%E1%81%86%E1%81%8B+Edit+HTML.png" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHfgFBrshrABhXuNz_3i6lK4gr6ZFUSlCQlE3e21rqq8om6dJCjgGAeGuuZVIOamZFg_8qjsq3YNDZmCyr6dnZLzOXOpDiO5MyOTYdZP7Fpe-ss4Rdh-06_Zv11jCXaeoRM-bOBxBhrcE/s1600/%E1%81%86%E1%81%8B+Edit+HTML.png" /></a>၄။ Proceed<br />
Expand Widget Templates ကုိအမွန္ျခစ္ေပးလုိက္ပါ
<br />
<br />
၅။ ေအာက္က  Cond ေလးကုိရွာပါ။Ctrl + F ကုိတြဲနုိပ္၍ရွာပါ ၊ ရွာရလြယ္ပါတယ္။<br />
<br />
<pre class="cpp" name="code"></head>
</pre>
<br />
<br />
ေတြ႕ၿပီးဆုိရင္ </head> ရဲ႕ေအာက္မွာ ေအာက္က Cond ကုိ ထပ္ထည့္ေပးလုိက္ပါ။<br />
<br />
<br />
<pre class="cpp" name="code">

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

#related-posts {

float:center;

text-transform:none;

height:100%;

min-height:100%;

padding-top:5px;

padding-left:5px;

}

#related-posts h2{

font-size: 18px;

letter-spacing: 2px;

font-weight: bold;

text-transform: none;

color: #5D5D5D;

font-family: Arial Narrow;

margin-bottom: 0.75em;

margin-top: 0em;

padding-top: 0em;

}

#related-posts a{

border-right: 1px dotted #DDDDDD;

color:#5D5D5D;

}

#related-posts a:hover{

color:black;

background-color:#EDEDEF;

}

</style>

var defaultnoimage=&quot;https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgVXJ4mBATjH4fFwlJr75aroVrZxh21hkP_QMXTvE7be-4PD-dtBMKFtxDSzJGCFCcYZnwZFSGRji_4jBoP42csvxSvU8rrco4MjZ_dLJQ6uIcazSE8Ntb5qBJY_wBQ0LBdhm4N5RsW4D5M/s1600/no_image.jpg&quot;;

var maxresults=5;

var splittercolor=&quot;#DDDDDD&quot;;

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

</script>

</b:if>

</pre>
<br />
<span style="color: red; font-size: large;">မွတ္ခ်က္။  ။</span> v<span style="color: purple;">ar maxresults=5</span> ကုိ မိမိႀကဳိက္ရာ နံပါတ္ေျပာင္းေပးနုိင္ပါတယ္။<br />
<br />
ေအာက္က Cond ကုိ ထပ္ရွာပါ။<br />
<br />
<pre class="cpp" name="code"> <div class='post-footer'>
</pre>
<br />
ေတြ႕ၿပီးဆုိရင္ <span style="color: purple;"><pre class="cpp" name="code"></span> ရဲ႕ေအာက္မွာ ေအာက္က Cond ကုိ ထပ္ထည့္ေပးလုိက္ပါ။<br />
<br />
<br />
<pre class="cpp" name="code">

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

<b:loop values='data:post.labels' var='label'>

<b:if cond='data:label.isLast != &quot;true&quot;'>

</b:if>

removeRelatedDuplicates_thumbs();

printRelatedLabels_thumbs(&quot;<data:post.url/>&quot;);

</script>

</div><div style='clear:both'/>

</b:if>

<b:if cond='data:blog.url == data:blog.homepageUrl'><b:if cond='data:post.isFirstPost'>

</b:if></b:if>

</pre>
<br />
ထည့္ၿပီးရင္ Save Template ကုိနုိပ္လုိက္ပါ။<br />
<br />
<span style="color: red; font-size: large;">မွတ္ခ်က္။  ။</span> <span style="color: purple;">max-results=5</span> ကုိ မိမိႀကဳိက္ရာ နံပါတ္ ေျပာင္းနုိင္ပါတယ္။</div>

How To Add Thumbnail Related Posts Widget To Blogger

ဒီေန႔ထပ္တင္ေပးလုိက္တဲ့ ပုိ႔(စ္)ေလးကေတာ့ Thumbnail Related Posts Widget ေလးပါ။ Simple Related Posts Widget လည္းတင္ေပးလုိက္ပါၿပီးဆုိေတာ့...

How To Add Simple Related Posts Widget To Blogger

<div dir="ltr" style="text-align: left;" trbidi="on">
ဒီပုိ႔(စ္)ေလးကေတာ့ Simple Related Posts ေလးပါ။ တင္မယ္တင္မယ္နဲ႔ အလုပ္ေတြမအားလုိ႔ မတင္ျဖစ္ပါဘူး။ ဒီေန႔မွဘဲ ခ်စ္မိတ္ေဆြေတြအတြက္ ဘာတင္ေပးရင္ေကာင္းမလဲလုိ႔စဥ္းစားၿပီး က်ေနာ္သုံးေနတဲ့ Cond ေလးကုိ ေ၀မွ်ေပးလုိက္တာပါ။ ႀကဳိက္ၾကမယ္လုိ႔လည္း ေမွ်ာ္လင့္ပါတယ္။ ေအာက္မွာ Cond နဲ႔ Demo ပုံလည္းျပေပးပါတယ္။ Demo ဆုိရင္ေတာ့ ဤဘေလာ့မွာ ၾကည့္နုိင္ပါတယ္။<br />
<br />
<div class="separator" style="clear: both; text-align: center;">
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg24HTZW3L0gNcHXhVOLWL4N6oQl8LqgR7lSCxGMZVIYfNWj8SRYeeLPEZ9GcGmuvG_Pm0Z_SWQMyeUfQNiAvMTcF7Ngu5DmcQkbM2GqMaInvbV4_suGoMqGyyH7SgFNkLIrIKFP3ZHFiY/s1600/relate+post.png" imageanchor="1" style="margin-left: 1em; margin-right: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg24HTZW3L0gNcHXhVOLWL4N6oQl8LqgR7lSCxGMZVIYfNWj8SRYeeLPEZ9GcGmuvG_Pm0Z_SWQMyeUfQNiAvMTcF7Ngu5DmcQkbM2GqMaInvbV4_suGoMqGyyH7SgFNkLIrIKFP3ZHFiY/s1600/relate+post.png" /></a></div>
<br />
၁။<a href="http://blogger.com/" target="_blank" title="Enter Blogger">Sign In Blogger</a>
<br />
<br />
၂။ Template<br />
<br />
၃။ Edit HTMl<br />
<br />
<a href="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHfgFBrshrABhXuNz_3i6lK4gr6ZFUSlCQlE3e21rqq8om6dJCjgGAeGuuZVIOamZFg_8qjsq3YNDZmCyr6dnZLzOXOpDiO5MyOTYdZP7Fpe-ss4Rdh-06_Zv11jCXaeoRM-bOBxBhrcE/s1600/%E1%81%86%E1%81%8B+Edit+HTML.png" imageanchor="1" style="clear: right; float: right; margin-bottom: 1em; margin-left: 1em;"><img border="0" src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiHfgFBrshrABhXuNz_3i6lK4gr6ZFUSlCQlE3e21rqq8om6dJCjgGAeGuuZVIOamZFg_8qjsq3YNDZmCyr6dnZLzOXOpDiO5MyOTYdZP7Fpe-ss4Rdh-06_Zv11jCXaeoRM-bOBxBhrcE/s1600/%E1%81%86%E1%81%8B+Edit+HTML.png" /></a>၄။ Proceed<br />
Expand Widget Templates ကုိအမွန္ျခစ္ေပးလုိက္ပါ
<br />
<br />
၅။ ေအာက္က  Cond ေလးကုိရွာပါ။Ctrl + F ကုိတြဲနုိပ္၍ရွာပါ ၊ ရွာရလြယ္ပါတယ္။<br />
<br />
<pre class="cpp" name="code"></head>
</pre>
<br />
ေတြၿပီးဆုိရင္ <span style="color: purple;"></head></span>  ရဲ႕ေအာက္မွာ ေအာက္က Cond ကုိ ထပ္ထည့္ေပးလုိက္ပါ။<br />
<br />
<br />
<pre class="cpp" name="code">

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

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

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

</script>

</b:if>

</pre>
<br />
<div>
ေအာက္က Cond ကုိ ထပ္ရွာပါ။

<br />
<br />
<pre class="cpp" name="code"><div class='post-footer'>
</pre>
</div>
<br />
ေတြ႕ၿပီးဆုိရင္ <span style="color: purple;"><div class='post-footer'></span> ရဲ႕ေအာက္မွာ ေအာက္က Cond ကုိ ထပ္ထည့္ေပးလုိက္ပါ။ <br />
<br />
<br />
<pre class="cpp" name="code">

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

How To Add Simple Related Posts Widget To Blogger

ဒီပုိ႔(စ္)ေလးကေတာ့ Simple Related Posts ေလးပါ။ တင္မယ္တင္မယ္နဲ႔ အလုပ္ေတြမအားလုိ႔ မတင္ျဖစ္ပါဘူး။ ဒီေန႔မွဘဲ ခ်စ္မိတ္ေဆြေတြအတြက္ ဘာတင္ေပးရင္ေကာ...

Mr ThangMing

How To Add Thumbnail Related Posts Widget To Blogger

How To Add Simple Related Posts Widget To Blogger

Activity Find

Labels

Archives