Add Comment Count Below Post Title

Assalamualaikum and hi everyone... Actually there are a lot of request on this tutorial and I had planned to make this tutor since a long time ago but I'm to lazy to type the tutorial...huhu
This tutor is about how to put the number of comment on a post below your post title ( Floating comments number ).

Okay, let's follow this tutor...

• 1. Log in your blogger account.
• 2. Go to Dashboard > Design > Edit HTML.
• 3. Back up your template. ( Optional = In case you want to save your previous code )
• 4. Click Ctrl + F and look for  <div class='post-header-line-1'/> code.
  
• 5. If this code appeared twice, use the second code.
• 6. Copy any of below code then, paste it after <div class='post-header-line-1'/> code.

 Style No. 1

 <span class='post-comment-link' style='Float:right;padding:5px;width:200px;letter-spacing:1px;margin-right:20px; margin-bottom:10px;background:#EEEEEE;font:12px century gothic;text-align:center;'>
        <b:if cond='data:blog.pageType != &quot;item&quot;'>
          <b:if cond='data:post.allowComments'>
            <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' style='background:url(http://media.tumblr.com/tumblr_ll7x3bnod91qi6qow.gif) no-repeat;padding-left:20px;'><b:if cond='data:post.numComments == 0'>Be the first to comment!<b:else/> <b:if cond='data:post.numComments == 1'><data:post.numComments/> Comment so far<b:else/><data:post.numComments/> Comments so far</b:if> </b:if></a>
          </b:if>
        </b:if>
    </span>

Style No. 2

     <span class='post-comment-link' style='Float:right;border-radius:5px;border:2px solid #FFFFFF;padding:5px;width:200px;letter-spacing:1px;margin-right:20px; margin-bottom:10px;background:#EEEEEE;box-shadow:2px 2px 1px #DDDDDD;background:url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhVJhnn5AKbJF74k93HTeW8SwgRzey3Koi4JaPLpnylshBGTLhSY_DNGRsJJvTerzQxd1iaktg-c3v4Ifla_3p39xvvlipTfWzqXAs9K72MZcnm_MezU-znubMs44X8Ph2AuW0fuo-vx1vO/s1600/polkadotgrey.gif);font:12px century gothic;text-align:center;'>
            <b:if cond='data:blog.pageType != &quot;item&quot;'>
              <b:if cond='data:post.allowComments'>
                <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' style='background:url(http://media.tumblr.com/tumblr_ll7x3bnod91qi6qow.gif) no-repeat;padding-left:20px;'><b:if cond='data:post.numComments == 0'>Be the first to comment!<b:else/> <b:if cond='data:post.numComments == 1'><data:post.numComments/> Comment so far<b:else/><data:post.numComments/> Comments so far</b:if> </b:if></a>
              </b:if>
            </b:if>
        </span>

 Style No. 3

         <span class='post-comment-link' style='Float:right;border-radius:0px 10px 10px 0px;border-left:10px solid #D3E7FF;padding:8px;width:150px;letter-spacing:1px;margin-right:20px;margin-bottom:10px;background:#FFDCE3;font:12px century gothic;text-align:center;'>
                <b:if cond='data:blog.pageType != &quot;item&quot;'>
                  <b:if cond='data:post.allowComments'>
                    <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' style='background:url(http://media.tumblr.com/tumblr_ll7x3bnod91qi6qow.gif) no-repeat;padding-left:20px;'><b:if cond='data:post.numComments == 0'>No Comment<b:else/> <b:if cond='data:post.numComments == 1'><data:post.numComments/> Comment<b:else/><data:post.numComments/> Comments</b:if> </b:if></a>
                  </b:if>
                </b:if>
            </span>

 Style No. 4

<span class='post-comment-link' style='Float:right;box-shadow:0px 3px 4px #F4DFD0;padding:5px;width:150px;letter-spacing:1px;margin-right:20px;margin-bottom:10px;background:#F4DFD0;background:url(http://24.media.tumblr.com/tumblr_mb6hlsZL5r1rhin2xo1_250.jpg);font:12px century gothic;text-align:center;'>
                <b:if cond='data:blog.pageType != &quot;item&quot;'>
                  <b:if cond='data:post.allowComments'>
                   <a class='comment-link' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick' ><b:if cond='data:post.numComments == 0'>0 Comment<b:else/> <b:if cond='data:post.numComments == 1'><data:post.numComments/> Comment<b:else/><data:post.numComments/> Comments</b:if> </b:if></a>
                  </b:if>
                </b:if>
            </span>

......... PREVIEW AND SAVE.........

I HAD UPDATED THE CODE SO, THE ERROR HAD BEEN FIXED

The Notes :
Orange Text : Color code Find it Here.
Red Text : Width of the comment count.
Blue Text : URL of the small icon beside comment count. HERE
Purple Text : URL off the background image. HERE
Fuchsia Text : Text display when there's no comment on a post.
Green Text : Text display when there's one comment on a post.
Turquoise Text : Text display when there are more than one comment.

Okay, do try it...That's all...See you next time ^^, Do comment if you think this tutor is helpful...

Note : I'll be very busy later... So, I don't accept any request from you guys.. I hope you all can understand my situation.