Membuat Kotak Admin di Bawah Postingan Blog

12:09 AM Muhammad adil 0 Comments

Dalam rangka memperlengkap artikel di Blog ini, kali ini saya akan berbagi Tutorial blog tepatnya yaitu Cara Membuat Kotak Admin di Bawah Postingan Blog, mungkin Tutorial ini sudah banyak berkelimangan di internet yang disebarkan oleh para Blogger, tapi tidak ada salahnya juga kan kalo saya berbagi tutorial yang satu ini. Kotak admin ini sangat bermanfaat untuk Blog kita, selain untuk mempercantik tampilan Blog kita, kotak admin ini juga katanya sih merupakan SEO untuk Blog kita. Oke deh untuk lebih jelasnya silahkan lihat gambar dibawah :
Untuk sahabat yang pengen Kotak Admin ini silahkan ikuti langkah langkah Membuat Kotak Admin di Bawah Postingan Blog :

• Seperti biasa masuk ke akun Blogger masing-masing
• Masuk ke menu Rancangan -> Edit HTML
• Beri centang pada kotak "Expand Widgets Templates"
• Carilah kode  ]]></b:skin>
• Kalo sudah ketemu, simpan Script dibawah ini tepat di atas kode  ]]></b:skin>

.kotak-admin{display:block; width:auto; background:url(http://lh6.ggpht.com/_pt7i0nbIOCY/TKaGCrdlU1I/AAAAAAAAC2w/WRdSIMpiTiY/bgh3_thumb%5B1%5D.jpg); 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;}
.kotak-admin .kontainer-admin{padding:5px;}
.kotak-admin h4{background:url(http://lh6.ggpht.com/_pt7i0nbIOCY/TKaGCrdlU1I/AAAAAAAAC2w/WRdSIMpiTiY/bgh3_thumb%5B1%5D.jpg);border:none;border-bottom:1px solid #699019;color:#000;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;}
.kotak-admin h4 a{color:#222;}
.kotak-admin 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 cari kode yang mirip dengan kode berikut  <div class='post-footer'>
• Kalo sudah ketemu silahkan simpan kode berikut di atas kode <div class='post-footer'>

<!-- Kotak Admin -->
<b:if cond='data:blog.pageType == &quot;item&quot;'>
<div class='kotak-admin'>
<h4>Penulis: <a expr:href='data:blog.homepageUrl'><data:post.author/></a> ~ Tutorial Blog | Tips Trick | Jejaring Sosial</h4>
<div class='kontainer-admin'>
<img src='http://4.bp.blogspot.com/-F5Oqv_IIc74/T1TsRLcXUqI/AAAAAAAAAN4/PXYShb2KjC4/s200/efek+salju+pada+blog.jpg'/>
Artikel <a expr:href='data:post.url'><data:post.title/></a> ini dipublish oleh <data:post.author/> pada hari <data:post.dateHeader/><br/>Terima kasih Anda telah membaca artikel tentang <strong><u><data:blog.pageName/></u></strong> , Anda boleh menyebar luaskannya atau mengcopy paste-nya jika artikel <strong><data:blog.pageName/></strong> ini sangat bermanfaat bagi Blog dan teman-teman anda, namun jangan lupa untuk meletakkan link <u><a expr:href='data:post.url'><data:blog.pageName/></a></u> sebagai sumbernya. Semoga artikel ini bermanfaat dan menambah wawasan kita semua. Jika anda menyukai Blog ini, silahkan like di facebook dan follow kami di twitter. Terima kasih atas kunjungan serta kesediaan Anda membaca dan berkomentar tentang artikel ini.
<p><span style='float:right;font:italic 10px Arial, Sans-Serif;'><a href='http://adilcyber.blogspot.com/2012/11/membuat-kotak-admin-di-bawah-postingan.html' target='_blank' title='Get this widget !'>:: Get this widget ! ::</a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Kotak Admin -->