Expand-Collapse Blogger Comment Box

Well this is a Cool Tweak to Expand Or Collapse Comment Box in Blogger.So Follow the Below Steps to Add this Tweak to Your Comment Box.

EXPAND/COLLAPSE BLOGGER COMMENT BOX TO BLOGGER

• Go to Blogger Dashboard > Template > Edit HTML > Proceed
• Backup your Template before making changes.
• Now  Expand Widget Templates
• Now Search For the code shown below using [ctrl+F]

</head>

• Now replace it with the code shown below

<style type="text/css">
 h2.trigger2 {
padding-left:50px;
margin:10px 0px 10px 10px;
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg4cUYftiElAjGTOTpiKVoJXq8WrUgdRNlXsHVFYqtgVuTPvIiPW-9S-JG3a0qHBHIZyA21C1Ss1m6oKuo2ps40V1A0Tq5cRfsJICxhS_vV0RnvOzAlzY1DmrlEOFmjw9A5d2cNQ-Nd4D8/s1600/h2trigger.png) no-repeat;
height: 46px;
line-height: 46px;
width: 580px;
font-family:"Francois One";
font-size: 1.4em;
font-weight: bold;
text-align:left;
color:#fff;
float: left;
cursor:pointer;
}
h2.active {
background-position: bottom left;
}
.toggle_container2 {
padding-left:10px;
overflow: hidden;
clear: both;
}
</style>
<script type='text/javascript'> 
$(document).ready(function(){
    
    $(&quot;.toggle_container2&quot;).hide();

    $(&quot;h2.trigger2&quot;).click(function(){
        $(this).toggleClass(&quot;active&quot;).next().slideToggle(&quot;slow&quot;);
    });

});
</script></head>

• To change the width of the button edit width: 580px
• Now Search for the code shown below using [ctrl+F]

<b:includable id='comment-form' var='post'>

• Now Paste the Code Shown Below just below/after it

<h2 class='trigger2'>Click to Add a New Comment</h2>
<div class='toggle_container2'>
<div class='block'>

• Paste the Below Code above </b:includable> :

<p style="display:none;">comment Box by <a href="http://goodinblogging.blogspot.com">GoodinBlogging</a></p></div></div>

That's it Enjoy....