Cara Membuat Kotak Admin Di Bawah Artikel

TUTORIAL BLOG | BELAJAR BLOG - Postingan saya kali ini menyangkut tentang kotak admin. Kotak admin di bawah artikel bisa membuat tampilan blog kita jadi tambah keren .Style kotak admin di bawah artikel ini juga bagus, anda bisa lihat gambarnya dibawah ini:

Nah jika anda ingin memasang Kotak Admin Di Bawah Artikel seperti gambar di atas, anda bisa mengikuti langkah-langkahnya dibawah ini:

1. Masuk ke blog agan
2. kemudian pilih "Template" 
3. Setelah anda klik "Template" kemudian klik lagi pada "edit HTML" 
4. Setelah itu Centang "Expand Template Widget" 
5. Kemudian cari kode seperti ini ]]></b:skin> gunakan Ctrl + F untuk mempermudah pencarian
6. Setelah ketemu, copy kode CSS dibawah ini dan pastekan tepat di atas kode ]]></b:skin> 

   .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. Setelah itu, cari lagi kode seperti ini <div class='post-footer'>
8. Jika sudah ketemu, copy script dibawah ini dan pastekan di atas kode <div class='post-footer'> jika anda menemukan kode <div class='post-footer'> lebiah dari satu, maka letakan kode Script dibawah ini di <div class='post-footer'> yang pertama (yang paling atas)

   <!-- 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/AVvXsEilAXbuGytv9AoQJP-2mqL01Sgdps_uh6nUdhVLAyVUCsu5P-RfyeltTuX87yOLaYqRW2BL9ZJkKhwVj9adWqXKaHrtiK4VNks7HLJnV8VbADZzxERtEN9W-BY52bTwkoqBcg2RhulvBi4/s1600/Olde_Skull_Bones.gif'/>

   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='oktriblogger.blogspot.com' target='_blank'>:: Get this widget ! ::</a></span></p>

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

   </div>

   </div>

   </b:if>

   <!-- Kotak Admin -->

   
   
9. KETERANGAN : Silahkan ganti link URL gambar profil yang berwarna merah dengan link gambar profil sobat. Isi tulisan yang berwarna biru dengan deskripsi anda (ganti/edit dulu kata-kata ulasannya di notepad.)
10. Setelah selesai mengedit kemudian klik "SAVE" dan lihat hasilnya.
11. Untuk jenis font, warna background dan border juga dapat sobat ganti/edit sesuai keinginan.

Semoga artikel Cara Membuat Kotak Admin Di Bawah Artikel ini bisa membantu anda semua, jika anda mengalami kesulitan dalam penerapannya, anda bisa bertanya dengan cara menuliskan kesulitan anda di kolom komentar dibawah ini.