CARA MEMBUAT SHOW HIDE KOMENTAR BLOG

1. Log in ke blogger > Template > Edit HTML > Proceed
2. Masukan kode berikut ini sebelum </head>

<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 = "Show Comments",
closePanelText = "Hide Comments",
slideDownPanelSpeed = 600,
slideUpPanelSpeed = 400;

jQuery(function() {
    jQuery(panelSelector).hide()
        .addClass('kerenPanel')
            .before('<a class="openpanel" href="#">' + openPanelText + '<em></em></a>')
                .after('<div class="paneline"></div>');
    jQuery('a.openpanel').toggle(function() {
        jQuery(this).addClass('active').html(closePanelText + '<em></em>');
        jQuery('div.kerenPanel').slideDown(slideDownPanelSpeed);
        return false;
    }, function() {
        jQuery(this).removeClass('active').html(openPanelText + '<em></em>');
        jQuery('div.kerenPanel').slideUp(slideUpPanelSpeed);
        return false;
    });
});

//]]>
</script>

3. Masukan kode css pada template blog

a.openpanel {
  display:block;
  width:100%;
  height:40px;
  padding:0 0;
  text-align:center;
  font-weight:bold;
  line-height:30px;
  background:#ffffff;
  url()repeat-x;
  -webkit-transition:all .15s ease-in-out;
  -webkit-transform-origin:50% 1px;
  position:relative;
}

a.openpanel em {
  width:0;
  height:0;
  display:block;
  position:absolute;
  top:15px;
  right:15px;
  border:6px solid transparent;
  border-top-color:white;
}

a.openpanel.active {
  background-color:#ffffff;
}

a.openpanel.active em {
  top:6px;
  border color:#222222;
}

div.paneline {
  height:0;
  -webkit-transition:all .15s ease-in-out;
  -webkit-transform-origin:50% 1px;
}

div.kerenPanel {
  padding:10px 20px 20px;
  margin:0 0 !important;
}

4. Setelah itu pilih Save Template