Membuat Author Box Di Bawah Postingan

Playwebstar

Selamat malam semua, malam ini saya akan menjelaskan tentang membuat Author Box. Ternyata membuat Author Box tidaklah sulit.

Langsung ke TKP :

Login ke blogger
Masuk ke Edit Html , Beri Centang Pada "Expand Template Widget"
Cari kode ini :

]]></b:skin>

4. Letakkan Kode di bawah ini di atas kode tersebut :

/***** Author Box ********************/
.author-box {
background: #f0f0f0;
margin: 20px 0 40px 0;
padding: 10px;
overflow: auto;
color:#888;
font-family:verdana, sans-serif;
}
.author-box p {
margin: 0;
padding: 0;
}
.author-box a{
color:#666;
}
.author-box img {
background: #FFFFFF;
float: left;
margin: 0 10px 0 0;
padding: 4px;
}

5. Simpan , Lalu Cari kode di bawah ini :

<div class='post-footer-line post-footer-line-1'>

6. Letakkan Kode di bawah ini tepat di bawah kode di atas.

<b:if cond='data:blog.pageType == "item"'>
<div class='author-box'>
<p><img alt='avatar' class='avatar avatar-70 photo' height='70' src='http://i959.photobucket.com/albums/ae80/barboz_228/gw_opt.jpg' width='70'/><b>About Author</b><br/>
Saya Seorang pelajar dari jakarta yang suka sekali dengan hal yang baru. Semoga di masa depan nanti saya akan menjadi orang sukses yang selalu membanggakan bangsa!<br/></p>
</div>
</b:if>

7. Simpan dan Lihat Hasilnya.

Anda bisa berkreasi sendiri, untuk mengedit warna, lebar, panjang nya ada di kode Css nya.

Teks yang berwarna merah adalah Pesan/teks anda.

Teks yang berwarna biru adalah url gambar anda.