Cara Membuat Profil Admin Dibawah Postingan Blog

Diposting oleh John Holongky Sinaga on Selasa, 10 Juli 2012
Hallo sobat devilz !!!
sekarang saya akan share artikel tentang Cara Membuat Profil Admin Dibawah Postingan Blog !!!

oke kita langsung aja ya !!!

1. login ke Mas Blogger
2. masuk ke dashboard >> Rancangan >>> Edit HTML >>> sobat devilz jgn lupa centang Expand Widget nya !!!


3. lalu sobat devilz cari kode <div class='post-footer'>
Salin kode di bawah ini , kemudian letakkan tepat di atas kode <div class='post-footer'>

<!-- Profil Admin -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='admin-penulis'>
<h4>Ditulis Oleh : <a expr:href='data:blog.homepageUrl'><b><data:post.author/></b></a></h4>
<div class='kontainer'>
<img src='http://4.bp.blogspot.com/_VRwISTiabbk/TUPGgYerH2I/AAAAAAAAAwU/kgqbN-jgWw4/s1600/favicon.png'/>
Artikel <a expr:href='data:post.url'><i><data:post.title/></i></a> ini ditulis oleh <b><data:post.author/></b> pada hari <i><data:post.dateHeader/></i>. Terimakasih atas kunjungan Anda pada blog ini. Kritik dan saran tentang <b><data:post.title/></b> dapat Anda sampaikan melalui kotak komentar dibawah ini.
<p><span style='float:right;font:italic 10px Arial, Sans-Serif;'><a href='http://www.wakrizki.net/2012/02/cara-membuat-profil-admin-dibawah.html' target='_blank'>:: Get this widget ! ::</a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Profil Admin -->


4. kemudian sobat devilz cari kode ]]></b:skin> pada template sobat. Kemudian copy kode CSS dibawah ini dan paste tepat diatas kode ]]></b:skin>, Jika gagal sobat bisa juga meletakkan kode CSS ini tepat dibawah kode <data:post.body/>

.admin-penulis {
display:block;
width:auto;
background:#defdef;
padding:0;
margin:30px 0 10px 0;
font:normal 12px Arial, Sans-Serif;
color:#222;
border:2px solid #fff;
box-shadow:0 1px 3px #000;
-moz-box-shadow:0 1px 3px #000;
-webkit-box-shadow:0 1px 3px #000;
}

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

.admin-penulis h4 {
background:#699019;
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-penulis h4 a {
color:#FEEA83;
}

.admin-penulis img {
width:70px;
height:70px;
margin:0 10px 0 0;
float:left;
border:1px solid #954B02;
padding:2px;
background:#ffffff;
box-shadow:none;
-moz-box-shadow:none;
-webkit-box-shadow:none;
}


5. dan yg trakhir sobat simpan dah template nya !!!
selamat mencoba !!!

{ 0 komentar... read them below if any or add comment }

Posting Komentar

 
FASTSEO - SEO Friendly Blogger Template Design by Tutorial SEO Blogspot