Artikel Terkait atau Related Post adalah posting atau artikel yang berhubungan dengan artikel lainnya, berdasarkan atas kesamaan nama kategori atau label postingan. Tetapi artikel tersebut tidak selalu sama topiknya, bisa juga membahas tentang hal lain, tetapi masih mempunyai relevansi dengan tujuan artikel tersebut.
Kali ini Chenk Rahman [CR] akan membahas tentang Cara Membuat Artikel Terkait atau Related Post with Scroll, yaitu related post yang ditampilkan dalam bentuk menu scroll. Untuk lebih jelasnya, silahkan ikuti langkah-langkah berikut ini :
1. Login ke akun Blogger anda.
2. Klik Rancangan, kemudian pilih Edit HTML.
3. Centang Expand Template Widget (saya anjurkan download dahulu template anda).
4. Cari kode seperti ini: <data:post.body/>
* Jika sobat sudah memasang script Read More, maka akan terdapat 2 kode <data:post.body/>. Maka kita pasang script Artikel Terkait atau Related Post di bawah <data:post.body/> yang ke 2 (lebih tepatnya di bawah tag </b:if>). Kalau tidak ketemu juga coba cari-cari dibawah <DIV class='post-body entry-content'> .
5. Jika sudah ketemu, maka copy paste-kan kode di bawah ini persis berada dibawahnya (script yg berwarna merah diatas) :
script.setAttribute('type', 'text/javascript');
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 = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
<script type="text/javascript">RelPost();</script>
</div>
</b:if>
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 = "<data:label.name/>";
var test = 0;
for (var i = 0; i < labelArray.length; i++)
if (labelArray[i] == textLabel) test = 1;
if (test == 0) {
labelArray.push(textLabel);
var maxLabels = (labelArray.length <= maxNumberOfLabels) ?
labelArray.length : maxNumberOfLabels;
if (numLabel < maxLabels) {
search10(homeUrl3, textLabel);
numLabel++;
}
}
</b:loop>
</b:loop>
</script>
</div>
<script type="text/javascript">RelPost();</script>
</div>
</b:if>
6. Cari kode ini : ]]></b:skin>
7. Copy kode di bawah ini dan paste diatasnya.
.rbbox{border: 1px solid rgb(192, 192, 192);padding: 5px;
background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: rgb(255, 255, 255);}
background-color: #f0f0f0;-moz-border-radius:5px; margin:5px;}
.rbbox:hover{background-color: rgb(255, 255, 255);}
8. Klik Simpan Template.
=============== Selamat Mencoba ===============