Cara Membuat Kotak Author Di Blog ~ Bithoo

Cara Membuat Kotak Admin, atau Author, Selamat Pagi gimana kabar nya di weekend ini..? Apa masih semangat blogging, atau pengen liburan dulu.. ? hehehe.... Kali ini saya mau berbagi bagaimana cara nya Membuat Author Di Bawah Posting Blog, Seperti contoh punya saya sob. Dan bagaimana gan cara nya..? hehehe.

Berikut cara nya sobat Bithoo.. :

Lalu pilih Rancangan ==> Edit HTML, jangan lupa centang Expand Template Widget ya..?

Langkah selanjut nya , anda cari kode : <div class='post-footer'> atau <div class='post-footer-line post-footer-line-1'> menggunakan CTRL + F biar lebih mudah.

Lalu Copy & Paste Kode di bawah ini, letakkan tepat di atas kode : <div class='post-footer'> atau <div class='post-footer-line post-footer-line-1'>

<!-- Kotak Admin -->
<b:if cond='data:blog.pageType == "item"'>
<div class='admin-tulisan'>
<h4>Ditulis Oleh : <a expr:href='data:blog.homepageUrl'><data:post.author/></a>Deskripsi Blog Anda</h4>
<div class='kontainer'>
<img src='Alamat URL Gambar Anda'/>
Artikel <a expr:href='data:post.url'><data:post.title/></a> ini diposting oleh <data:post.author/> pada hari <data:post.dateHeader/>. Terimakasih atas kunjungan Anda yang telah membaca artikel ini, semoga bermanfaat untuk kita semua, Kritik dan saran nya, silahkan tulis di kotak Komentar di bawah ini :.
<p><span style='float:right;font:italic 10px Arial, Sans-Serif;'><a href='http://bithoo.blogspot.com'>::get this widget:: </a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Kotak Admin -->

Catatan :

~ Tulisan Deskripsi Blog Anda, Ganti dengan deskripsi blog sobat Bithoo

~ Tulisan Alamat URL Gambar Anda, Ganti dengan gambar yang ingin di tampilkan dalam Author

Langkah Selanjutnya adalah cari kode : ]]></b:skin> pada template anda.

Lalu anda Copy & Paste Kode di bawah ini, tepat di atas kode : ]]></b:skin>

.admin-tulisan{

display:block;

width:auto;

background:#33CC33;

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;

}