English French German Spain Italian Dutch Russian Portuguese Japanese Korean Arabic Chinese Simplified

Minggu, 24 Juni 2012

Cara Membuat Kotak Admin Di Bawah Postingan Blogger

Banyak cara untuk membuat tampilan blog
menjadi lebih baik dan komunikatif. Salah satunya adalah dengan membuat/memasang kotakadmin 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. Sobat dapat melihat langsung contoh kotak admin (about author box) yang saya pasang dibawah
postingan blog ini sebagai demo-nya.


Cara Membuat Kotak Admin Di Blogspot :
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 == &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='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhsDQ7qimL3bUngEeATTjVtK4JEsAjfI81lFX_ALGseRUcHwJuIuS0w_4lQhF22JCT0hlSF-j40mx1ghn_fhkjPvmGnZ9yDQ_dLVtiYfeI1buYk15rQ9AhZ26Z5xVpIhe7YxuqiuD7-RI0/s220/profile.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://seputar-trick.blogspot.com/2012/06/cara-membuat-kotak-admin-di-bawah.html'><small><button>:: Get this widget ! ::</button></small></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.
Cara Membuat Kotak Admin Di Bawah Postingan Blogger 9out of 10 based on 10 ratings. 9 user reviews.

Ditulis Oleh : Unknown Admin Tempat Berbagi Ilmu Untuk Sesama

Artikel Cara Membuat Kotak Admin Di Bawah Postingan Blogger Ini Diposting Oleh Unknown Pada Hari Minggu, 24 Juni 2012. Terimakasih atas kunjungan Anda Serta Kesediaan Anda Membaca Artikel Ini. Kritik dan Saran Dapat Anda Sampaikan Melalui Kotak Komentar.

Comments
1 Comments

1 komentar

Anonim

wew gan Izin Berkunjung dan Mencoba Tutorialnya Mantap nih .. :D

Posting Komentar

Sebelum dan sesudahnya saya ucapkan ribuan terimakasih kepada kalian yang telah berkunjung maupun berkomentar di blog saya ini.

Bagi Sobat yang ingin berkomentar tentang blog atau postingan saya,mohon jangan membuat SPAM