Banyak cara untuk membuat tampilan blog menjadi lebih baik dan
komunikatif. Salah satunya adalah denganmembuat/memasang kotak admin
dibawah postingan yang berisikan keterangan dari Penulis/Author blog
tersebut tentang artikel yang ditulisnya. Ulasan yang dibuat di kotak
keterangan dari admin (penulis/author) ini terserah pada kreasi
masing-masing. Sobat blogger bisa juga menuliskan kata-kata lucu
didalamnya. Yang jelas untuk link nama penulis/author, judul posting dan
tanggal publish postingan sudah saya sertakan dalam script widget kotak
admin ini, sehingga sobat tidak perlu lagi mengisikan linknya secara
manual. dari pada sobat gak sabar mendingan langsung aja yah simak
cara membuat kotak admin di bawah postingan blogger di bawah ini :
1. Login ke dashboard blogger anda.
2. Pilih Rancangan >> Edit HTML, centang Expand template widget.
3. Cari kode <div class='post-footer'> pada template.
4. Copy script kotak admin dibawah ini dan paste 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='http://www.fileden.com/files/2012/9/22/3350134/428914_107386852739089_2146406850_n.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://joise-abu.blogspot.com/p/cara-membuat-kotak-admin-dibawah.html'
target='_blank'>:: Get this widget !
::</a></span></p>
<div style='clear:both;'/>
</div>
</div>
</b:if>
<!-- Kotak Admin -->
5. Kemudian cari lagi kode ]]></b:skin> pada template sobat.
6. Copy kode CSS dibawah ini dan paste tepat diatas kode
]]></b:skin>. Jika gagal sobat dapat juga meletakkan kode CSS tadi 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; }
7. Silahkan ganti link URL gambar profil yang berwarna merah dengan
link gambar profil sobat. Jika sobat ingin menuliskan dengan kata-kata
ulasan yang lain, ganti/edit dulu kata-kata ulasannya di notepad.
8. Untuk jenis font, warna background dan border juga dapat sobat ganti/edit sesuai keinginan.
9. Preview dulu hasil kotak admin yang dibuat. Jika editing sudah dirasa cukup, Save/Simpan template anda.
Nah sekarang kotak admin yang keren sudah nampang dibawah postingan sobat. Ayo tuangkan ide kreasi kamu untuk
membuat kotak admin dibawah postingan blog biar sobat jadi tuambah keren lagi.
Sekian dari saya.... " Salam Blogger "..!!!
