Cara Membuat Author Box Di Bawah Postingan Blog

[+] Post Title :

Cara Membuat Author Box Di Bawah Postingan Blog

[+] Date : 4/18/2011
[+] Author : Oktri darmadi
[+] Link : http://tipsbelajar-blog.blogspot.com/2011/04/cara-membuat-author-box-di-bawah.html
[+] Type : Tips Blogger

Hello Pembaca oktri.co.cc Pada Tutorial Blog kali ini saya akan berbagi Tutorial Cara Membuat Author Box Di Bawah Postingan Blog, Author Box Ini Bertujuan Agar Pengunjung Mengetahui Siapa Penulis Artikel Yg Ada Di Blog Sobat Semua Untuk melihat Contohnya obat Bisa Melihat Pas Dibawah Artikel Ini Ada About Authornya.Atau Juga Sobat Bisa Melihat Gambar Yg Ada Disamping Artikel Ini.

Jika Sobat Berkenan Memasangnya Sobat Bisa Mengikuti Langkah-Langkah Berikut:

1. Login Ke Akun Blogger Sobat  
2. Pada Dasbor Pilih Rancangan --> Edit HTML Dan Jangan Lupa Untuk Centang Kolom Expand Template Widget
3. Letakan Kode Berikut Tepat Diatas Kode ]]></b:skin>

.teja{background:#000;margin:20px 0 40px 0;padding:10px;overflow:auto;color:#fff}
.teja p{margin:0;padding:0}.teja a{color:#FFF}
.teja img{background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi9wtYVq8BPp2awFPG-LXN80p8YY5jyhzX-hpWyHSO7a8VIdikFlVJb2BW7PN7lOifFLLcmlh3jdUcbaJpgNsY-DcmFUzVAldibV8095GbvLJvVhq_QmgGwT4FlATrp0mDGZ-DQlEB6nnmH/s1600/bg-img-auhtor.gif)no-repeat;float:Left;margin:0 10px 0 0;padding:4px}

      4. Cari Kode <div class='post-footer-line post-footer-line-1'> Agar Memudahkan Pencarian Gunakan CTRL F Atau F3
 
   5.Letakan Kode Berikut Tepat Dibawah Kode<div class='post-footer-line post-footer-line-1'> 

<b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='teja'>
<p><img alt='' class='avatar avatar-70 photo' height='130' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEifQh0CNB8npBIl9nBNt_QGMlFHymn3bnbCkEBED1XSflrDAKZkoxKZowvyi16SghCkl_bdjTvGBXCXCQ8C4M_CMNnkXGIDdWpeNT8BHiQHTcGJ1xsMf89tAZGkhXeTThgH0-Cr6l_hEKir/s1600/author.png' width='100'/><div style='font-family: kristen itc; color: rgb(255, 0, 0);'><b>ABOUT THE AUTHOR</b></div>
<div style='text-align: justify; font-family:bedizen'><a href='http://www.oktri.co.cc//' target='new'><b>Oktri : </b></a>Seorang Manusia yang selalu ingin menjadi lebih baik
</div></p>
</div>
    </b:if>

  6.Simpan Templatenya

CATATAN: Sobat Bisa Mengubah Url Gambar Yg Berwarna Merah Dengan Url Gambar Sobat
                     Dan Ubah kata kata Yg Berwarna Hijau Dennga Kata kata sobat sendiri