Related Post di Sidebar Blogspot

Related Post atau yang sering kita kenal dengan "artikel yang berhubungan / Artikel yang berkaitan" banyak kita jumpai di blog- blog bahkan bisa dikatakan wajib ada di blog- blog atau website. Dengan adanya Related Post ini, maka pembaca dengan mudah bisa menemukan Topik- topik lain yang sama dengan suatu post. 
Related Post atau "Artikel yang berkaitan" ini sering kita jumpai di blog- blog kawan yang letaknya do bawah artikel- artikel blog mereka. Ada juga yang memasang Related Post di bagian Sidebar suatu blog, misalnya Blog O-om, blog Mas doyok, Dan blog saya sendiri . Kali ini kita akan membahas cara memasang Related Post di Sidebar Blogspot. Tenang dan tetap semangat, cara- caranya tidak begitu sulit dan pastinya mudah teman- teman pahami.
  • Login ke akun blogger kawan
  • Pada Dashboard, pilih Tata Letak - Edit HTML
  • Jangan lupa sebelumnya Back Up dahulu template kawan, mengantisipasi terjadinya kesalahan dengan mengklik Download Template Lengkap
  • Centang kotak kecil Expand Template Widget
  • Letakkan kode- kode di bawah ini di atas kode </head>

    <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>
  • Cari kode ini:

    <b:if cond='data:post.labels'>
    <data:postLabelsLabel/>
    <b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a><b:if cond='data:label.isLast != "true"'>,</b:if>
    </b:loop>
    </b:if>
    Jika telah ketemu, ganti semua kode di atas dengan kode di bawah ini:

    <b:if cond='data:post.labels'>
    <data:postLabelsLabel/>
    <b:loop values='data:post.labels' var='label'>
    <a expr:href='data:label.url' rel='tag'><data:label.name/></a><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&amp;callback=related_results_labels&amp;max-results=10"' type='text/javascript'/>
    </b:if>
    </b:loop>
    </b:if>
  • Klik Simpan Template
  • Pada Halaman Tata Letak - Elemen Halaman, buat gadget baru > Add Gadget - HTML/Javascript , beri judul "Artikel Terkait"  dan isi kode di bawah ini di dalamnya: (atur sendiri Letak Gadget dengan mendrag dan simpan)

    <script type="text/javascript">
    removeRelatedDuplicates();
    printRelatedLabels();
    </script>
  • Agar related post ini tidak muncul di halaman utama dan label, anda perlu sedikit memodifikasi widget ini.

    Masuk kembali ke edit HTML. Centang expand widget template, dan temukan kode ini :


    <b:widget id='HTML4' locked='false' title='Artikel Terkait' type='HTML'>
    <b:includable id='main'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>
    </b:if>
    <div class='widget-content'>
    <data:content/>
    </div>

    <b:include name='quickedit'/>
    </b:includable>
    </b:widget>
    Ganti semua kode di atas dengan kode:

    <b:widget id='HTML4' locked='false' title='Artikel Terkait' type='HTML'>
    <b:includable id='main'>
    <b:if cond='data:blog.pageType == "item"'>
    <!-- only display title if it's non-empty -->
    <b:if cond='data:title != ""'>
    <h2 class='title'><data:title/></h2>
    </b:if>
    <div class='widget-content'>
    <data:content/>
    </div>

    <b:include name='quickedit'/>
    </b:if>
    </b:includable>
    </b:widget>
  • Klik Simpan Template

Silahkan lihat hasilnya. Selamat mencoba!!!.
NB: untuk mengatur banyaknya Related post yang muncul bisa mengganti angka / bilangan pada> max-results=10.

Bookmark and Share

Posted by: Mas Eko
Download info - Tips trik - update - sharing, Updated at: 08:33

32 - komentar:

Riky Rizkiyana said...

mantap mas, nnti saya cba deh.

Eko Priyanto said...

thanks infonya bisa di coba nih :)

fadiL the whyzein said...

blognya mantap, tutorialnya jg mantap...
nice post.. :)

Didik M.A said...

makasih sobat...

duniaedukasi.net said...

keren abis boz... ilmu baru bagi newbie

Ҝarlz said...

Boleh juga nich.. d save dulu ^_^

dah lama kok ga OL

ietaku said...

mantapzzzz banget tutorialnya

Hosting murah indonesia indositehost.com

Didik M.A said...

makasih teman..
aku juga baru belajar kok...

FREE MUSIC DOWNLOAD said...

Makasih kawand...
Aku coba dulu....

download gratis said...

tak coba ya mas...

Anonymous said...

coba kalo artikel terkaitnya ada gambarnya, nambah seru tuh,..

thanks ya mas,...

M. HARIYANTO said...

Alhamdulillah

berhasil
berhasil
berhasil

Terima Kasih, terus berkarya

afada said...

terimakasih ych atas tutorial nya, saya dah ikutin petunjuknya, tapi kok di blog saya artikel terkait yang saya inginkan belum tampi juga ych ?????
knp ych?????

liverpudlianesia said...

mantap

willy said...

SEO trick lihat yang ini juga

berbisnis di rumah said...

thanks infonya ya, ini sangat bermanfaat karena saya belum memiliki related post di blog, thanks atas sharenya....

Brigata Curva Sud said...

Thanks for providing such a great article, it was excellent and very informative.
as a first time visitor to your blog I am very impressed.
I found a lot of informative stuff in your article. Keep it up. Thank you.

Surga Kenari said...

thx

reduce lower body fat said...

Lansung di praktekan reduce lower body fat

Unknown said...

Info yang baguz sekali untuk disimak.....
Bermanfaat sekali untuk saya....

Mohon kunjungan baliknya yaa....
Dan saya juga sangat berterima kasih sekali kalau anda berkenan FOLLOW dan Backlink Blog sederhana saya.... :-)

Title: Zamrud News
( www.zamrudnews.com )

Nomor telephone toko bunga gombong said...

Apakah bisa ditaruh dibawah posting langsung

Digital Areas said...

Kalo ngatur jumlah post yang tampl gimana sob ?

Megacara said...

keren bro widget seperti ini

true woman indonesia said...

bingung kalo sama tampilan blogger ygg sekarang ... :3

obat tradisional penyakit kencing nanah said...

makasih banyak tentang infonya sob, dan salam bloggers...

resep kuliner said...

postingaany bagus dan bermanfaat juga lagi buat semuannya, saya jadi tetarik deh

flash card untuk bayi said...

terima kasih atas informasinya, semoga bermanfaat

Pengobatan Sipilis said...

Ramuan Obat Raja Singa ? Segera Hubungi Kami Dan Pesan Obatnya Sekarang Juga di Fast Respond : 087705015423 PIN : 207C6F18.

Medical Value Travel India said...

its very cute. thanks too share.....

Tips and Tricks blog said...

I love that idea. Awesome Post..

Dr. Arunachalam C T said...

That was a VERY interesting one! Seriously interesting.

Dr. Manish Bharti said...

That was a VERY interesting one! Seriously interesting.

Post a Comment

Tiada gading yang tak retak, baka banyak pula hal yang salah dari aku. maka, tinggalkan walau hanya secoret komentar sebagai lankah ke depanku untuk lebih maju

NO SPAM NO PORN!