Dede Rosadi Blog

Jasa Pembuatan Toko Online Seo Dan Review Produk Online

Tutorial Menciptakan Related Posts Di Sidebar Blog

No ratings yet.

Fitur atau gadget related posts atau artikel terkait pada sebuah related posts dengan fungsi scroll, related posts yang simple, atau related posts dengan widget yang sanggup diletakkan di sidebar blog.

Apa sih related posts?

Seperti namanya, related posts atau related articles berarti yaitu daftar posting atau artikel yang masih berkaitan dengan artikel yang sedang dibaca oleh pengunjung.

sama ibarat menciptakan breadcrumbs navigation, related posts atau related articles sanggup megampangkan pengunjung untuk mencari isu yang dibutuhkan, selain itu fitur yang juga disebut sebagai artikel terkait ini juga sanggup menciptakan pengunjung betah berlama-lama untuk membaca postingan sobat. Dan yang ludang keringh penting lagi, terkadang artikel terkait ini terekam lho oleh mbah google hehehe…

Tutorial menciptakan related posts di sidebar

Langkah2 untuk membuat related posts atau artikel terkait pada widget sidebar:

  • Seperti biasa login pada blogger atau blogspot
  • Pada halaman dashboard klik Design atau Rancangan
  • Pilih Edit HTML dan centang Expand Template Widget (biasakan backup template dulu)
  • Copy instruksi di bawah ini dan letakkan sehabis tag </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 instruksi diberikut ini (Ctrl + F) semoga cepat:

    <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 != &quot;true&quot;'>,</b:if>
    </b:loop>
    </b:if>

    Kalau sudah ketemu, ganti dengan instruksi diberikut 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 != &quot;true&quot;'>,</b:if>
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <script expr:src='&quot;/feeds/posts/default/-/&quot; + data:label.name + &quot;?alt=json-in-script&amp;callback=related_results_labels&amp;max-results=10&quot;' type='text/javascript'/>
    </b:if>
    </b:loop>
    </b:if>

  • Save template. Yang berwarna merah itu yaitu maximal related posts yang ditampilkan, sanggup teman ganti sesuka hati
  • Kalau sudah, kini tinggal nambahin widget atau gadget HTML ajah. Klik page elements dan add a new HTML/Javascript widget pada posisi yang teman suka. Beri judul Related Posts / Articles pada Tiltle . kemudian copy paste script di bawah ini pada kotak yg disediakan:

    <script type="text/javascript">
    removeRelatedDuplicates();
    printRelatedLabels();
    </script>

Selesai deh Tutorial menciptakan related posts atau terkait pada sidebar 😀 Selamat mencoba dan semoga visitor selalu betah di blog sobat..

Please rate this

Updated: 7 Januari 2019 — 10:53

Tinggalkan Balasan

Alamat email Anda tidak akan dipublikasikan. Ruas yang wajib ditandai *

Sikartun Blog © 2018 Frontier Theme