1News Online:
Home » » Tutorial Blog - Cara pasang widget Related Posts di blogspot

Tutorial Blog - Cara pasang widget Related Posts di blogspot

Wednesday, October 31, 2012 | 3:01 AM


Widget Related post atau entri berkaitan seperti yang boleh anda lihat pada setiap post di blog ini, adalah widget yang menyenaraikan entri atau artikel yang berkaitan mengikut kategori atau label entri atau artikel tersebut.
Untuk memasang widget Related post atau entri berkaitan, anda hanya perlu ikut beberapa langkah yang mudah di bawah.

p/s: Sila save script template sebagai backup.

Langkah 1

Log in blog => Dashboard => Layout => Edit HTML. Seterusnya tick pada kotak Expand Widget Templates.

Langkah 2

Dengan menggunakan keyboard, tekan kekunci Ctrl + F. Seterusnya, taip atau paste kod </head>pada ruang Find dan tekan kekunci Enter.

Langkah 3

Salin kod berwarna biru di bawah dan paste di atas atau sebelum kod </head> (rujuk langkah 2)

p/s: Anda boleh menukar teks Entri berkaitan yang di bold kepada teks pilihan anda.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
<style>
#related-posts {
float:center;
text-transform:none;
height:100%;
min-height:100%;
padding-top:5px;
padding-left:5px;
}
#related-posts .widget{
padding-left:6px;
margin-bottom:10px;

}
#related-posts .widget h2, #related-posts h2{
font-size: 1.6em;
font-weight: bold;
color: black;
font-family: Georgia, &#8220;Times New Roman&#8221;, Times, serif;
margin-bottom: 0.75em;
margin-top: 0em;
padding-top: 0em;
}
#related-posts a{
color:blue;
}
#related-posts a:hover{
color:blue;
}
#related-posts ul{
list-style-type:none;
margin:0 0 0px 0;
padding:0px;
text-decoration:bold;
font-size:15px;
text-color:#000000
}
#related-posts ul li{
background:transparent url(http://2.bp.blogspot.com/_u4gySN2ZgqE/SnZhv_C6bTI/AAAAAAAAAl4/Rozt7UhvgOo/s200/greentickbullet.png) no-repeat ;
display:block;
list-style-type:none;
margin-bottom: 13px;
padding-left: 30px;
padding-top:0px;}
</style>
<script type='text/javascript'>
var relatedpoststitle="Entri berkaitan";
</script>
<script src='http://blogergadgets.googlecode.com/files/related.js' type='text/javascript'/>
</b:if>

Langkah 4

Dengan menggunakan keyboard, tekan Ctrl+F. Kemudian, taip atau paste kod <data:post.body/> . Seterusnya tekan Enter.

Langkah 5

Salin kod berwarna merah di bawah dan paste di bawah atau selepas kod <data:post.body/> . (rujuk langkah 4)

<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=15&quot;' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'>
var currentposturl=&quot;<data:post.url/>&quot;;
var maxresults=5;
removeRelatedDuplicates(); printRelatedLabels();
</script>
</div>
</b:if>

Akhir sekali klik Preview dan jika tiada mesej Error yang terpapar, klik saja Save

Kongsi artikel ini : :

Post a Comment

 
Copyright © 2012. 1News Online - All Rights Reserved
Proudly powered by Blogger