Pada blog biasanya terdapat author box, kali ini saya akan membahas cara membuat author box pada blog. Script author box ini cukup sederhana namun cukup lumayan berwarna :D

Langsung saja untuk cara pemasangannya, seperti biasa anda login pada blogger anda lalu masuk ke "rancangan" lalu pilih "edit entri" dan cari kode ]]></b:skin> dan letakkan script css di bawah ini di atas kode ]]></b:skin>

#author h1{
font:bold 32px 'Showcard Gothic',Arial,Sans-Serif;
margin:0 10px;
color:#000;
text-shadow:0 1px 0px rgba(255,255,255,0.4);
position:relative;
-webkit-animation:slow 5s;
-moz-animation:slow 5s;
-ms-animation:slow 5s;
animation:slow 5s;
-webkit-box-shadow:5 10px 10px rgba(1,0,0,0.10);
-moz-box-shadow:5 15px 10px rgba(1,0,0,0.10);
box-shadow:5 5px 11px rgba(1,0,0,0.10);
}
#author .deskripsi{
margin:5px 5px 5px 5px;
padding:8px;
background:#F6EEAB;
background:-webkit-linear-gradient(top, #FFFFFF, #25F);
background:-moz-linear-gradient(top, ##FFFFFF, #25F);
background:-ms-linear-gradient(top, #FFFFFF, #25F);
background:-o-linear-gradient(top, #FFFFFF, #25F);
background:linear-gradient(top, #FFFFFF, #25F);
border:3px solid #DCC56C;
-webkit-box-shadow:3 10px 10px rgba(0,0,0,0.4);
-moz-box-shadow:3 15px 10px rgba(0,0,0,0.4);
box-shadow:3 5px 11px rgba(0,0,0,0.4);
-webkit-border-radius:12px;
-moz-border-radius:12px;
border-radius:10px;
position:relative;
z-index:10;
-webkit-animation:slow 3s;
-moz-animation:slow 3s;
-ms-animation:slow 3s;
animation:slow 3s;
border-color:#26a  ;
}
#author .deskripsi:before{
content:"";
width:0px;
height:0px;
border-width:15px;
border-style:solid;
border-color:#6e0 transparent transparent transparent;
position:absolute;
top:102%;
left:18px;
z-index:-50;
}
#box:after{
width:0px;
height:0px;
border-width:10px;
border-style:solid;
border-color:#F6EEAB transparent transparent transparent;
position:absolute;
top:100%;
left:21px;
}

Lalu untuk cara pemanggilannya pada Elemen Laman => Klik Tambah Gadget => Pilih Form HTML/javascript dan letakkan kode di bawah ini di formulirnya

<div id="author">
<h1>
Author Box</h1>
<div class="deskripsi">
<b>Mire Tahu Tempe</b>
Author Box
Author: Bayu Handono 
Download this project on <a href="http://miretahutempe.blogspot.com/">Mire 
Tahu Tempe</a></div>
</div>

Lalu klik simpan. Selesai.
Untuk Demonya anda bisa lihat di bawah ini

Author Box

Mire Tahu Tempe
Author Box
Author: Bayu Handono
Download this project on Mire
Tahu Tempe