Cara Membuat Kotak Tentang Penulis/Author Box di Blog

HAIIIIII !!

Baru aja tadi aku nge post tentang Cara Membuat Open New Tab Semua Link Di Blog

Nah, sekarang mau share ilmu lagi nih. Itung-itung kan buat pahala

Nah, Kalian tau kan ada beberapa blog yang di bawah postingan di tulis :

"About The Autor, blablabla" Gak mudeng ya? Oke ini saya kasih pict nya

Klik Zoom aja kalau mau diperbesar yaaa 

Nah, penasaran? Mau membuatnya juga? Okee ikutin dengan teliti yaaa!

1. Masuk Ke akun blog kalian

2. Klik Rancangan -> Edit HTML -> Lanjutkan -> Centang Expand Template Widget

3. Copas Kode Berikut dan Letakkan di ATAS kode <div class='post-footer'>

<!-- Kotak Admin -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEj96an30zMps0HOZIjOkUFVzBh31YNvHFkY038qMp1vg1OOusjPoUFVPdAH2jXB_bMwt1Y1ixkCziKL6BEKuhB1cmenhyphenhyphenbKSl48LpMVthk3w8nW77vnzxGxWD8NE7jad_RLeMzk7JKB0GQ/s124/SP_A4083.jpg'/>
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 serta kesediaan Anda membaca artikel ini. Kritik dan saran dapat anda sampaikan melalui kotak komentar.
<p><span style='float:right;font:italic 10px Arial, Sans-Serif;'><a href=' http://websitepunyague.blogspot.com/2012/09/cara-membuat-kotak-tentang.html ' target='_blank'>:: Buat Widget Seperti Ini ::</a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Kotak Admin -->

4. Kemudian Cari kode ]]></b:skin>

5. Copas Kode Berikut DIATAS kode ]]></b:skin>

.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;
}

5. Klik Save, dan Lihat .

Penjelasan :

- Tulisan Warna Kuning Anda Isi dengan Deskripsi Blog anda

- Tulisan Warna Biru Anda ganti dengan URL Foto anda

- Tulisan Warna Merah bisa anda Edit sesuka hati anda


Nah, gampang kan?
Okeee segitu dulu yaaa, Salam Bloggers

Related Posts