Pages

1/28/2013

Cara Membuat Author Box di Bawah Postingan

Cara Membuat Author Box di Bawah Postingan

Cara Membuat Author Box di Bawah Postingan - Cara/trik memberi kotak penulis/author box di bawah setiap postingan atau cara menambah identitas penulis di bawah postingan atau cara agar nama penulis bisa tercantum di bawah setiap posting blog.
Author Box di Bawah Postingan
Hallo sobat semua.. Bagaimana kabar kalian hari ini? Saya harap baik-baik saja :)
Pada kesempatan postingan kali ini, saya akan membahas artikel mengenai trik membuat author box di bawah setiap postingan blog. Memang banyak sekali elemen-elemen yang bisa disisipkan di bawah postingan blog, selain untuk mempercantik tampilan blog, elemen-elemen yang disisipkan di bawah postingan juga bisa meningkatkan kredibilitas blog di mata pengunjung. Selain author box, banyak hal lain yang bisa disisipkan disini, misalnya saja iklan. Baca: cara memasang iklan otomatis di bawah postingan. Oke, kembali ke permasalahan. Bagi siapa saja yang tertarik untuk memasang author box di bawah postingan blog, langsung saja berikut ini cara memberi identitas penulis di bawah postingan:
1. Login ke akun Blogger sobat.
2. Klik Template >> Edit HTML >> Lanjutkan (jangan lupa centang Expand Template Widget).
3. Cari kode ]]></b:skin> di template sobat.
4. Pastekan kode berikut tepat di atas kode nomor 3 tadi
.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. Next cari kode <div class='post-footer-line post-footer-line-1'> dan pastekan kode di bawah ini tepat di bawah kode tersebut
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='author-box'>
<p><img alt='avatar' class='avatar avatar-70 photo' height='70' src='URL Foto/Avatar Sobat' width='70'/><b>About Author</b><br/>
Sekilas tentang diri sobat<br/></p>
</div>
</b:if>
Ket: Ganti tulisan berwarna merah dengan URL foto/avatar yang sobat miliki dan ganti tulisan berwarna ungu dengan tulisan singkat mengenai deskripsi singkat diri sobat.
6. Simpan template sobat.

Source: http://www.amronbadriza.com/2012/10/cara-membuat-author-box-di-bawah.html#ixzz143vWW5xC

3 comments:

  1. Sip bos, saya coba dulu sob, jangan lupa kapan-kapan mampir sob..

    ReplyDelete
  2. ok boss, silahkan di coba .
    ntar ane mampir ke tempat mas imam

    ReplyDelete
  3. terima kasih untuk infonya min.

    ReplyDelete