Rotating Random Post di Blogspot
Bagaimana bikin random post untuk blogspot (blogger) ? Ada bermacam-macam cara menampilkan random post (artikel) di blogspot. Kebanyakan gadget (widget) menampilkan beberapa artikel-artikel sekaligus dalam format daftar posting acak ke bawah atau dalam format "lucky post". Ada cara lain menampilkan random post ini yang lebih elegan dan menarik serta layak dicoba. Berikut ini caranya:
Kelebihan dari widget ini adalah sbb:
1. Menampilkan artikel satu persatu
2. Link ke artikel
3. Tiap 5 detik menampilkan artikel yang lain
4. Mencakup seluruh artikel di blog
5. Sekali di-load, widget ini akan terus bekerja meski sedang offline
6. Menggunakan teknologi Google AJAX
Ini step-stepnya:
1. Login di Blogger.com.
2. Klik Layouts link di Dashboard.
3. Klik Add Gadget link di sidebar Page Elements tab pada Layout tab.
4. Pilih Html/Javascript gadget.
5. Copy dan paste code berikut ini:
<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;
}
body {
background-color: white;
color: black;
font-family: Arial;
font-size: small;
margin: 0;
}
#feedGadget {
margin-top : 5px;
margin-left: auto;
margin-right: auto;
width : 440px;
font-size: 16px;
color: #9CADD0;
}
</style>
<script src="http://www.google.com/jsapi/?key=PUT_AJAX_KEY_HERE"
type="text/javascript"></script>
<script src="http://www.google.com/uds/solutions/dynamicfeed/gfdynamicfeedcontrol.js" type="text/javascript"></script>
<script type="text/javascript">
function showGadget() {
var feeds = [
{title:'title',
url:'http://MYBLOG.blogspot.com/atom.xml?redirect=false&start-index=1&max-results=999'},
];
new GFdynamicFeedControl(feeds, 'feedGadget',
{numResults : 1000, stacked : true,
title: "BLOG_TITLE ~ Random Posts."});
}
google.load("feeds", "1");
google.setOnLoadCallback(showGadget);
</script>
<div id="feedGadget">Loading...</div>
<div id="feedGadget">Gadget by <a href="http://www.blog-mesin-uang.blogspot.com" target="_blank">Blog Mesin Uang</a>.</div>
Edit "MYBLOG" dan "BLOG_TITLE" pada kode di atas dengan nama dan judul yang sesuai dengan blog Anda. Dapatkan key AJAX API blog Anda terlebih dahulu di sini. Ambil kode AJAX API key-nya lalu replace kode di atas pada 'PUT_AJAX_KEY_HERE'.
Terakhir save gadget. Jika ingin melihat implementasi dari gadget ini, bisa lihat di bagian sidebar kanan atas blog ini atau di blog ini (bagian tengah atas blog). Selamat mencoba.
masi bingung. tampilannya nt kayak gmana?
dicoba aja mas.memang bisa kok. eh ya salam kenal sebelumnya
mantab dan bagus banget nich blognya, kunjungan balik ya bro di download ebook gratis =p
Thank's Bro..Widget Random Post nya, bikin keren blog saya...
Izin nge-link artikelnya Bro....
oke banget ntar ane coba ya kak
oke mas bro, kami akan mencobanya...
terima kasih gan...!
Berpengaruh ga ya mas dengan adanya random post pada kualitas searching index google
makasih gan atas info nya...! sangat bermanfaat sekali bagi ane yang lagi butuh bnyak informasi..! maju terus bloger indonesia...!
nice info gan, sangat membantu newbie yang baru belajar blog, thanks
Akan dicoba! thanks for the info
terima kasih banyak, ini nih yang di perlukan oleh para blogger
PemainBandarQ Agen Poker dan Domino Terpercaya dan Terbesar se-Indonesia
Yuk Join sekarang di PemainBandarQ!! Disini kami menyediakan 7 permainan terbaik se-Indonesia.
Dengan Minimal DEPO&WD hanya Rp. 15.000,-. Anda bisa memenangkan sampai PULUHAN JUTA rupiah.
Dengan 1 User ID anda bisa akses ke 7 permainan:
*Poker
*AduQ
*DominoQQ
*BandarQ
*BandarPoker
*BandarSakong
*CapsaSusun
Nikmati juga bonus yang kami sediakan, diantaranya :
-Bonus TurnOver Sebesar 0.5% Yang dibagikan seminggu sekali , di Hari Senin
-Bonus Referral Seumur Hidup sebesar 20%
Untuk mempermudah transaksi member, Kami menyediakan 6 Bank Terbaik se- Indonesia : BCA, BNI, BRI, Mandiri, Danamon dan CIMB
Untuk info lebih lanjut silahkan kunjungi Customer Service kami di :
PIN BBM : 2BF939F6
SKYPE : PemainBandarQ
Facebook : www.facebook.com/livia.zng
Twitter : @Pemainbandarq