Cara Membuat Kotak Admin di Blogger

Cara Membuat Kotak Admin di Blogger yang Terletak Pada Bagian Bawah Postingan - Ada begitu banyak cara agar blog yang kita buat terlihat menarik dimata pengunjung, dan salah satunya adalah dengan memasang kotak admin/author yang biasanya terletak dibawah postingan , kotak admin sendiri biasanya berisi keterangan maupun ulasan singkat dari penulis, dalam kotak admin tersebut biasanya juga akan ditampilkan judul posting yang sedang dibaca oleh pengunjung .

Pada kesempatan kali ini saya ingin sedikit berbagi informasi dengan sobat lagi belajar ngeblog tentang cara Pasang kotak author/admin dalam blogspot
Sebelumnya , contoh kotak admin (about author box) sendiri seperti yang ditampilkan pada gambar dibawah ini.

Untuk Cara memasang widget kotak author tersebut pada blog anda berikut adalah langkah-langkahnya

Cara Pasang Kotak Admin di Blog

* Cara-nya Pertama Login ke akun blogger milik anda
* Pada halaman Dashboard , Pilih Rancangan , Pilih Edit HTML (jangan lp centang Expand Template Widget )
* Jika sudah Cari kode <div class='post-footer'> (gunakan ctrl+f untuk mempercepat proses pencarian).
* Jika kode <div class='post-footer'> tersebut sudah anda temukan langkah selanjutnya adalah copy kode dibawah ini, dan tempatkan/pastekan tepat diatas kode tersebut.

<!-- 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 height='80' src='URL Gambar Anda' width='75'/>

Anda sedang membaca sebuah artikel yang berjudul <b><a expr:href='data:post.url'><data:post.title/></a></b>,, Terimakasih atas kunjungan Anda serta kesediaan Anda untuk membaca artikel Diatas. Semoga artikel tersebut bermanfaat untuk anda .... <p><span style='float:right;font:italic 10px Arial, Sans-Serif;'><a href='http://ardiyantobay.blogspot.com/2012/02/cara-membuat-kotak-admin-di-blogger.html' target='_blank'>:: Get this widget ! ::</a></span></p>

<div style='clear:both;'/>

</div>

</div>

</b:if>

<!-- Kotak Admin -->

Ganti kode berwarna hitam dengan deskripsi anda, ganti kode berwarna hijau dengan URL gambar milik anda, ganti kode berwarna merah sesuai dengan keinginan anda

* Langkah selanjutnya cari kode ]]></b:skin> , jika kode tersebut sudah anda temukan, lalu copy kode CSS berikut ini dan tempatkan/pastekan tepat di atas kode tersebut

.admin-tulisan{

display:block;

width:auto;

background:#E6E6FA;

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:#000000;

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;

}

* Terakhir Simpan dan lihat hasilnya

Untuk jenis font tulisan, warna background dan border dan juga gambar bisa anda edit dan sesuaikan dengan keinginan anda
Thanks to: rayhanzhampiet
Terima kasih dan semoga artikel tentang Cara Membuat atau memasang Kotak Admin di Blog Tersebut bermanfaat untuk anda
Selamat Mencoba ^_^

Jangan Lupa baca juga yang ini ya
Cara Membuat Newsticker Pada Blog
Trik Cara Membuat Rating Bintang Pada Blog

Rating: 4.5