Kadang perlu juga menampilkan informasi mengenai penulis atau pemilik blog. Misalnya pada setiap akhir postingan, di situ terdapat informasi mengenai pengarang atau yang sering disebut sebagai Author Box. Berikut cara membuat author box ini.
1. Login ke Blogger.
2. Masuk ke Edit HTML, centang box "Expand Template Widget".
3. Backup dulu templatenya biar aman.
4. Letakkan kode-kode yang tertera di bawah ini tepat di atas kode ]]></b:skin> :
5. Simpan perubahan, kemudian cari kode berikut:
6. Letakkan kode berikut ini di bawah kode pada no. 5 di atas.
7. Simpan template dan lihat hasilnya.
Selamat mencoba...
1. Login ke Blogger.
2. Masuk ke Edit HTML, centang box "Expand Template Widget".
3. Backup dulu templatenya biar aman.
4. Letakkan kode-kode yang tertera di bawah ini tepat di atas kode ]]></b:skin> :
.author_info {
float: right;
width: 573px;
padding: 10px;
border: 1px solid #e0e0e0;
margin-bottom: 15px;
margin-top: 15px;
background: #eee;
}
.author_info h3 {
margin-bottom: 10px;
}
.author_photo {
float: left;
margin: 0 0 0 10px;
}
.author_photo img {
margin-right: 10px;
border: 1px solid #e0e0e0;
}
float: right;
width: 573px;
padding: 10px;
border: 1px solid #e0e0e0;
margin-bottom: 15px;
margin-top: 15px;
background: #eee;
}
.author_info h3 {
margin-bottom: 10px;
}
.author_photo {
float: left;
margin: 0 0 0 10px;
}
.author_photo img {
margin-right: 10px;
border: 1px solid #e0e0e0;
}
5. Simpan perubahan, kemudian cari kode berikut:
<div class='post-footer-line post-footer-line-1'>
6. Letakkan kode berikut ini di bawah kode pada no. 5 di atas.
<b:if cond='data:blog.pageType == "item"'><div class='author_info'><div class='author_photo'><img alt='author' src='http://linkfotomu'/></div><h3>About the Author</h3>Artikel ini ditulis oleh: <a href='http://blogger.com/profile/1234567' target='_blank'><b>Namamu</b></a> - yang telah menulis pula beberapa artikel untuk <a href='http://contoh.blogspot.com/' target='_blank'>situsmu.</a> Saya hanya seorang yang baik hati, tidak sombong dan rajin pula menabung di warung :). Ingin tahu lebih dekat dengannya? silahkan hubungi melalui <a href='http://facebook.com/namamu' target='_blank'>Facebook</a> atau boleh pula melalui <a href='emailmu'>email</a><br></br>namamu's <a href='http://namamu.blogspot.com' target='_blank'>Blog</a><br style='clear:both;'/></div></b:if>
7. Simpan template dan lihat hasilnya.
Selamat mencoba...
0 comments:
Posting Komentar