HOW TO HIDE COMMENTS

Hello all~

This tutorial is for blogger that are using embedded comments. 
This trick is not working for blog 
that use comment form from third party (i.e Disqus, Comluv, etc)

Here are the steps that all of you need to follow.

01. Dashboard > Layout > Edit HTML > TICK EXPAND WIDGET

02. Find (CTRL+F) this code: ]]></b:skin>

03. Copy and paste the code below under ]]></b:skin>

#HideComments {
width: 230px;
font-size: 13px;
background: #F0F0F0;
border: 1px solid #cccccc;
font-weight: bold;
padding: 5px;
}

04. And copy and paste the code below before</head>

<script language="javascript">
function toggle() {
var ele = document.getElementById("toggleText");
var text = document.getElementById("displayText");
if(ele.style.display == "block") {
ele.style.display = "none";
text.innerHTML = "Click Here To See Comments";
}
else {
ele.style.display = "block";
text.innerHTML = "Hide Back";
}
}
</script>

05. You may change the red one with any words or sentences you like
06. This is the last steps. Refer the code below. The red one should be added by you. The blackone is already presence in your blog's HTML. Copy and paste the red one in your HTML.

<div id='HideComments'>
<a href='javascript:toggle();' id='displayText'>Click Here To See Comments</a>
</div>
<div id="toggleText" style="display: none;">

<dl id='comments-block'>
<b:loop values='data:post.comments' var='comment'>
<dt expr:class='&quot;comment-author &quot; + data:comment.authorClass' expr:id='data:comment.anchorName'>
<b:if cond='data:comment.favicon'>
<img expr:src='data:comment.favicon' height='16px' style='margin-bottom:-2px;' width='16px'/>
</b:if>
<a expr:name='data:comment.anchorName'/>
<b:if cond='data:comment.authorUrl'>
<a expr:href='data:comment.authorUrl' rel='nofollow'><data:comment.author/></a>
<b:else/>
<data:comment.author/>
</b:if>
<data:commentPostedByMsg/>
</dt>
<dd class='comment-body'>
<b:if cond='data:comment.isDeleted'>
<span class='deleted-comment'><data:comment.body/></span>
<b:else/>
<p><data:comment.body/></p>
</b:if>
</dd>
<dd class='comment-footer'>
<span class='comment-timestamp'>
<a expr:href='data:comment.url' title='comment permalink'>
<data:comment.timestamp/>
</a>
<b:include data='comment' name='commentDeleteIcon'/>
</span>
</dd>
</b:loop>
</dl>

</div>
 

07. Save templates
08. DONE 

Please leave me feedbacks. :)