Membuat Rotasi Random Post

Blogger yang telah memiliki banyak posting pasti akan memiliki kendala ketika akan menunjukkan semua postingannya kepada para pembacanya. Layanan yang tersedia dari blogger sendiri hanya sebatas menampilkan judul archiv dari tiap bulannya, sehingga tentu dirasa kurang maksimal.

Solusi jitu dari permasalahan diatas adalah dengan membuat Rotasi random Post. Fitur ini menampilkan posting kita secara acak mulai posting terlama sampai postingan terbaru kita.

Untuk lebih jelasnya seperti ini.

Loading...

RudeeGo~Design By-Blogdoctor.

Kelebihannya:
* 1. Menunjukkan salah satu judul posting pada suatu waktu.
* 2. Link ke posting tersebut.
* 3. Menunjukkan kutipan posting.
* 4. Setiap 5 detik menunjukkan posting baru.
* 5. Siklus melalui semua posting dalam blog.
* 6. Siklus baru dimulai pada akhir daftar.
* 7. Sekali Loading akan terus berputar random walaupun koneksi telah internet telah terputus.
* 8. Resmi Google menggunakan teknologi AJAX.
* 9. Rotasi Article berhenti ketika mouse kita arahkan ke dalam article maupun judul.

Untuk membuat Widget diatas:
1. Login di Blogger.com.
2. Layout klik link di Dashboard.
3. Klik Add Gadget di sidebar pada Elemen Halaman.
4. Pilih Html / Javascript gadget.
5. Kopikan dahulu script dibawah ini kedalam notepad untuk diedit.


<br /> <style type="text/css"> .gfg-root { width : 100%; height : auto; position : relative; overflow : hidden; text-align : center; font-family: "Arial", sans-serif; font-size: 20px; border: 1px solid #BCCDF0; } .gfg-title { font-size: 24px; font-weight : bold; color : #3366cc; background-color: #E5ECF9; line-height : 1.4em; overflow : hidden; white-space : nowrap; } .gfg-title a { color : #3366cc; } .gfg-subtitle { font-size: 20px; font-weight : bold; color : #3366cc; background-color: #E5ECF9; line-height : 1.4em; overflow : hidden; white-space : nowrap; margin-bottom : 0px; } .gfg-subtitle a { color : #3366cc; display:none !important; } .gfg-entry { background-color : white; width : 100%; height : 6.9em; position : relative; overflow : hidden; text-align : left; margin-top : 3px; } /* To allow correct behavior for overlay */ .gfg-root .gfg-entry .gf-result { position : relative; background-color : white; width : auto; height : 100%; padding-left : 20px; padding-right : 5px; } .gfg-list { position : relative; overflow : hidden; text-align : left; margin-bottom : 5px; display:none !important; } .gfg-listentry { line-height : 1.5em; overflow : hidden; white-space : nowrap; text-overflow : ellipsis; -o-text-overflow : ellipsis; padding-left : 15px; padding-right : 5px; margin-left : 5px; margin-right : 5px; } .gfg-listentry-odd { background-color : #F6F6F6; } .gfg-listentry-even { } .gfg-listentry-highlight { background-image : url('garrow.gif'); background-repeat: no-repeat; background-position : center left; } /* * FeedControl customizations. */ .gfg-root .gfg-entry .gf-result .gf-title { font-size: 24px; line-height : 1.2em; overflow : hidden; white-space : nowrap; text-overflow : ellipsis; -o-text-overflow : ellipsis; margin-bottom : 2px; } .gfg-root .gfg-entry .gf-result .gf-snippet { height : 3.8em; color: #000000; margin-top : 3px; } /* * Easy way to get horizontal mode, applicable via js options to gadget. */ .gfg-horizontal-container { position : relative; } .gfg-horizontal-root { height : 1.5em; _height : 100%; position : relative; white-space : nowrap; overflow : hidden; text-align : center; font-family: "Arial", sans-serif; font-size: 13px; border: 1px solid #AAAAAA; padding : 5px; margin-right : 80px; } .gfg-horizontal-root .gfg-title { font-weight : bold; background-color: #FFFFFF; line-height : 1.5em; overflow : hidden; white-space : nowrap; float : left; padding-left : 10px; padding-right : 12px; border-right: 1px solid #AAAAAA; } .gfg-horizontal-root .gfg-title a { color : #444444; text-decoration : none; } .gfg-horizontal-root .gfg-entry { width : auto; height : 1.5em; position : relative; overflow : hidden; text-align : left; margin-top : 0px; margin-left : 0px; padding-left : 10px; } /* To allow correct behavior for overlay */ .gfg-horizontal-root .gfg-entry .gf-result { position : relative; background-color : white; width : 100%; height : 100%; line-height : 1.5em; overflow : hidden; white-space : nowrap; } .gfg-horizontal-root .gfg-list { display : none; } /* * FeedControl customizations. */ .gfg-horizontal-root .gfg-entry .gf-result .gf-snippet, .gfg-horizontal-root .gfg-entry .gf-result .gf-author { display : none; } .gfg-horizontal-root .gfg-entry .gf-result .gf-title { color: #0000cc; margin-right : 3px; float : left; } .gfg-horizontal-root .gfg-entry .gf-result .gf-spacer { float : left; } .gfg-horizontal-root .gfg-entry .gf-result .gf-spacer, .gfg-horizontal-root .gfg-entry .gf-result .gf-relativePublishedDate { display : block; color: #AAAAAA; } .gfg-branding { white-space : nowrap; overflow : hidden; text-align : left; position : absolute; right : 0px; top : 0px; width : 80px; } .gfg-collapse-open, .gfg-collapse-closed { background-repeat : no-repeat; background-position : center; cursor : pointer; float : right; width : 17px; height : 20px; } .gfg-collapse-open { background-image : url('arrow_open.gif'); } .gfg-collapse-closed { background-image : url('arrow_close.gif'); } .gfg-collapse-href { float : left; } .clearFloat { clear : both; } #feedGadget { margin-top : 5px; margin-left: auto; margin-right: auto; width : 600px; font-size: 10px; color: #2e3335; } </style><br /> <noscript><a href="http://rudeegoid.blogspot.com" target="_blank">Blogger Hacks</a></noscript><br /> <script src="http://www.google.com/jsapi/?key=internal-sample" type="text/javascript"></script><br /> <script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js" type="text/javascript"></script><br /> <br /> <script type="text/javascript"> function showGadget() { var feeds = [ {title:'title', url:'http://YOURBLOG.blogspot.com/atom.xml?redirect=false&start-index=1&max-results=999'}, ]; new GFdynamicFeedControl(feeds, 'feedGadget', {numResults : 1000, stacked : true, title: "YOURTITLE~ Random Posts."}); } google.load("feeds", "1"); google.setOnLoadCallback(showGadget); </script><br /> <noscript><a href="http://rudeegoid.blogspot.com" target="_blank">Another Rudee Blog</a></noscript><br /> <div id="feedGadget">Loading...</div><div id="feedGadget"><a href="http://rudeegoid.blogspot.com/2009/01/all-blogger-posts-slideshow-as-news.html" target="_blank">RudeeGo</a>~Design By-<a href="http://www.blogdoctor.me" target="_blank">Blogdoctor</a>.</div>

UNTUK Mengeditnya,perhatikan penggalan script dibawah ini (letaknya di sekitar akhir script).

<br /> <script type="text/javascript"> function showGadget() { var feeds = [ {title:'title', url:'http://YOURBLOG.blogspot.com/atom.xml?redirect=false&start-index=1&max-results=999'}, ]; new GFdynamicFeedControl(feeds, 'feedGadget', {numResults : 1000, stacked : true, title: "YOURTITLE ~ Random Posts."}); } </textare>

Untuk YOURBLOG ganti dengan alamat blog anda
Sedangkan YOURTITLE ganti dengan Title dari Blog anda

6. Kopikan script yang telah anda edit tadi ke dalam widget (HTM /Java script) yang telah anda pilih tadi.
7.Klik Simpan