Cara Bikin Kotak kementar Tutup Buka / Show Hide Coment

Cara Bikin Kotak kementar  Tutup Buka / Show Hide Coment :

SelAMAT SIANG MENJELANG SORE SOBAT – SOBAT BLOGER SEMUANYA ,Mudah – mudahan lagi pada hoki. Hey sobat bloger Rasanya Sehari saja gamain internet terus ga ngutak – ngatik di Blog rasanya gimana gitu ya ,apalagi pada kali ini cuaca lagi bagus , hujan ngga , panaspun tidak   alias adem ayem bro. walaupun dompet mulai tipis ga ada isinya rasanya sedikit tenang hehehe…….bukan – begittu sob .
[bukan wkwkwkkw].

O iya hampir lupa kalu pada kesempatan kali ini aye mau share tentang cara bikin kotak komentar  tutup  buka / show hide coment. Tetapi sebelum kita melanjutkan caranya , alangkah lebih baiknya kita tau apa itu kotak komentar buka tutup / show hide coment , biar lebih tau tujuannya .

cara bikin kotak komentar  tutup buka  / show hide coment Yang aye maksud di sini adalah kotak komentar di bawah postingan blog ,yang biasanya terbuka , maka dengan menerapkan cara yang ada di postingan ini , kotak komentar yang ada di blog kita yang letaknya di bawah postingan akan tertutup dan jika di klik maka akan terbuka .lihat contoh  di bawah postingan blog aye.

Memang cara ini kalau buat para master dunia bloging tiddak lah sesulit yang dibayangkan ,tetapi  buat para pemula mingkin cara ini bisa bikin pening juga hehehhe………….
Jika ada yang berminat untuk menerapkan di blognya ataupun sekedar mencobanya silakan ikuti  cara – cara di bawah ini :

1. seperti biasanya kita log in di akun bloger.com  masing - masing
2. Setelah masuk  kita pilih template { untuk berjaga – jaga backup dulu template kita }
3. Selanjutnya silakan pilih Yang edit Html / JavaScript
4. Setelah masuk kita tempelkan code  dibawah ini tepat di atas Code ]]></b:skin>
---------------------------

a.bukacoment {
  display:block;
  clear:both;
  width:auto;
  padding:0px 0px;
  text-align:center;
  font-size:14px;
  font-weight:bold;
  line-height:30px;
  background-color:#ff00ff;
  color:white;
  text-decoration:none;
  margin:0px 0px;
  position:relative;
}
a.bukacoment em {
  width:0px;
  height:0px;
  display:block;
  position:absolute;
  top:10px;
  right:10px;
  border:6px solid transparent;
  border-top-color:white;
}
a.bukacoment.active {background-color:#077;}
a.bukacoment.active em {
  top:6px;
  border-color:transparent transparent white transparent;
}
div.btsbawah {
  height:0px;
  border-bottom:4px solid #ff0000;
}
div.jqcoment {
  padding:0px;
  margin:0px 0px !important;
}

___________
Cttn : Yang warna merah = warna background nya
_______________
5. Silakan save / simpan template
6. Jika sudah kita pasang Code Java Script di bawah ini diatas Code </head>

<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
var panelSelector          =  '#comments',
    openPanelText          = "Sempatkanlah berkomentar",
    closePanelText          = "Tutup Komentar",
    slideDownPanelSpeed = 800,
    slideUpPanelSpeed      = 600;
//]]>
</script><script src='https://sites.google.com/site/wildantaupiq/js/open-coment.js' type='text/javascript'/>

_______________________
Cttan : teks yang bergaris bawah silakan di hapus jika template nya sudah ada jquery nya.
 var panelSelector  = '#comments',[ bisa diganti dengan obyek lain ]
teks  Sempatkanlah berkomentar [di ganti jika mau ]
 teks Tutup Komentar  [ silakan di ganti jika mau ]
angka  600 dan 400 adalah kecepatan slide nya [ ganti jika mau ]
_____
7. Jika Sudah selesai  kita save / simpan template , lalu kita lihat hasilnya

Nah aye rasa cukup sekian saja dulu postingan tentang  cara bikin kotak komentar  tutup buka  / show hide coment pada kali ini,…,mudah mudahan tutorial tadi bermanfa’at .
selamat mencoba semoga sukses .

RELATED POS: