widget random post with admin profil

Random post dipadukan dengan widget admin profil menjadi suatu widget andalan di halaman blog dengan kode valid html 5 dan CSS 3, serta memiliki sistem penulisan tag html yang SEO Friendly. Kode script yang ringan dan tampilan yang lebih elegan untuk sebuah widget menjadikan widget random post with admin profil ini menjadi pilihan para pengguna blog baik itu para pemula ataupun para jawara blog.

Fitur Widget

1. Random Post
2. Gambar admin
3. Link Profil admin
4. Text snipet admin

Referensi Artikel

• Jquery widget tab random post
• Widget Tabber random post per kategori
  
• Jquery random post
  
• Random Post SEO Frienly
  

Install Program CSS

1. Login ke dashboard anda
2. Masuk ke "TEMPLATE" lalu klik " Edit HTML "
3. Cari code </head>
4. Copy Code script CSS dibawah ini, pastekan tepat diatas code </head> yang tadi atau bila template blog anda memakai </style> silahkan pastekan kode CSSnya tepat diatas </style> template anda.

/*****************************************
Name : Random Post with Profil
By : Rivai Silaban | Blog Design
Update : Sabtu, 14 September 2013
******************************************/
#BD_rantle {
list-style-type: none;
width: 280px;/* LEBAR WIDGET */
padding: 3px;
background-color: #333333;/* WARNA LATAR BELAKANG WIDGET */
}
#BD_rantle a {
font: 10px Verdana, Arial, Helvetica, sans-serif;
color: #000;
line-height:12px;
letter-spacing:0.1em;
text-decoration: none;
display:block;
padding:2px 6px 5px 8px;
background-color: #FFFFFF;
border-bottom: solid #DFDFDF 1px;
}
#BD_rantle a:hover {
color:#CCCCCC;
text-transform: none;
background-color: #666666;
border-bottom: solid #FF0000 1px;
}
#BD_rantle .BD_random_list {
font: 10px Verdana, Arial, Helvetica, sans-serif;
color: #000;
line-height:30px;
letter-spacing:0.1em;
text-decoration: none;
}
#BD_rantle .pic a{
margin:-60px 0 0 0;
text-decoration: none;
color: #FFFFFF;
float: right;
font-family: Georgia, "Times New Roman", Times, serif;
font-style: italic;
font-size: 18px;
width: 200px;
line-height: 1.1em;
background-color: #999999;
border-bottom:solid #FF0000 3px;
border-top:solid #FF0000 3px;
text-shadow: 1px 0 2px #000;
}
#BD_rantle .pic a:hover{
text-decoration: none;
color: #CCCCCC;
text-shadow: none;
background-color: #666666;
border-bottom:solid #0099FF 3px;
border-top:solid #0099FF 3px;
}
#BD_rantle .text {
width:100%;
font-family:Verdana, Arial, Helvetica, sans-serif;
font-size:10px;
color:#CCCCCC;
line-height: normal;
text-align: center;
}/* BLOG DESIGN CSS and */

Install Program Tag HTML

• Setelah anda sudah memasang CSSnya saatnya anda memasang kode htmlnya.
• Untuk memasang kode htmnya anda dapat memasangnya dimana saja. Untuk tutorial kali ini saya memasangnya di widget sidebar halaman blog.
• Silahkan pilih " Tata Letak " pada dasbor blog anda.
• klik "Add gadget " ( Tambahkan gadget )
• Setelah muncul halaman gadget silahkan pilih " HTML/JavaScript ".
• Copy kode didalam spoiler dibawah ini kemudian pastekan di gadget anda.
• Edit script dan save .

<!-- BDRS html start -->
<div id="BD_rantle">
<div class="BD_random_list">
<p><img alt='gambar admin' height='50' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjtg-2IFYC1QFZf6PzeN7I4iiQO2TZDL7_DK_JKTIGbKE0AgwvtucOgGElqSOc6UUzafJfwVkxHHeBJtT83_M0-Dehl9_0baWwtgBhZwqN8xYFJGZWhSdvJsHhtdOVsa-aHct0bk2TdROQ/h120/rivai.jpg' style='border:solid #999 1px; border-radius:5px; margin-left:5px;' title='Rivai Silaban' width='50'/>
</p><p class="pic"><a href='http://rivai-silaban.blogspot.com' target='_blank' title='My Profil'><b>Rivai Silaban <br/> BLOG DESIGN </b></a></span></p><br/><p class="text" style="margin-top:-30px;">Tunduk bukannya saya takut tapi saya sadar atas apa yang saya miliki adalah kuasa Tuhan, hingga tiba saatnya nanti Tuhan akan mengambilnya dari saya.</p>
<script type="text/javascript">
var randarray = new Array();var l=0;var flag;
var numofpost=7;function randomposts(json){
var total = parseInt(json.feed.openSearch$totalResults.$t,10);
for(i=0;i < numofpost;){flag=0;randarray.length=numofpost;l=Math.floor(Math.random()*total);for(j in randarray){if(l==randarray[j]){ flag=1;}}
if(flag==0&&l!=0){randarray[i++]=l;}}document.write();
for(n in randarray){ var p=randarray[n];var entry=json.feed.entry[p-1];
for(k=0; k < entry.link.length; k++){if(entry.link[k].rel=='alternate'){var item ="<div >" + "<a href=" + entry.link[k].href + " title=" + entry.link[k].href +">" + entry.title.$t + "</a></div>";
document.write(item);}}
}document.write();}
</script>
<script src="URL BLOG ANDA /feeds/posts/default?alt=json-in-script&start-index=1&max-results=1000&callback=randomposts" type="text/javascript"></script> </div></div>
<!-- BDRS html End -->

Keterangan Code

• Untuk kode CSSnya kode [ width:280px ] adalah lebar widget, sesuaikan dengan lebar tampilan sidebar halaman blog anda silahkan anda edit CSSnya sesuai dengan thems template anda.
• Untuk tulisan warna HIJAU ganti dengan tulisan singkat tentang anda.
• Tulisan kode warna MERAH ganti dengan URL blog anda.
• Kode tulisan warna BIRU ganti dengan nama anda atau nama blog anda.
• Kode tulisan warna KUNING ganti dengan link gambar anda .
  

Kesimpulan

Widget Random Post with Admin Profil ini memiliki kode tag html yang valid html 5 dan CSS 3 serta sistem penulisan kode link SEO Frienly.
Bila teman teman mengalami masalah dalam pemasangan widget ini atau terdapat kesalahan penulisan kode silahkan hubungi saya atau share dengan saya melalui form komentar dibawah.

Widget Random Post With Admin Profil
Sabtu, 14 September 2013
By : Admin Blog Design | Rivai Silaban

Terimakasih atas kunjungannya,Bila anda suka dengan artikel ini silahkan JOIN TO MEMBER BLOG atau berlangganan geratis Artikel dari blog ini, daftarkan email anda pada form subscribe dibawah halaman . Pergunakan vasilitas diblog ini untuk mempermudah anda. Bila ada masalah dalam penulisan artikel ini silahkan kontak saya melalui kotak komentar yang ada dibawah atau gunakan fasilitas yang ada diblog ini untuk menghubungi saya.

Salam Blogger.... !!! .

Admin Rivai Silaban

Share article with : Google+ Facebook Twitter

Di posting oleh : Unknown Update pada : 1:29 PM