Wednesday, August 10, 2016

Cara Buat "Related Post" di Blogspot

Related posts atau artikel terkait adalah suatu artikel yang menunjukkan kaitan dengan postingan artikel terdahulu, sehingga akan memudahkan pengunjung blog untuk mengetahui artikel yang lain yang ada di blog tersebut.

Related posts banyak macannya, ada yang berupa gambar atau hanya tulisan saja. Modelnya pun macam-macam, ada yang memanjang kebawah dan ada pula berbaris ke samping. Pada kesempatan ini admin akan menshare cara membuat related post dengan model memanjang kebawah.

Cara Membuat Related Posts :

  • Masuk ke akun Blogspot anda, kemudian pilih "Template".
  • Klik "Edit HTML"
  • Setelah terbuka cari kode </head> setelah ketemu copy paste script ini tepat dibawahnya.

<script type="text/javascript">
//<![CDATA[
var relatedTitles = new Array();
var relatedTitlesNum = 0;
var relatedUrls = new Array();
function related_results_labels(json) {
for (var i = 0; i < json.feed.entry.length; i++) {
var entry = json.feed.entry[i];
relatedTitles[relatedTitlesNum] = entry.title.$t;
for (var k = 0; k < entry.link.length; k++) {
if (entry.link[k].rel == 'alternate') {
relatedUrls[relatedTitlesNum] = entry.link[k].href;
relatedTitlesNum++;
break;}}}}
function removeRelatedDuplicates() {
var tmp = new Array(0);
var tmp2 = new Array(0);
for(var i = 0; i < relatedUrls.length; i++) {
if(!contains(tmp, relatedUrls[i])) {
tmp.length += 1;
tmp[tmp.length - 1] = relatedUrls[i];
tmp2.length += 1;
tmp2[tmp2.length - 1] = relatedTitles[i];}}
relatedTitles = tmp2;
relatedUrls = tmp;}
function contains(a, e) {
for(var j = 0; j < a.length; j++) if (a[j]==e) return true;
return false;}
function printRelatedLabels() {
var r = Math.floor((relatedTitles.length - 1) * Math.random());
var i = 0;
document.write('<ul>');
while (i < relatedTitles.length && i < 20) {
document.write('<li><a href="' + relatedUrls[r] + '">' +  
relatedTitles[r] + '</a></li>');
if (r < relatedTitles.length - 1) {
r++;
} else {
r = 0;}
i++;}
document.write('</ul>');}
//]]>
</script>


  • Setelah di copy paste ini contohnya.


  • Setelah selesai cari kode "<data:post.body/>" ,kemudian copy paste kan kembali script di bawah ini tepat di kode "<data:post.body/>" 
<b:if cond='data:post.labels'>  


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

<b:if cond='data:blog.pageType == "item"'>  
<h4>Artikel Terkait</h4>  
<script type="text/javascript">  
removeRelatedDuplicates();  
printRelatedLabels();  
</script>  
</b:if>

  • Contohnya hasilnya seperti ini

  • Selesai, maka nanti hasilnya akan seperti ini
Cukup mudah bukan, Demikian semoga berguna dan terimakasih.