Skip to main content

Cara Membuat Related Post

Saat kita sudah banyak menulis tentang sebuah artikel dalam blog kita, biasanya kita juga ingin mempromosikan kembali artikel yang sudah lama kita buat tersebut agar mendapat kesempatan untuk dibaca oleh pengunjung. Bagaimana caranya melakukan hal itu?

 

Mudah, kita cukup menggunakan fasilitas related post untuk menampilkan artikel lama kita. Selain bersifat mempromosikan, hal ini juga akan memberikan akses lebih mudah kepada pembaca yang ingin mengetahui informasi yang berhubungan dengan informasi yang sedang dia baca dengan informasi lainnya lewat tampilan artikel yang berkaitan yang telah kita sajikan. So, menempatkan fitur artikel yang berkaitan di blog kita ini cukup memberikan manfaat bukan? Karena itu, yuk mari kita bahas bersama bagaimana cara membuat related post atau artikel yang berhubungan ini.

Pertama, tentu saja kita harus log ini dulu ke akun blogger kita.
Klik fitur rancangan.
Klik edit HTML.
Klik atau contreng expand template widget.
Masukan kode HTML di bawah ini tepat di bawah kode <data:post.body/>.

<b:if cond='data:blog.pageType == "item"'>
<div class='similiar'>

<div class='widget-content'>
<h3>Related Post</h3>
<div id='data2007'/><br/><br/>
<script type='text/javascript'>

var homeUrl3 = &quot;<data:blog.homepageUrl/>&quot;;
var maxNumberOfPostsPerLabel = 4;
var maxNumberOfLabels = 10;

maxNumberOfPostsPerLabel = 100;
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;data2007&#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>

</div>
</b:if>

Klik simpan template. Sekarang artikel berkaitan di blog kita sudah jadi!

Keterangan :
  • Gunakan tombol Ctrl + F pada keyboard untuk mempermudah pencarian kode HTML yang diinginkan.
  • Sebelum melakukan edit HTML, harap download template kita sebelumnya sebagai backup untuk berjaga-jaga jika terjadi kegagalan saat proses edit terjadi.
  • Ganti tulisan related post dengan kalimat yang kita sukai.
  • Ganti angka var maxNumberOfPostsPerLabel = 4; untuk mengubah jumlah artikel berkaitan yang ingin ditampilkan.

Bagaimana? Cukup mudah bukan? Yuk dipraktikan!
Kalau ada yang ingin ditanyakan silakan komen di kotak komentar di bawah ini ya kawan..
Salam blogger!

Comments

Popular posts from this blog

Sherlock Holmes

Penampilan terbaru dari tokoh terkenal karya Arthur Conan Doyle, Sherlock Holmes berkisah tentang petualangan terbaru Holmes (Robert Downey Jr.) dan mitra setianya Watson (Jude Law) Mempertunjukkan kepandaiannya sebagai seorang intelektual, Holmes bertarung lebih hebat dari sebelumnya untuk menjatuhkan musuh barunya dan mengungkapkan sebuah rencana berbahaya yang dapat menghancurkan Negara tersebut Jenis Film : Drama/adventure Produser : Joel Silver, Susan Downey, Lionel Wigram Produksi : Warner Bros. Pictures Homepage : http://sherlock-holmes-movie.warnerbros.com/ Durasi : 139 Pemain : Robert Downey Jr. ...

Inilah Cara Termudah Mengenal Ukuran Panjang dan Lebar Template Blog Kita

Apa yang harus kita lakukan pertama kali untuk mengetahui ukuran panjang dan lebar blog kita? Bagi blogger pemula, mengetahui ukuran panjang dan lebar template blog merupakan hal yang cukup membingungkan. Hal ini karena kita sebagai blogger pemula merasa awam dengan begitu banyaknya kode HTML yang termuat dalam template blog. Kalau kenyataannya sudah begini, apa akibat masalah yang kita hadapi karena edit HTML yang sulit? Waktu akan terbuang percuma hanya untuk mencari kode HTML yang menunjukan ukuran bagian template yang tidak juga ditemukan. Selain itu, jika kode HTML ini lama tidak ditemukan juga akan membuat kita merasa kesal dan bosan bukan? Nah, untuk mari kita perhatikan bersama bagaimana cara untuk mengetahui ukuran template blog milik kita. Pertama, masuk ke dalam akun blogger kita masing-masing. Klik rancangan. Klik edit HTML. Klik expand template widget. Cari kode HTML berikut ini. (hanya contoh, cari kode HTML yang dicetak tebal) Mengetahui ukuran lebar keseluruhan templ...

Daftar Situs Penyedia Kursor Pada Blog

Jika kita ingin merubah bentuk kursor pada blog , kita dapat memanfaatkan layanan dari beberapa situs yang menyediakan berbagai bentuk kursor modifikasi yang dapat kita gunakan. Bentuk kursor yang standar pada sebuah blog pada dasarnya adalah berbentuk tanda panah berwarna putih. Akan tetapi, kita dapat mengganti bentuk kursor yang standar tersebut dengan bentuk yang lebih modis dan stylis dengan menggunakan beberapa bentuk kursor yang disediakan oleh situs-situs penyedia kursor pada blog di bawah ini : http://www.cursors-4u.com http://www.myspacecursor.net http://www.totallyfreecursors.com http://www.123cursors.com http://www.anicursor.com Dengan beragam kursor dalam situs tersebut, kita dapat membuat tampilan blog menjadi lebih trendy dan lain dari pada blog yang lainnya. Menarik bukan? Jika ada yang ingin menambahi, silakan sampaikan lewat kotak komentar di bawah ini ya kawan. Salam blogger!