Membuat Kotak Admin di Bawah Postingan Blog
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 == "item"'>
<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 -->
- Ganti tulisan berwarna Merah dengan URL foto sobat atau URL gambar yang sobat kehendaki.
- langkah terakhir tinggal Save/Simpan Template
0 komentar: