Salam Blogging, Kali ini saya akan berbagi Cara Membuat Widget Profile Penulis Dibawah Postingan Blog. Widget Profle blogger memainkan peran penting di blog Anda ketika pengunjung Blog ingin melihat profile penulisnya. Dalam posting ini saya akan berbagi dengan Anda sebuah widget yang akan memungkinkan Anda untuk menampilkan biodata dan profile penulis di bawah posting seperti dalam gambar di atas. Langsung saja ke langkah langkahnya :
Editing
Kode Untuk Author Widget ( Profile Penulis )
1
Masuk ke Blogger > Template > Edit
Html
2
Sekarang cari ]]>
</ b: skin>
3
Lalu copy / Paste kode berikut tepat di atas ]]> </ b: skin>
CSS
/****Bloggingpasuruan
Widget Profile Blogger *****/
.
bloggingpasuruan-author-box {
background:
#f6e4db;
margin:
5px 0 20px 0;
padding:
12px;
border:
1px solid #e3e3e3;
border-radius:5px;
box-shadow:2px
2px 1px #e3e3e3;
overflow:
hidden;
color:
#3b3b3b;
font-size:
14px;
font-family:
Arial, Tahoma, Verdana;
line-height:
1.6em;
}
/****www.bloggingpasuruan.blogspot.com*****/
.
bloggingpasuruan-author-box p {
margin:
0px;
padding:
0px;
}
.
bloggingpasuruan-author-box img
{
background:
#FFFFFF;
float:
left;
margin:
0 10px 0 0;
padding:
5px;
border:
3px solid #e3e3e3;
}
4.
Simpan template.
5.
Bagian utama dilakukan, sekarang setiap kali Anda mempublikasikan posting tamu
cukup ikuti langkah-langkah sederhana ini diberikan di bawah ini untuk
menambahkan tamu penulis widget.
Cara Tambah Widget Profile Penulis dalam Blog Post?
1 Setelah menulis posting Anda masuk
ke bagian HTML dari posting blog Anda dengan mengklik HTML di samping Compose
sebagai menunjukkan pada gambar di bawah.
2 Sekarang paste kode berikut di akhir kode HTML (bawah html Tag terakhir dalam Bagian HTML)
HTML
<div
class=" bloggingpasuruan-author-box">
<img
alt="author-pic" height="85" src="IMG" width="85"
/> <strong>Tentang Profile Penulis</strong><br />Tulis disini
tentang profile Anda</div>
Keterangan :
Ganti
IMG dengan URL gambar foto Anda
Ubah
Tulisan warna HIJAU dengan “ kata kata profile tentang penulis ( tentang Anda )
Saran saran :
>>> Kode diatas akan Anda pastekan setiap anda melakukan posting ( tidak praktis ).
>>> Jika Anda ingin Widget tampil permanent di bawah posting BLOG silahkan ikuti petunjuk berikut ini :
1. Cari kode berikut tekan Ctrl-F agar lebih cepat dalam pencarian kodenya
<div class='post-body entry-content' expr:id='"post-body-" + data:post.id'>
2. Lihat dibawahnya ada kode <data:post.body/>
3.Pastekan kode berikut dibawah <data:post.body/>
Saran saran :
>>> Kode diatas akan Anda pastekan setiap anda melakukan posting ( tidak praktis ).
>>> Jika Anda ingin Widget tampil permanent di bawah posting BLOG silahkan ikuti petunjuk berikut ini :
1. Cari kode berikut tekan Ctrl-F agar lebih cepat dalam pencarian kodenya
<div class='post-body entry-content' expr:id='"post-body-" + data:post.id'>
2. Lihat dibawahnya ada kode <data:post.body/>
3.Pastekan kode berikut dibawah <data:post.body/>
HTML
<div
class=" bloggingpasuruan-author-box">
<img
alt="author-pic" height="85" src="IMG" width="85"
/> <strong>Tentang Profile Penulis</strong><br />Tulis disini
tentang profile Anda</div>
Jika Anda memiliki pertanyaan atau memiliki masalah menerapkan widget ini ke blog Anda memberikan komentar di bawah ini saya akan dengan senang hati membantu Anda.
Makasih Bos Tutorialnya
ReplyDeleteTerima kasih bos ...ijin coba dulu mudah mudahan berhasil
ReplyDeleteitu untuk admin apa penulis blog gan.
ReplyDeleteDaftar Yahoo Mail
kunjungan dimari http://harisiaqshal.blogspot.co.id
ReplyDeletekok gak bs ya?
ReplyDeletesaya tes dlu deh gan,,
ReplyDeletemapir ya , http://abuyblogs.blogspot.co.id/
Mantap masss
ReplyDeleteMantap masss
ReplyDeleteberhasil saya terapkan terimakasih banyak mas. salam Blogging
ReplyDeletejgn lupa mampir yak dedelw.blogspot.com
berhasil saya coba mas.. terima kasih tutorialnya....
ReplyDeletejangsigma.com
tak coba dulu gan
ReplyDeleteTerima kasih mas infonya, saya coba terapin. Semoga berhasil. http://www.blogmuhyusufa.id/
ReplyDeletejalal boro http://sobat-seo.blogspot.com
ReplyDeletenjirr
ReplyDeletetapi kalau pasang permanent gimana dengan penulis lain itu kode kan mesti masukin diskripsi profil sama gambar gmn tuh?
ReplyDeleteizin mencoba dulu kang..
ReplyDelete