NO IMAGE AVAILABLE

Feb 18, 2012

Cara Membuat Kotak Admin Selalu berada di bawah postingan blog

0 komentar
Ribuan trik dan tips blogger banyak bertebaran di dunia maya guna mempercantik bahkan mengoptimalkan sebuah layanan web blog. Sebagian besarnya adalah cara Cara Membuat Kotak Admin Selalu berada di bawah postingan blog. Ini biasanya digunakan seorang admin untuk menyampaikan ucapan-ucapan terima kasih atau kata-kata mutiara di setiap akhir postingan.

Banyak kawan-kawan yang memang sudah memiliki pertanyaan tentang trik dan tips ini dan begitupun saya yang tak sengaja menemukan trik dan tips Cara Membuat Kotak Admin Selalu berada di bawah postingan blog .

Kali ini saya akan mencoba mengajarkan juga kepada para pembaca tentang trik dan tips yang ini. Caranya sangat mudah namun sebaiknya kawan-kawan memperhatikan langkah demi langkahnya agar tidak tersesat di jalan ya. hehehehe...

1. Silahkan login ke blogger kalian masing-masing
2. Pilih Rancangan > Edit HTML
3. Berikan centang pada Expand Template Widget
4. Silahkan cari script berikut (gunakan bantuan CTRL+F untuk mempermudah pencarian)
<div class='post-footer'>
5. Copy-paste scipt kotak admin di bawah ini tepat setelah kode di atas
<!-- 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='http://4.bp.blogspot.com/-aJGLVA8QmCA/TkFsqEXMgKI/AAAAAAAAAPg/naQPOENy01E/s220/AVATAR%2BKU-128.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://idris-dehidrasi.blogspot.com/2012/02/cara-membuat-kotak-admin-selalu-berada.html' target='_blank'>:: Get this widget ! ::</a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Kotak Admin -->
6. Setelh itu, silahkan cari kode berikut  ]]></b:skin> pada template kawan-kawan
7. Letakkan kode di bawah ini tepat sebelum kode di atas tadi pada nomor 6.
.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;
}
8. Silahkan ganti text yang berwarna merah untuk merubah deskripsi blog dan URL gambar kawan-kawan.
9. Untuk Jenis font, warna background dan bahkan border pun bisa kawan-kawan ganti sesuai dengan keinginan sendiri
10. Silahkan Preview terlebih dahulu untuk melihat sejenak dan hingga scipt berjalan sesuai mestinya dan dirasa cukup, silahkan klik Save/simpan.

Post a Comment


Mohon tinggalkan komentar anda di sini!
Mohon jangan lakukan spamming!
Terima kasih atas kerja samanya!