How to Move Comments Below the Embedded Comment Form in Blogger

Commenting is compulsory to communicate with your readers especially on a blog. As a communication tool, you can let them express ideas or contact you through the comment feature. Sometimes you would like to customize the formation of displaying comments. So if you display embedded comment form below each post on past pages, you may find that comments submitted by readers were appearing above the comment form. But what if you prefer displaying comments below the comment form?

Is there any solution to move comments beneath the comment form? Yes, absolutely. If you are using embedded comment form on your blog, you can move comments section and comment form appeared on your comment-enabled pages. So here we gonna alter your template and display comments beneath the comment form. It would be convenient for your visitors, if you have huge sum of comments on your pages. So they don't need to scroll down to the end of page to find your comment form and leave a comment. So if you prefer that way, let's figure out how to move them below embedded comment form. If you are not sure about the comment form you are using is embedded comment form, you can read and find it easily. However this applies only to the embedded comment form.

Steps:

1. Go to Blogger Dashboard.

2. Now click on your Blog Title.

3. Jump to Template tab.

Note: Before editing your template, you may want to save a copy of it. Read How to Back Up Your Template.

4. Click on Edit HTML tab.

5. Now find the code snippet of embed comment form similar to below in your template and remove that code snippet after taking a copy of it.

<p class='comment-footer'>
<b:if cond='data:post.embedCommentForm'>
<b:if cond='data:post.allowNewComments'>
<b:include data='post' name='comment-form'/>
<b:else/>
<data:post.noNewCommentsText/>
</b:if>
<b:else/>
<b:if cond='data:post.allowComments'>
<a expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:postCommentMsg/></a>
</b:if>
</b:if>
</p>

6. Now find the snippet similar to below in your template and add the embed comment form code snippet right after this code snippet.

<b:includable id='comments' var='post'>
<div class='comments' id='comments'>
<a name='comments'/>
<b:if cond='data:post.allowComments'>
<h4>
<b:if cond='data:post.numComments == 1'> 1 <data:commentLabel/>:
<b:else/>
<data:post.numComments/>
<data:commentLabelPlural/>:
</b:if>
</h4>

7. Now Save template and Preview your post pages for made changes.

Enjoy :-)