Artikel Terbaru :
Newspaper_Feed_128x128_thumb[1]
Pengunung akan disuguhkan artikel terkait milik sobat di sebelah postingan atau di sidebar, bukan dibawah postingan yang selama ini kita lihat. Sebenarnya artikel terkait ini bisa juga diletakkan dibawah postingan, tapi saya tidak akan membahasnya karena sudah pernah saya bahas di postingan saya yang lalu
Baiklah, sekarang ikuti langkah-langkahnya dibawah ini :

Langkah I
  1. Seperti biasa login dulu ke blogger.
  2. Masuk ke Elemen Halaman.
  3. Kemudian Tuju Edit HTML.
  4. Klik Expand Template Widget.
  5. Letakkan kode berikut ini sebelum 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>


6. Kemudian cari kode seperti dibawah 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>

 Lalu sisipkan kode yang berwarna hijau, sehingga hasilnya menjadi seperti berikut :

<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>

8. Simpan Template, sampai disini proses Edit HTML sudah selesai.
9. Sekarang sobat tuju Tata Letak, kemudian klik Tambah Gadget pada sidebar milik sobat.
10. Pilih yang HTML/Javascript, kemudian masukkan kode berikut :

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

 11. Jangan lupa beri judul, lalu klik Simpan.

 Sampai disitu sudah selesai pembuatan artikel terkait di sidebar. Namun artikel terkait akan selalu muncul di halaman depan blog, untuk membuat artikel terkait hanya muncul pada halaman postingan saja, maka sobat harus mengubah beberapa kode lagi.


Langkah II

  1. Klik Edit HTML.
  2. Klik Expand Template Widget.
  3. Cari kode yang seperti ini, dan sisipkan kode yang berwarna merah : 
 <b:widget id='HTML11' locked='false' title='Artikel Terkait Lainnya' 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>

Kemudian klik Simpan Template.

Untuk tulisan HTML 11 dan Artikel Terkait Lainnya, hanya mengambil dari template saya, silahkan sobat sesuaikan dengan template dan judul artikel terkait yang tadi sudah sobat buat. 

Artikel Terkait:

  • Cara Membuat Scroll dan Icon Folder Pada Widget Label Ketemu lagi kita di kesempatan artikel ini..ehm ...sobat mungkin sudah mengerti maksud judul di atas yang seperti terlihat pada gambar yaitu sebuah icon berbentuk folder yang biasa kita bisa lihat pada windows xp ..… Read More
  • Cara Membuat Tombol Back To Top di Blog Tombol Back To Top ini akan bermanfaat bagi pengunjung ketika ia ingin kembali ke bagian paling atas pada halaman web setelah membaca artikel pada Blog sobat yang panjang. Ok, jika sobat ingin membuat Tombol Back To Top … Read More
  • Membuat Sticky Widget pada Sidebar Blog Ada widget menarik untuk  Blog nih sobat, namanya Sticky Widget. Saya dan mungkin sobat Blogger pun sudah sering melihat widget ini, namun saya baru tau nama dari widget ini yaitu Sticky Widget. Ingin tau lebih banya… Read More
  • Cara Membuat Iklan Melayang Dengan Tombol Close Menempatkan iklan melayang dapat diletakkan pada Header, Footer, Sidebar ( Kanan dan Kiri ) , atau bisa juga membuat iklan melayang di tengah halaman tentunya dengan tombol close 1x click. Artinya dengan bantuan tombol pe… Read More
  • Memberi Icon Folder pada judul label Ketemu lagi kita di kesempatan artikel ini..ehm ...sobat mungkin sudah mengerti maksud judul di atas yang seperti terlihat pada gambar yaitu sebuah icon berbentuk folder yang biasa kita bisa lihat pada windows xp .… Read More

0 komentar:

Post a Comment