Cara Menambah Random Post

Mungkin bagi seorang blogger widget seperti ini tidaklah asing. Tapi widget yang satu ini berbeda dari widget random/recent yang sudah ada. Pada widget ini dapat berfungsi sebagai random post [artikel acak]/recent post [artikel terbaru]. Selain bisa memilih diantara dua opsi itu juga bisa digunakan untuk menampilkan berdasarkan label/kategori baik itu pada random/rencent.

DEMO TAMPILAN

Metode yang saya gunakan untuk meload artikel sama dengan widget komentar terbaru yaitu dengan jQuery $.ajax(). Sehingga untuk dapat berfungsi setidaknya template anda sudah ada jQuery librarynya.

Jika anda tertarik memasang diblog anda silahkan ikuti cara pemasangannya berikut ini.

Pemasangan Widget

Pertama-tama masuklah ke halaman tata letak dengan mengeklik menu Tata Letak:

Masuk ke halaman Tata Letak

Tambahkan sebuah elemen halaman HTML/JavaScript, kemudian salin semua kode ini dan letakkan di dalam formulirnya:

<style scoped="" type="text/css">
ul.rdmrcpostag{text-align:left;font:normal normal 11px Verdana,Geneva,sans-serif}
ul.rdmrcpostag,ul.rdmrcpostag li{margin:0;padding:0;list-style:none;overflow:hidden}
ul.rdmrcpostag{background:aliceBlue}
ul.rdmrcpostag li{padding:5px}
ul.rdmrcpostag b a{color:#00699B}
ul.rdmrcpostag .thumbp{float:left;margin:0 5px 3px 0}
ul.rdmrcpostag img{padding:3px;border:1px solid #B1B1B1;background:#F3F3F3}
ul.rdmrcpostag .datex{font-size:8px;margin:3px 0 0}
ul.rdmrcpostag .dt{margin:0 5px 0 0;padding:0 5px 0 0;border-right:1px solid #7A7A7A}
ul.rdmrcpostag p{margin:5px 0 0}
</style>
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script>
<script src="http://ivyth.googlecode.com/svn/js/rdmrecpostajax.js" type="text/javascript"></script>
<div id="randomcecent_posts_id"></div>
<script type="text/javascript">
//<![CDATA[
$(window).load(function(){
RandomRecenTag({
blogURL: "",
MaxPost: 6,
RandompostActive: true,
thumbSize:55,
jumlahhuruf:100,
cmtext:"Komentar",
NoCmtext:"No Comment",
tagName:false,
idcontaint: "#randomcecent_posts_id"
});
});
//]]>
</script>

NB:
1. Jika di template anda sudah ada jQuery library maka kode ini <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script> tidak perlu dicopy.
2. Untuk merubah warna dari background rubah tulisan aliceBlue bisa dengan HEX Generator.

Opsi-Opsi

Opsi

Keterangan

blogURL

Bisa diisi dengan url dari blog contoh: url_blog:"http://mkr-site.blogspot.com". Jika dibiarkan kosong akan menampilkan artikel dimana widget ini dipanggil

MaxPost

Jumlah Maksimal artikel yang ditampilkan. default: 5.

RandompostActive

Mengaktifkan arikel acak atau tidak, default: true. Opsi yang bisa dipilh true atau false

idcontaint

ID tempat widget akan ditampilkan misal: <div id="randomcecent_posts_id"></div> maka idcontaint:"#randomcecent_posts_id"., default :"#randompost:".

thumbSize

Ukuran dari thumbnail gambar dari artikel (dalam pixel). setidaknya artikel memiliki gambar yang disimpan diblogspot atau picasa web, default: 100.

jumlahhuruf

Jumlah karakter/huruf yang tampil dibagian ringkasan artikel, default: 100

cmtext

Tulisan diakhir jumlah komentar, default: "comments" .

pBlank

Gambar backup jika artikel tidak terdapat gambar yang disimpan diblogspot/picasa web, default: "http://2.bp.blogspot.com/-D47WWjFZXdk/UP1z-A5uCuI/AAAAAAAAH98/heTBvxq49No/s1600/noimage.jpg".

NoCmtext

Tulisan jika artikel belum memiliki komentar, default "No Comment".

tagName

Jika ingin menampilkan arikel berdasarkan label/kategori default: false. Jika ingin memunculkan arikel berdasarkan label tinggal tulis labelnya seperti ini tagName: "blogger"

NB: Sebaiknya file JS disimpan di google code anda sendiri. Jika ingin tahu cara menyimpannya di google code silahkan ke tutorial Menyimpan file di Google Code.