Smarter Related Posts Google Blogger Widget

Ketimbang enggak mosting, lebih baik share cara masukin smarter related posts google blogger widget karya More Tech Tips! Kalau kepengen mirip google banget bisa dilooking New Related Articles Widget. Seperti yang ada diblog ini Prodigy of Head Related Posts Integration Blogger Widget.
So...kembali ke proyek postingan terkait miliknya moretechtips. Related posts ini berotasi alias bergonti-ganti, dapat berupa tulisan tampilannya ataupun image. Karena metode Add a Gadget ► HTML/Javascript memudahkan dalam penerapannya sob :D Buka artikel berikut guna melihat ke-4 demo Related Posts Widget for Google Blogger v2.0 Setup! Default coded your got

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

<script type="text/javascript" src="http://blogger-related-posts.googlecode.com/files/jquery.related-posts-widget-2.0.min.js"></script>

<div class="related-posts-widget">
<!-- {
blog_url:'http://YOUR-NAME-BLOG.blogspot.com'
 ,thumbs:0
} -->
loading..
</div>

Script warna biru jika sudah tertanam ditemplate tidak usyah dipakai lagi yah :) YOUR-NAME-BLOG replace with your link blog. Dengan script itu saja sobat sudah memiliki related posts. Tapi tidak akan berotasi alias menjedog menjentul gan :D

Coba sekarang pasang yang ini ;))

<script type="text/javascript" src="http://blogger-related-posts.googlecode.com/files/jquery.related-posts-widget-2.0.min.js"></script>
<div class="related-posts-widget">
<!-- {
blog_url:'http://YOUR-NAME-BLOG.blogspot.com'
,titles:0
,thumbs:1
,thumb_size:'s104-c'
,max_posts:10
,max_tags:10
,show_n:4
,stay_time:9000
,animate:'width'
} -->
loading..
</div>

Keterangan:

1. titles
Pada posisi angka 0 berarti tidak aktif, kalo dibikin menjadi 1 = aktif.
2. thumbs
Sama jika pada 0 = non aktif, 1 = aktif.
3. thumb_size
Ukuran (image) jika thumbs diaktifkan. Default size 's72-c' Kalau mau uncropped (tidak dipotong) tinggal ganti 's72' Untuk ukuran cropped & uncropped: 32, 48, 64, 72, 104, 144, 150, 160. Uncropped saja: 94, 110, 128, 200, 220, 288, 320, 400, 512, 576, 640, 720, 800, 912, 1024, 1152, 1280, 1440, 1600.
4. max_posts
Jumlah postingan yg dipanggil.
5. max_tags
Ini tidak tauk buat apaan, soalnya pas praktek tidak keliatan efeknya :P
6. show_n
Jumlah rotasi pada saat tampilan. Default point = 5.
7. stay_time
Waktu jeda ketika sedang tampil dan akan berganti ke post selanjutnya.
8. animate
Jenis animasi: width, fontSize, lineHeight, height, dan opacity.

Mungkin segitu menurut Beben Koben si bloglang anu ganteng kalem tea setingan seperlunya. Kalau mau detailsnya yaaa silahkan deh baca sendiri ke sumber pencipta ;)) :D

Terdapat link css hostingan<link type="text/css" href="http://blogger-related-posts.googlecode.com/svn/v2/style1.css" rel="stylesheet" />
Menurut hemat Beben mending sobat pakai ini

<style>
.related-posts-widget ul {
list-style-type:none;
margin:0;
padding:0;
width:XXpx;
height:XXpx;
}
.related-posts-widget ul li{
float:left;
margin:0 0 3px 3px;
}
.related-posts-widget img{
border:silver 3px solid;
}
</style>

Masukin deh bareng ketika Add a Gadget ► HTML/Javascript bersama script related postnya. Kreasikan deh itu kode CSS sesuai selera b-)



Happy relates posts \m/