Cara Memasang Related Post di Blog

Tingkatkan potensi page view dengan widget artikel terkait.

Ilustrasi widget artikel terkait di Blogger. (Jurnal Naim)

Related Post merupakan sebuah widget berisikan beberapa postingan terkait dalam satu label dari artikel yang sedang kita buka. Pada era sekitar satu dekade lalu, widget ini sangat populer dan kerap diletakkan pada bagian bawah artikel. Sedangkan di masa modern ini, ada juga yang diselipkan di tengah artikel dengan script khusus.

Perannya sangat krusial, khususnya dalam hal meningkatkan page view blog Anda. Sebab pengunjung blog akan melihat artikel lain dan berpotensi untuk membacanya juga, apalagi jika kualitas artikel Anda ciamik.

Pada kesempatan kali ini, akan dijelaskan bagaimana cara memasang widget related post yang diletakkan di bawah artikel.

Memasang Related Post

Catatan: Artikel ini diterbitkan kali pertama pada tahun 2010 lalu dan mungkin kode yang ada sudah kurang up-to-date.

Pertama, masuklah ke halaman Theme dan kemudian ada baiknya melakukan Backup template terlebih dulu untuk antisipasi apabila terjadi error atau masalah. Namun ini hanyalah opsi, dan Anda bisa langsung menuju bagian Edit HTML jika tidak ingin melakukan Backup.

Opsi Backup pada halaman Theme. (Jurnal Naim)

Carilah kode dibawah ini. Anda bisa menggunakan bantuan Ctrl + F agar lebih cepat.

<data:post.body/>

Setelah mendapatkannya, paste kode dibawah ini diatas kode tersebut.

Catatan: Jika Anda menggunakan Read More, maka akan ada dua kode seperti diatas yang Anda temukan. Letakkan kode ini dibawah kode <data:post.body> yang pertama.

<b:if cond='data:blog.pageType == &quot;item&quot;'>
   <H2>Related Post:</H2>
   <div class='rbbox'>
   <div style='margin:0; padding:10px;height:200px;overflow:auto;border:1px solid #ccc;'>
      <div id='albri'/>
         <script type='text/javascript'>
            var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
            var maxNumberOfPostsPerLabel = 4;
            var maxNumberOfLabels = 10;
            maxNumberOfPostsPerLabel = 50;
            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;albri&#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>
      <script type='text/javascript'>RelPost();</script>
   </div>
</b:if>

Pada tulisan Related Post dalam kode diatas, Anda bisa mengubahnya sesuai dengan keinginan. Misalnya Artikel Terkait, Mungkin Anda Suka, atau kalimat lainnya.

Setelah itu, klik Simpan. Untuk melihat perubahannya, silahkan melihat salah satu postingan Anda yang memiliki label tertentu. Jika postingan Anda dalam label tersebut hanya satu, maka biasanya artikel terkait tidak muncul.

Semoga bermanfaat.

4 komentar

  1. Wah salut aQ sob, waktu seumuran kamu aQ masih belum bisa apa - apa sob, masih sd atau sudah smp-kah???, Btw, niy aQ dah follow twittermu silahkan dicek, TOS dulu sob... (tos)...

    Hehehehe..........
  2. masih smp mas ... ahahahaaaaa
  3. related posts emang penting buat nambah PV.... :)

    allshare zone
  4. Trimakasih infonya..
Sampaikan pendapat, pertanyaan, atau kritik anda!