Cara Membuat Komentar Slide di Blog. Cara ini sudah banyak dibahas pada kebanyakan blog tapi berhubung ada sahabat Blog (
Sarlinda Dian Sari) yang menanyakan cara ini lewat komentar disalah satu artikel saya di
Tutorial HTML Part 1. Anggaplah ini sebagai jawaban dari pertanyaan tersebut, barangkali ada yang berminat untuk memasang di blog nya.
Sebagai demo, Sobat bisah liat pada setiap komentar di
artikel blog saya yang terdapat panel buka-tutup komentar. berikut ada adalah cara membuatnya.
Pertama masuklah ke halaman
editor HTML template Anda kemudian cari dan temukan kode ini:
]]></b:skin>
Salin kode berikut dan letakan diatasnya.
a.openpanel {
display:block;
clear:both;
width:auto;
padding:0px 0px;
text-align:center;
font-weight:bold;
line-height:32px;
background : url(
https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgZwrZZaLzhIIlk5roAM-ANkQA_gX66lzSvmPvLIk_XzEjQObZ5ZGcsNUZ_tH8CVgRe6YT0Z-Dqo9kJ4-FgNfZBvyUz36SBve2WzgJEaEtLYumCGlZm5pqF8JoZlvfpw1yQ2yOcohU9Tst8/s1600/topmenueva.jpg)repeat-x;-webkit-transition: all .15s ease-in-out;
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 em {
top:6px;
border-color:transparent transparent white transparent;
}
div.paneline {
height:0px;
}
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;
}
Kemudian cari kede berikut :
</head>
Tempelkan kode berikut diatas kode
</head> tadi.
<!--Buka Tutup Komentar-->
<script src='http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js' type='text/javascript'/>
<script type='text/javascript'>
//<![CDATA[
var panelSelector = '#comments',
openPanelText = "Buka Komentar",
closePanelText = "Tutup Lagi dong Komentarnya !",
slideDownPanelSpeed = 600,
slideUpPanelSpeed = 400;
//]]></script>
<script type='text/javascript'>
</script>
<script src='http://edyn-laskar.googlecode.com/files/komentarmenciut.js' type='text/javascript'/></script>
<!--End Buka Tutup Komentar-->
Keterangan :
"
Buka Komentar" : Label sebelum dibuka.
"
Tutup Lagi dong Komentarnya !" : Label setelah dibuka.
Nilai
600 dan
400 : kecepatan buka dan tutup panel.
Kode "
http://ajax.googleapis.com/ajax/libs/jquery/1.7.1/jquery.min.js" : jika sudah ada, kode ini boleh dihilangkan
Selamat berkreasi,
Terimakasi sudah mampir di
Technology is Informatica. Semoga postingan
Cara Membuat Komentar Slide di Blog bisah bermanfaaat.