Cara Membuat Kotak Author dibawah Postingan Blogspot

Monday 9 December 2013

Jika masih jadi pertanyaan bagi anda apa itu kotak author(author box) dan bagaimana cara memasangnya dibawah posting blog. Kotak author(author box) merupakan sebuah widget yang mendiskripsikan kehidupan seorang admin atau juga riwayat hidup admin blog yang berfungsi untuk memperkenalkan diri admin kepada pengunjung blog. Adapun cara Membuat Kotak Author dibawah Postingan Blog yaitu dengan langkah sederhana sebagai berikut:

cari kode ]]></b:skin> kemudian copy code dibawah ini

.admin-tulisan{ display:block; width:auto; background:#FFFFFF; border:2px solid #F5FFFA; box-shadow:0 1px 3px #000;-moz-box-shadow:0 1px 3px #000;-webkit-box-shadow:0 1px 3px #000; padding:0; margin:30px 0 10px 0; font:normal 12px Arial, Sans-Serif; color:#222; } .admin-tulisan .kontainer{padding:5px;} .admin-tulisan h4{ background:#9ACD32; border:none; border-bottom:1px solid #D3D3D3; color:#fff; text-transform:normal; text-shadow:0 1px 0 rgba(0, 0, 0, 0.4); font:bold 12px Arial,Sans-Serif; padding:5px 10px; margin:0 0 0 0; display:block; } .admin-tulisan h4 a{color:#FF100%0;} .admin-tulisan img{ width:70px; height:70px; margin:0 10px 0 0; float:left; border:1px solid #954B02; padding:2px; background:#C36702; box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none; }

kemudian paste tepat di atas kode ]]></b:skin>

2. cari kode <data:post.body/> biasanya kode seperti ini ada 2 atau lebih sesuai tampil yang dipakai, namun disini saya menempatkannya pada <data:post.body/> yang nomor 2(dua); paste kode dibawah ini tepat di bawah kode<data:post.body/>

.admin-tulisan{

display:block;

width:auto;

background:#CFE2E0;

border:2px solid #fff;

box-shadow:0 1px 3px #000;-moz-box-shadow:0 1px 3px #000;-webkit-box-shadow:0 1px 3px #000;

padding:0;

margin:30px 0 10px 0;

font:normal 12px Arial, Sans-Serif;

color:#222;

}

.admin-tulisan .kontainer{padding:5px;}

.admin-tulisan h4{

background:#8A9C04;

border:none;

border-bottom:1px solid #699019;

color:#fff;

text-transform:normal;

text-shadow:0 1px 0 rgba(0, 0, 0, 0.4);

font:bold 12px Arial,Sans-Serif;

padding:5px 10px;

margin:0 0 0 0;

display:block;

}

.admin-tulisan h4 a{color:#FEEA83;}

.admin-tulisan img{

width:70px;

height:70px;

margin:0 10px 0 0;

float:left;

border:1px solid #954B02;

padding:2px;

background:#C36702;

box-shadow:none;-moz-box-shadow:none;-webkit-box-shadow:none;

}