Pasang Profil Penulis di Bawah Postingan Blogger

Rasanya sudah lama saya tidak update artikel di blog ini, mungkin karena kesibukan di dunia nyata. nah, pada kesempatan kali ini saya akan share widget Kotak Profil Penulis di Bawah Postingan Blogger. mungkin widget ini sudah bnyak yang tahu, tapi tidak ada salahnya jika saya share lagi.

Untuk memasang Widget Kotak Profil Penulis di Bawah Postingan Blogger ini, silahkan ikuti langkah - langkah berikut ini :

1. Login dahulu ke Blogger
2. Kemudian Klik Tata Letak » Edit HTML
3. Jangan lupa Centang Expand Template Widget
4. Lalu cari kode berikut ]></b:skin> Tekan Ctrl+F (mozzilla) untuk mempermudah pencarian.
Kemudian taruh kode berikut diatasnya.

/* Author Box */
#author-box{float:left;padding:10px;width:560px;background:#fff;margin:0 0 0 -30px;position:relative;text-shadow: 1px 2px 1px red; color:#000;border: 3px solid #000;-moz-border-radius:5px; -webkit-border-radius:15px; box-shadow:-1px -1px 1px #666,1px 1px 1px #666,1px 1px 10px #33F; -moz-box-shadow:-1px -1px 1px #666,1px 1px 1px #666,1px 1px 10px #33F; -webkit-box-shadow:-1px -1px 1px #666,1px 1px 1px #666,1px 1px 10px #33F;-o-transition:1s ease-out; -moz-transition:1s ease-out; -webkit-transition:1s ease-out)}
#author-box:hover{opacity:0.7; width:auto;background:red;color:#000;text-shadow: 1px 2px 1px white;border-radius:10px; border: 3px solid #ccc;-moz-border-radius:5px; -webkit-border-radius:15px; box-shadow:-1px -1px 1px #666,1px 1px 1px #666,1px 1px 10px #F70000; -moz-box-shadow:-1px -1px 1px #666,1px 1px 1px #666,1px 1px 10px #F70000; -webkit-box-shadow:-1px -1px 1px #666,1px 1px 1px #666,1px 1px 10px #F70000;}
#author-box a{font-size:15px; text-shadow: 1px 2px 1px #000; color:#fff}
#author-box a:hover {font-size:18px;color:hijau}
#author-box h4 {font-size:18px; text-shadow: 1px 2px 1px #000; color:orange}

.author-corner{background:url(URL) no-repeat left top #33F; bottom:-13px;height:12px;left:2px;position:absolute;width:120px;}
.author-avatar{float:left;margin:0 20px 0 0}
.author-avatar img {width:110px;height:120px; border: 2px solid #ccc}
.author-text{float:left;width:480px}
.author-text p{line-height:2em}

5. Lau cari code <div class='post-footer-line post-footer-line-1'>. jika sdh ketemu, lalu copas kode berikut tepat dibawahnya.

<!-- Author Box Code Start-->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div id='author-box'>
<div class='author-avatar'>
<img alt='Utta Melanikz' src='http://profile.ak.fbcdn.net/hprofile-ak-snc4/203270_100000771677312_2706391_n.jpg'/></div>
<h4>Post Author : <a href='http://darmasite.blogspot.com/' title='Posts by admin'>Darma Jaya</a></h4>
Saya hanyalah seorang blogger pemula yang ingin belajar dan berbagi, Semua artikel bersumber dari pengalaman yang saya dapatkan dari dunia internet.Jika anda senang dengan Artikel ini, silahkan berlangganan gratis <a href='http://feedburner.google.com/fb/a/mailverify?uri=darmasite' target='_blank'><strong><blink>Via Email</blink></strong></a> atau <a href='http://feeds.feedburner.com/darmasite' target='_blank'><strong><blink>Feed Rss</blink></strong><center><a href='http://feeds.feedburner.com/darmasite'><img alt='' height='26' src='http://feeds.feedburner.com/~fc/darmasite?bg=660033&amp;fg=FFFFFF&amp;anim=1&amp;label=listeners' style='border:0' width='88'/></a></center></a></div>
</b:if>
<!-- Author Box Code End-->

6. Terakhir Save.dan lihat hasilnya...

KET:
-Teks yg berwana biru adalah URL foto sobat,
-dan teks yang berwarna orange adalah Isi tulisan mengenai diri sobat.
-dan yg berwarna merah adalah alamat Feed RSS anda.
-dan yg berwarna kuning adlh nama sobat.
-Width ukuran lebar halaman posting anda silahkan anda ganti dengan lebar halaman anda.

Sekian dari saya mengenai cara pasang widget  Profil Penulis di Bawah Postingan Blogger, semoga artikel ini bermanfaat bagi blogger semua.