Cara menambahkan kotak profil / about us yang tampil di bawah postingan Anda. Memasang widget ini hanyalah pelengkap saja atau sebagai aksesoris tambahan blog agar semakin baik. Pengunjung juga akan lebih kenal dengan nama, moto, deskripsi profil Anda yang muncul di bawah postingan Anda. Tampilan widget ini cukup sederhana dengan text dan gambar berukuran kecil.
Caranya sebagai berikut:
- Login ke Blogger Dashboard -- Template - Edit HTML
- Centang Expand Template Widget
- Gunakan ctrl-f dan letakan css berikut sebelum kode ]]><b:skin>
.author-box {
background: #fff;
margin: 10px 0 40px 0;
padding: 10px;
border: 1px solid #E6E6E6;
overflow: auto;
}
.author-box p {
margin: 0;
padding: 0;
}
.author-box img {
background: #FFFFFF;
float: left;
margin: 0 10px 0 0;
padding: 2px;
border: 1px solid #E6E6E6;
}
Catatan : Untuk kode berwarna biru adalah warna latar belakang,
warna border. Silahkan sesuaikan warna tersebut agar serasi dengan
tampilan blog. Agar lebih mudah cari kode warna
- Kemudian letakan kode berikut setelah kode <data:post.body/>
<b:if cond='data:blog.pageType == "item"'> <div class='author-box'> <p><img alt='' class='avatar avatar-70 photo' height='70' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgcIZtmNhs9BwAeIdDWlhb6CwOWAxZibbkKxYuFvZu3-7LeH5okExcorgQWOLBlpSVh-_qrq5XkDJhK60bSmzSpXqn1JWHF_J1I3dqd-PQFKRKy2lUPkxcj4g9Acy2m5-N_TjDT00SWPXI/s220/lgbig.png' width='70'/><b>About the Author</b><br/> <div style='text-align: justify; font-family: verdana; color: #000;'>Lorem ipsum brute utinam nominati vel ut, te vis liber aliquid. Te vis vide dolores erroribus. Debitis dolorem eu pro, semper mollis dissentiunt nam at. Regione molestie dissentiet sit te. Has cetero indoctum posidonium et, dissentiunt deterruisset pro an.<br/> </div> </p> </div> </b:if>
- Tahap akhir, Simpan Template.
