Saturday, June 15, 2013

Cara Membuat/Memasang Kotak Pesan Admin Dibawah Postingan Blog

Cara Membuat/Memasang Kotak Pesan Admin Dibawah Postingan Blog - Kata-kata itu Pastinya sudah tidak asing lagi untuk para blogger. Dan menurut saya kotak pesan admin ini cukup bermanfaat contohnya: kita menjadi lebih tenang ketika artikel yg kita buat di copas ke blog oleh orang lain, dan tentunya setelah mereka melihat pesan Admin kita pastinya mereka akan meletakan sumbernya. Jadi kita tidak perlu khawatir. Ok Langsung saja kita peraktekan bagaimana Cara Membuat/Memasang Kotak Pesan Admin Dibawah Postingan Blog

Langkah Ke-1

1.  Seperti biasa biasa sob, Login ke dashboard blogger sobat.
2.  Masuk ke menu Rancangan / Template >> Edit HTML.
3.  Jangan lupa Unduh template Lengkap, buat jaga-jaga ketika anda gagal mempraktekannya 
      jadi anda bisa membackupnya.
4.  Setelah itu jangan lupa centang pada Expand Template Widget.
5.  Kalau sudah, sobat cari kode ini <div class='post-footer'> Pada template. Pakai Ctrl+F
     untuk mencari kode di atas agar lebih mudah.
6.  Kalau sudah ketemu copy kode dibawah ini, dan pastekan / letakkan tepat di atas <div class='post-footer'>
<!-- Kotak Admin -->
    <b:if cond='data:blog.pageType == &quot;item&quot;'>
    <div class='admin-tulisan'>
    <h4>Creatif By : <a expr:href='data:blog.homepageUrl'><data:post.author/></a>
Deskripsi Blog sobat</h4>
    <div class='kontainer'>
    <img src='http://3.bp.blogspot.com/-FMUCJ0MUryU/UVqu74grIuI/AAAAAAAABPI/ayRPA5E4qOE/s1600/2f5840d5b5dccb94_m.jpg'/>
    
Terimah Kasih telah membaca artikel<a expr:href='data:post.url'><data:post.title/></a>. Yang ditulis oleh <data:post.author/> .Pada hari<data:post.dateHeader/>. Jika anda ingin sebarluaskan artikel ini, mohon sertakan <blink><strong>sumber link asli.</strong></blink> Kritik dan saran dapat anda sampaikan melalui kotak komentar. Trimakasih

    <p>
<textarea cols='57' id='bloglinking' name='bloglinking' onclick='this.focus();this.select()' onfocus='this.select()' onmouseover='this.focus()' readonly='readonly' rows='2'>&lt;a href=&quot;<data:post.url/>&quot; target=&quot;_blank&quot;&gt;<data:blog.pageName/>&lt;/a&gt;</textarea><span style='float:right;font:italic 10px Arial, Sans-Serif;'><a href='
http://rahman-ciblog.blogspot.com/2013/04/cara-membuatmemasang-kotak-pesan-admin.html
/' target='_blank'>:: Get this widget ! ::</a></span></p>
    <div style='clear:both;'/>
    </div>
    </div>
    </b:if>
    <!-- Kotak Admin -->
 Keterangan:
Code di atas akan membuat kotak Admin yang akan tercantum link posting anda secara otomatis, dan sobat bisa mengganti yang saya tulis di bawah ini.

  • Ganti tulisan yang berwarna BIRU : Ganti dengan deskripsi blog sobat sendiri.
  • Ganti tulisan yang berwarna MERAH : Itu merupakan alamat url dari foto. Silakan ganti dengan alamat url sobat yang ingin sobat pasang.
  • Ganti tulisan yang berwarna UNGU : Itu merupakan tulisan isi dari pesan sobat. Sobat bisa ganti dengan selera sobat sendiri.
Langkah Ke-2

1.  Kemudian cari code ]]></b:skin> Pada template sobat.
2.  Kalau sudah ketemu, silahkan Copy Code CSS dibawah ini, dan pastekan/letakan  tepat di 
     atas code ]]></b:skin>
3.  Jika sobat gagal, ini hanya masalah peletakan code CSS ini. Kalau ternyata gagal, coba 
     sobat letakan code CSS ini dibawah kode <data:post.body/> .
4.  Kalau di Template sobat code <data:post.body/> ada 2, maka pilihlah yang atas. Kalau 
     punyaku sih untuk code CSS ini terletak di atas code ]]></b:skin> .
5.  Simpan Template.

Ini code scriptnya sob.
.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;
    }
 Keterangan: 

  • 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 UNGU : Itu merupakan code warna untuk beckground badan kotak admin.
  • Untuk code yang berwarna ORANGE : itu merupakan kode warna untuk beckground badan kotak admin.

Silahkan sobat ubah sesuai keinginan sobat kalau dirasa itu belum pas, Dan semoga bermanfaat..!!


12 comments:

  1. Di mananya bro yg sulit..??

    ReplyDelete
  2. trimakasih gan..!! sudah berhasil ni punya saya..!! silahkan berkunjung ke blog ane juga yah..!! dengan url nama saya sendiri hahaha..!!

    ReplyDelete
  3. @rifki afrizal:Ok, gan siap meluncur..

    ReplyDelete
  4. @suraya rey:Mungkin ada kesalahan pada peletakkan kode css, di simak baik" gan caranya

    ReplyDelete
  5. Mantap mas, namun saya mengalami masalah pada Url photo. Url photo kita dapat dari mana/cari dimna mas, maklum pemula ne
    mampir juga di blog saya mas http://sekaliu.blogspot.com/ saya butuh pembelajaran,kritik dan saran dari agan-agan. :d (o)

    ReplyDelete
  6. @Indra Sekaliu:Upload di blog atau upload foto anda disini

    ReplyDelete
  7. Gan Itu Letaknya Dimana ??
    Ko Di Blog Ane Kgax Muncul http://fajardwimaarif.blogspot.com/

    ReplyDelete