Cara Membuat Kotak Admin di Blogger yang Terletak Pada Bagian Bawah Postingan

dalam kotak admin tersebut biasanya juga akan ditampilkan judul posting yang sedang dibaca oleh pengunjung . contoh kotak admin (about author box) sendiri seperti yang ditampilkan pada gambar dibawah ini.


llangkah-langkahnya
Cara Pasang Kotak Admin di Blog :


Cari kode : <div class='post-footer'>
Jika sudah selanjutnya copy kode dibawah ini, dan pastekan tepat diatas 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> ~ Newbie Was Here</h4>
<div class='kontainer'>
<img height='80' src='https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZRUIM-1EFcG4EdTGeo6rMSIOVo6vVaLnkOF61NTSLSkZZdadkq-ntqYmM-NeqcfGqHEP_640UmhE0ClDw4eZFk7nNUKl3h-g4euGe8bxh015L_OfoGgToz51wjWg5nynCbUlKPg6HYkdf/s320/313503_301632559848558_100000054482640_1367104_1041886808_n.jpg' 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 ....
<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

selanjutnya cari kode : ]]></b:skin>
lalu copy kode CSS di bawah ini dan pastekan di atas kode ]]></b:skin>

.admin-tulisan{
    display:block;
    width:auto;
    background:#666666;
    border:2px solid #000000;
    box-shadow:0 1px 3px #000000;-moz-box-shadow:0 1px 3px #000000;-webkit-box-shadow:0 1px 3px #000000;
    padding:0;
    margin:30px 0 10px 0;
    font:normal 12px Arial, Sans-Serif;
    color:#ffffff;
    }
    .admin-tulisan .kontainer{padding:5px;}
    .admin-tulisan h4{
    background:#ff0000;
    border:none;
    border-bottom:1px solid #ffffff;
    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;
    }

• Untuk code yang berwarna MERAH ; Itu merupakan code warna untuk bagian HEADER kotak admin.
• Untuk code yang berwarna BIRU ; Itu merupakan code warna untuk bagian garis tepi kotak admin.
• Untuk code yang berwarna HIJAU ; Itu merupakan code werna tulisan yang tampil di badan kotak admin.
• Untuk code yang berwarna ORANGE ; itu merupakn kode warna untuk beckground badan kotak admin.