Untuk memasang sebuah kotak admin yang biasanya disertakan dengan beberapa keterangan bisa dilakukan dengan sedikit editing di templete blog anda. Adapun langkah-langkahnya adalah sebagai berikut:
- Login ke dashboard blogger anda.
- Pilih Rancangan >> Edit HTML, centang Expand template widget.
- Cari kode <div class=post-footer> pada template.
- Pastekan script dibawah ini tepat di atas kode <div class=post-footer>
<!-- 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=’URL foto 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 dan 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://cob22.blogspot.com/2012/08/cara-membuat-kotak-admin-dibawah.html target=_blank>:: Get this widget ! ::</a></span></p>
<div style=clear:both;/>
</div>
</div>
</b:if>
<!-- Kotak Admin -->
- Kemudian cari lagi kode ]]></b:skin> pada template sobat.
- Pastekan kode CSS dibawah ini tepat diatas kode ]]></b:skin>.
- Atau pastekan kode CSS tersebut tepat dibawah 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;
}Kemudian save dan lihat hasilnya.
Selamat Mencoba, Good Luck :)
0 comments:
Post a Comment