Cara Membuat Kotak Pesan Admin (Author Box) di Blog

 

Hai sobat Bantolo Share
Kali ini saya akan share tentang Cara Membuat Kotak Pesan Admin (Author Box) di Blog| Author box atau Kotak Pesan Admin biasanya digunakan sebagai tanda pengenal seorang penulis dari sebuah blog, atau berupa penyampaikan pesan singkat dari penulis. Kotak pesan tersebut terdapat gambar dari penulis blog serta ucapan terima kasih kepada penunjung yang telah berkunjung dan membaca artikel pada blog. Kotak admin pada dasarnya ditempatkan dibawah posting blog dan umumnya judul posting yang dibaca. Saya akan memberikan langkah untuk membuat author box pada blog anda.


1. Login ke Blogger
2. Masuk ke Rancangan lalu pilih Edit HTML
3. Expand Template Widget anda
4. Paste kode dibawah ini diatas kode ]]></b:skin>

.bantolotitle { background: #0F83A0; color: #fff; padding: 12px 15px; font-size: 14px; } .bantolotitle span { vertical-align: middle; display: inline-block; margin-right: 8px;}.bantolocontent { background: #fff; padding: 15px 12px; border: 2px solid #0F83A0; border-top: 0; margin-bottom: 20px; }

.bantolocontent p { margin: 15px 0; }

5. Paste kode dibawah ini diatas kode <div class='post-footer'>

<div class='bantolotitle'>Ditulis oleh <a expr:href='data:blog.homepageUrl'><data:post.author/></a> ~ Turitorial Blog</h4>
</div><div class='bantolocontent'><img alt='Foto Saya' class='profile-img' height='80' src='//lh6.googleusercontent.com/-qsUhW8RKt1I/AAAAAAAAAAI/AAAAAAAAAEE/_UUVhG1N_3U/s512-c/photo.jpg' width='80'/>Terimakasih sudah membaca artikel <a href='<data:post.url>'" title='<data:post.title/>'><data:post.title/></a>, anda dapat mengcopy artikel ini dengan syarat memberikan sumbernya, silahkan copy link dibawah ini <textarea cols='57' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='2'><a href="<data:post.url/>" target="_blank"><data:post.title/></a></textarea><br/>Follow admin di Twitter <iframe class='twitter-follow-button' frameborder='0' scrolling='no' src='http://platform.twitter.com/widgets/follow_button.html#_=1319978796351&%20align=&button=blue&id=twitter_tweet_button_0&%20lang=ID&link_color=&screen_name=toloban&show_count=&%20show_screen_name=&text_color=' style='height: 20px; width: 250px;' title=''></iframe></div>

Keterangan: kode merah adalah url gambar 

6. Simpan template anda lalu lihat hasilnya

Kini anda akan memiliki Author Box yang keren. Selanjutnya anda tinggal mengedit kode diatas agar pesan author box sesuai dengan kebutuhan anda. Oke selamat mencobanya!