Cara Membuat Komentar Slide Panel Dengan JQuery

Cara Membuat Komentar Slide Panel Dengan JQuery Single Link
Alternative Link : [ Click Here... ] Direct Link

Cara Membuat Komentar Slide Panel Dengan JQuery |  Hay sobat apa kabar kalian semua ? Kali ini Acep-Computer akan berbagi tutorial seputar blog. Tutorial kali ini adalah Cara Membuat Komentar Slide Panel Dengan JQuery. Meskipun tutorial membuat slide panel ini sudah banyak bertebaran di si mbah google, Tapi biarkan saya membagikan tutorial ini kepada sobat yang belum tahu dengan komentar slide panel ini.

Sebelum anda mererapkan di blog anda, alangkah baiknya sobat buka demonya dulu biar lebih paham dengan komentar slide panel. Tinggal buka demonya DISINI. Setelah melihat demonya, pasti anda akan mencoba memasangnya di blog anda. Simak baik - baik tutorial Cara Membuat Komentar Slide Panel Dengan JQuery dibawah ini :

1. Buka blogger
2. Masuk Template => Edit Template
3. Cari kode ini ]]></b:skin> dengan menekan tombol ctrl+f  biar lebih cepat
4. Setelah ketemu, copy kode dibawah ini tepat DIATAS kode ]]></b:skin>

a.openpanel {
  display:block;
  clear:both;
  width:auto;
  padding:0px 0px;
  text-align:center;
  font-weight:bold;
  line-height:32px;
  background-color:#39f;
  color:white;
  text-decoration:none;
  margin:0px 0px;
  -webkit-box-shadow:0px 1px 1px rgba(0,0,0,0.2);
  -moz-box-shadow:0px 1px 1px rgba(0,0,0,0.2);
  box-shadow:0px 1px 1px rgba(0,0,0,0.2);
  position:relative;
}
a.openpanel em {
  width:0px;
  height:0px;
  display:block;
  position:absolute;
  top:15px;
  right:15px;
  border:6px solid transparent;
  border-top-color:white;
}
a.openpanel.active {background-color:#900;}
a.openpanel.active em {
  top:6px;
  border-color:transparent transparent white transparent;
}
div.paneline {
  height:0px;
  border-bottom:4px solid #39b;
}
div.hompiPanel {
  padding:10px 20px 20px;
  -webkit-box-shadow:inset 0px 1px 7px rgba(0,0,0,0.2);
  -moz-box-shadow:inset 0px 1px 7px rgba(0,0,0,0.2);
  box-shadow:inset 0px 1px 7px rgba(0,0,0,0.2);
  margin:0px 0px !important;
}

5. Kemudian temukan kode </head> dan copy kode ini tepat DIATAS kode </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'></script>
<script type='text/javascript'>
//<![CDATA[
var panelSelector       = '#comments',
    openPanelText       = "Poskan Komentar",
    closePanelText      = "Tutup Komentar",
    slideDownPanelSpeed = 600,
    slideUpPanelSpeed   = 400;
//]]>
</script>
<script src='http://reader-download.googlecode.com/svn/trunk/blogger-slide-panel-comments.js' type='text/javascript'></script>

Ingat, kode yang Saya beri garis bawah bewarna aqua adalah JQuery. Jika template Anda sudah dilengkapi dengan JQuery, hapus kode tersebut !

6. Simpan atau Save Template sobat.

Coba di lihat dulu apakah sudah work 100% atau tidak? Jika tutorial diatas tidak work, silahkan anda berkomentar di bawah ini agar kodenya bisa dengan segera saya perbaiki. Oke cukup sekian saja tutorial Cara Membuat Komentar Slide Panel Dengan JQuery dari saya, semoga tutorial diatas bisa bermanfaat.