Tanpa berpikir panjang saya pun langsung mempraktekan tutorial dari blog tersebut ke blog saya sebagai bahan percobaannya. Alhasil tampilan yang dijanjikan pada blog itupun terwujud, tanpa berpikir panjang saya langsung menulis ulang tutorial tersebut sebagai pengisi blogku ini.
Berikut inilah tutorial tersebut
Pertama: anda login ke blogger dengan akun anda, kemudian anda pilih pengaturan -> email / seluler, pada tab template anda pilih template tersesuai
Kedua: anda menuju ke rancangan -> edit HTML, kemudian centang pada kotak “Expand Template Widget”.(Sebelum anda melangkah ke langkah berikutnya, saya sarankan anda untuk membackup template blog anda)
Ketiga: setelah itu anda cari kode <head> “untuk mempermudah gunakan kombinasi tombol ctrl + F”. Kemudian anda taruh kode dibawah ini tepat diatas kode <head> tersebut
<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>
Keempat: cari kode <div class='post-footer-line post-footer-line-2'> ( yang terletak diantara kode able id='mobile-post' var='post'> dan </b:includable> ). Kemudian anda taruh kode dibawah ini, tepat dibawah kode <div class='post-footer-line post-footer-line-2'> yang telah anda temukan.
<b:if cond='data:blog.pageType == "item"'>
<div id='mobile-related-posts'>
<div style='text-align: justify;'>
<h4><b>Artikel Terkait: </b></h4>
<b:loop values='data:post.labels' var='label'><data:label.name/><b:if cond='data:label.isLast != "true"'>,</b:if><b:if cond='data:blog.pageType == "item"'><script expr:src='"/feeds/posts/default/-/" + data:label.name + "?alt=json-in-script&callback=related_results_labels&max-results=10"' type='text/javascript'/></b:if></b:loop>
<script type='text/javascript'> removeRelatedDuplicates(); printRelatedLabels();</script>
</div>
</div>
</b:if>
Kelima: simpan template dan untuk melihat hasilnya anda perlu menambahkan ?m=1 pada akhir url blog anda sehingga menjadi www.bloganda.blogspot.com?m=1. Atau anda bisa melihat di sini
sumber eltelu.blogspot.com
WAW...KEREN GAN, ANE COBA DULU,
BalasHapusVISIT BACK HTTP://RAHMATDI99.BLOGSPOT.COM
oke mas, siap meluncur
Hapusartikel terkait dibawah posting akan muncul secara otomatis, sesuai label yang anda masukkan ketika membuat artikel
BalasHapusKalau dgn gambar gmna?
BalasHapus