-->

9/01/2010

Trik Membuat Artikel Terkait Lebih Profesional dan Ringan




Dalam artikel tips trik blog kali ini saya akan mencoba memperkenalkan pemasangan Artikel Terkait yang termasuk sangat sederhana baik dari jumlah script maupun dari teknik pemasangannya. Script yang digunakan sangatlah sedikit, sehingga bagi para pemula mudah-mudahan hal ini tidak menyulitkan. Fasilitas Artikel Terkait kali ini di buat oleh Yu-Jie Lin dengan bantuan Blogger Data API sebagai teknik pemanggilan database-nya. Hal inilah yang membuat fasilitas Artikel Terkait menjadi lebih sederhana, ringan, mudah, dan cepat dalam proses loading datanya.
Tetapi sebelum memasang tips trik blog artikel terkait, perhatikan hal-hal berikut ini :
  • Fasilitas ini hanya untuk blog umum dan terbuka.
  • Pemilik fasilitas ini akan memblok blog kita jika melanggar hal-hal berikut :


  1. Melanggar hak cipta (Jika blog kita mengandung link yang mengarahkan ke download data illegal, langsung atau tidak langsung, diupload sendiri atau tidak, JANGAN menggunakan fasilitas ini. Yang fatal, blog kita akan di BLOK),
  2. Gambar-gambar kategori dewasa dan mengandung unsur pornografi,
  3. Artikel berisi provokasi atau bentuk kebencian terhadap suatu kelompok yang dilindungi,
  4. Mempromosikan hal-hal berbahaya dan aktifitas illegal,
  5. Blog mengandung fasilitas fishing atau account hijacking,
  6. Menyimpan identitas pengunjung atau
  7. Penyalahgunaan fasilitas ini.

Ingin tahu lebih jauh silahkan kunjungi website Blogger Related Posts Service.

Langsung ke Saja kita mulai cara memasang related post nya

Langkah 1
Login ke Blogger

Langkah 2

Masuk ke “Tata Letak – Edit HTML”

Langkah 3

Expand Template Widget

Langkah 4

Cari kode dibawah ini:


1
 <data:post.body/>

Langkah 5

Masukan (copy paste) kode dibawah ini dibawah kode langkah 4:


1
<div id='related_posts'/>

Langkah 6


Scroll template sampai akhir dan cari kode dibawah ini:


1
2
</body>
</html>

Langkah 7

Masukan (copy paste) kode dibawah ini tepat diatas kode pada langkah 6:


1
2
3
4
5
6
7
8
<script src='http://www.google.com/jsapi'/>

<script type='text/javascript'>
window.brps_options = {
"title": "<h3>Artikel lain yang terkait:</h3>",
"max_results": 5
}
</script>
<script src='http://brps.appspot.com/brps.js' type='text/javascript'/>

Langkah 8

Simpan template dan preview blog anda


Tambahan :

Perhatikan langkah 7!



  • “title”: “<h3>Artikel lain yang terkait:</h3>” : kode ini digunakan untuk memberikan nama widget.

  • “max_results”: 5 : nilai 5 (lima) digunakan untuk menentukan jumlah artikel yang akan ditampilkan

Tips trik artikel terkait diatas sebenarnya sudah bisa berjalan dengan baik tetapi dengan tampilan yang sangat sederhana, jika kita mau memodifikasi dari segi tampilan, maka kita perlu menambahkan kode CSS untuk mempengaruhi/mempercantik tampilan artikel terkait pada blog kita.

Perhatikan penambahan CSS (Cascading Style Sheet) dibawah ini:

Langkah 1

Login ke Blogger

Langkah 2

Masuk ke “Tata Letak – Edit HTML”

Langkah 3


Cari kode dibawah ini:


1
]]></b:skin>

Langkah 4

Masukan (copy paste) kode dibawah ini diatas kode pada langkah 3:


1
2
3
4
5
6
#related_posts{float:left;width:300px;margin-top:20px;margin-left:5px;font:11px verdana;margin-bottom:10px}
#related_posts h2{color:#940f04;font-size:20px;font-weight:400;margin:5px 7px 0;padding:0 0 5px}
#related_posts a{color:#054474;font-size:11px;text-decoration:none}
#related_posts a:hover{color:#054474;text-decoration:none}
#related_posts ul{list-style-type: none; border:medium none;margin:10px;padding:0}
#related_posts ul li{display:block; background:url(http://dedehendriono.googlepages.com/weed-bullet.gif) no-repeat 0 0;line-height:2em; border-bottom:1px dotted #ccc; margin:0 0 5px; padding:0 0 1px 15px}

Langkah 5

Simpan template dan preview blog anda

Sampai disini Semua langkah pemasangan script "artikel terkait" Sudah selesai. Tetapi karena si pemilik script tidak ingin script nya digunakan untuk hal yang salah, maka pemilik script mewajibkan kita untuk mengambik kode verifikasi. Jika anda tidak memiliki kode verifikasi, maka akan muncul pesan :

The key is invalid. Please go to BRPS to obtain one. If you are reading this, please relay the message to the owner of this blog.

Untuk mengatasinya, langsung ke :

http://brps.appspot.com/getkey

Masukkan blog/web anda, dan ikuti langkah selanjutnya. Sangat mudah, semuanya dijelaskan secara berurutan.

Selamat mencoba, script ini terbukti lebih ringan dan tidak membebani CSS kita. Selain itu, tampilan script juga lebih profesional daripada script "artikel terkait" yang lain


Zona Iklan
(Silahkan di klik satu kali saja)

1 komentar:

Posting Komentar

Related Posts Plugin for WordPress, Blogger...