Langsung ke konten utama

Cara Memasang Related Post pada Blog

Artikel yang berkaitan atau related post merupakan sebuah cara untuk menampilkan link-link artikel yang berkaitan dengan artikel utama yang diposting.

Pemasangan fiture ini biasanya dikelompokkan berdasarkan label atau kategori. Jadi jika ada salah satu artikel dari label tertentu ditampilkan maka artikel-artikel lain yang mempunyai label sama juga akan ikut muncul dibawah artikel tersebut.

Tujuan pemasangan artikel yang berkaitan ini agar pengunjung mudah untuk membaca artikel yang berkaitan dengan artikel utama. Sehingga pengunjung tidak perlu repot lagi untuk mencari satu persatu artikel dalam menu label atau kategori.

Cara Memasang Related Post pada Blog 

Cara Memasang Related Post:

1. Pada dashboard Blogger. Pilih menu Template -> Edit HTML

2. Klik pada kotak Edit HTML dan cari (CTRL+F) kode:
<data:post.body/>
    Pilih kode yang ke-2 atau yang paling Akhir (biasa terjadi bila Anda pernah meng-edit HTML template)

3. Jika sudah ketemu, letakkan kode berikut ini dibawah <data:post.body/>
<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>
<div class='widget-content'>
<h3>Baca juga artikel yang lain :</h3>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>
var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;
maxNumberOfPostsPerLabel = 10;
maxNumberOfLabels = 3;

function listEntries10(json) {
var ul = document.createElement(&#39;ul&#39;);
var maxPosts = (json.feed.entry.length &lt;= maxNumberOfPostsPerLabel) ?
json.feed.entry.length : maxNumberOfPostsPerLabel;
for (var i = 0; i &lt; maxPosts; i++) {
var entry = json.feed.entry[i];
var alturl;
for (var k = 0; k &lt; entry.link.length; k++) {
if (entry.link[k].rel == &#39;alternate&#39;) {
alturl = entry.link[k].href;
break;
}
}
var li = document.createElement(&#39;li&#39;);
var a = document.createElement(&#39;a&#39;);
a.href = alturl;
if(a.href!=location.href) {
var txt = document.createTextNode(entry.title.$t);
a.appendChild(txt);
li.appendChild(a);
ul.appendChild(li);
}
}
for (var l = 0; l &lt; json.feed.link.length; l++) {
if (json.feed.link[l].rel == &#39;alternate&#39;) {
var raw = json.feed.link[l].href;
var label = raw.substr(homeUrl3.length+13);
var k;
for (k=0; k&lt;20; k++) label = label.replace(&quot;%20&quot;, &quot; &quot;);
var txt = document.createTextNode(label);
var h = document.createElement(&#39;b&#39;);
h.appendChild(txt);
var div1 = document.createElement(&#39;div&#39;);
div1.appendChild(h);
div1.appendChild(ul);
document.getElementById(&#39;data2007&#39;).appendChild(div1);
}
}
}
function search10(query, label) {
var script = document.createElement(&#39;script&#39;);
script.setAttribute(&#39;src&#39;, query + &#39;feeds/posts/default/-/&#39;
+ label +
&#39;?alt=json-in-script&amp;callback=listEntries10&#39;);
script.setAttribute(&#39;type&#39;, &#39;text/javascript&#39;);
document.documentElement.firstChild.appendChild(script);
}
var labelArray = new Array();
var numLabel = 0;
<b:loop values='data:posts' var='post'>
<b:loop values='data:post.labels' var='label'>
textLabel = &quot;<data:label.name/>&quot;;
var test = 0;
for (var i = 0; i &lt; labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length &lt;= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel &lt; maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
</div>
</b:if>
Catatan : 
*Baca juga artikel yang lain : dapat Anda ganti sesuai keinginan Anda
*10: Jumlah posting yang akan tampil

Selamat mencoba.

Komentar

Postingan populer dari blog ini

Mod Immortal Treasure Trove Carafe 2018

Mod immortal Treasure Trove Carafe 2018. This treasure contain of : Huskar - The Spoils of Dezun, Ogre Magi - Gimlek Decanter, Pangolier - Mask of Confidant, Venomancer - Cult of Aktok, Rubick - Crux of Perplex, Disruptor - Orb of Deliverance, Silencer - Glaive of Oscilla, Storm Spirit - Mandate of the Stormborn, Windranger - Sylvan Vedette and Mirana mount - Axia of Metira. Hope you guys like this mods cosmetic skin and support our favorite game Dota 2 in steam community market. No money? Just mods! Enjoy the game and boost your Matchmaking Ratings MMR and Seasonal Rankings Medals !

Cara Menambah Tulisan diatas Kotak Komentar Blog

Menambahkan tulisan atau text diatas kotak atau kolom komentar blogger adalah salah satu cara dimana owner blog dapat memberikan pesan kepada pengunjung blog tersebut. Biasanya pesan yang dicantumkan seperti aturan berkomentar (sopan, tidak mengandung kata-kata sara, p*rn*grapi, dll) ataupun ajakan berkomentar pada blog tersebut. Selain itu sobat juga dapat mengganti tulisan " poskan komentar " dengan text ataupun gambar sesuka sobat. Sobat dapat membaca nanti di Mengganti Tulisan Poskan Komentar di Blog . Pada posting kali ini saya membahas 2 cara, Cara 1 merupakan bawaan dari blogger yang mudah digunakan. Cara 2 dengan mengedit HTML template blog, Kelebihan untuk cara 2 ini adalah kita dapat mengedit tulisannya dengan membuat background, tulisan miring, bold dan lainnya cukup dengan menambahkan kode HTML. Cara 1: Langkah 1. Pada Dashboard blogger sobat scroll kebawah --> Setelan --> Pos dan Komentar . Pada Pesan Formulir Komentar klik Tambahkan. Langkah 2. Form un...

Cara Membuat Tombol Kembali ke Atas di Blog

Membuat tombol kembali keatas (back to top) pada blog dengan menggunakan kode HTML, Javascript, CSS atapun jQuery. Fungsi dari tombol ini adalah apabila pengunjung blog scroll kebawah maka akan muncul tombol back to top yang memudahkan pengunjung untuk kembali pada posisi atas dari posting blog tanpa susah menggunakan mouse untuk keatas. Memasang Tombol Kembali ke Atas Pada dashboard blog, pilih Template --> Edit HTML --> Klik pada area kosong kotak Edit HTML dan Cari (CTRL+F) kode berikut: </head> Selanjutnya ikuti langkah dibawah ini. Silahkan anda pilih salah satu efek dari tombol ke atas berikut: 1. Membuat Tombol Kembali ke Atas dengan Efek Halus Langkah 1. Letakkan kode berikut diatas  </head> <script type='text/javascript' src='http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js'/> <script type='text/javascript'> $(function() { $(window).scroll(function() {if($(this).scrollTop()&gt;500) { $(&#39;#Scrol...