Cara Memasang Wordpress Style Author Bio Pada Blogger

Sebelum saya jelaskan bagaimana cara membuat author bio tersebut, bagi anda yang belum tahu bagaimana bentuk dari author bio itu sendiri anda bisa lihat di bawah postingan ini. Sebenarnya widget ini di adobsi dari widget yang ada pada blog wordpress . Seperti yang kita ketahui bersama wordpress kaya akan plug in yang bagus dan gratis. Namun bagi anda yang menggunakan blogspot juga bisa menggunakan author bio layaknya blog wordpress. Makanya jangan kecewa dulu dong, Kali ini Klobot [Dot] Com mencoba memberikan tutorialnya kepada anda semua pengunjung setia Klobot [Dot] Com

Okey , sekarang kita lanjutkan dengan cara memasang widget tersebut tepat berada di bawah postingan blog anda.



Login ke dashboard blogger anda

>> Pilih design
>> Klik Edit HTML
>> Centang Expand Widget Templates

Kemudian cari kode di bawah ini :

]]></b:skin>

Untuk mempermudah pencarian , tekan F3 pada keyboard anda / Ctrl+F, copy kode diatas dan pastekan pada kotak pencarian tersebut

Setelah ketemu , Copy kode di bawah ini dan pastekan persis diatas kode tersebut dan klik simpan / Save

.authbio{
color: #666;
font-weight: normal;
font-size:12px;
background: #fff;
border: 1px solid #ccc;
width: auto;
padding: 15px;
margin-bottom:15px;

}
.biotitle h2 {
font-weight: bold;
color: #666;
padding: 15px;
margin-bottom:15px;
font-size:36px;
}

}
img.alignleft {
float:right;
background-color: #c4e3e0;
border:1px solid #c4e3e0;
padding: 5px;

margin-left:2px;
margin-top:20px;
margin-bottom:0px;
margin-right:12px;

}

Langkah selanjutnya cari kode di bawah ini , cara mencarinya sama seperti cara diatas.

<data:post.body/>

Setelah ketemu , copy kode dibawah ini dan pastekan di bawahnya

<div class='authbio'>
<div style='float: left;'>
<img alt='' src='https://sites.google.com/site/imgklobot/data/oscarauthorbio.jpg'/>
</div>
<h2>
Author Klobot [Dot] Com</h2>
OSCAR RIDHWAN adalah seorang karyawan perusahaan BUMN yang ada di kota Gresik - Jawa Timur. Mempunyai hobi menulis dan saat ini ingin sharing pengetahuannya melalui <a href='http://www.klobot.com/'>Klobot [Dot] Com</a>. Untuk mengenalnya lebih jauh , silahkan add sebagai teman anda melalui <a href='http://www.facebook.com/people/Oscar-Ridhwan-Khusaini/1770469470'>Facebook
 </a>atau anda bisa mengirim sebuah <a href='mailto:oscarridhwan@klobot.com'>Email.</a><br style='clear:both;'/>
</div>

Ganti tulisan yang berwarna merah diatas dengan kata- kata anda sendiri.
Masukkan link photo anda ukuran 75 X 75 pixel ( replace link ini https://sites.google.com/site/imgklobot/data/oscarauthorbio.jpg ) dan tulis biografi pendek anda. Untuk lebih jelasnya silahkan lihat pada gambar dibawah ini.

Setelah semuanya selesai klik preview template anda, jika tidak ada pesan error pada saat preview tersebut langkah terakhirnya adalah simpan template blog anda.

Lihat hasilnya sekarang, apabila anda menggunakan auto readmore maka anda harus membuka dulu salah satu artikel yang ada di blog anda tersebut.

Selamat mencoba ...