Recent Posts

Best Blogger | Tech Tutorials
Subscribe Via Rss Subscribe To The Latest Tips & Tricks
Follow On Twitter Follow @naijaclub10_com On Twitter
Receive The Latest Posts Directly To Your Email - It's Free: Email rss Enter Your Email And Click Subscribe
What is rssHave You Subscribed ?

September 02, 2013

Add bublish comment count In Blogger Blog

Make your comment count stylish with bubble images

Step 1. Go to your blogger “Dash Board” >>  Navigate to Layout  >>  Edit HTML section and a give tick to “Expand widget Template”.


Step 2. Find this Code ]]></b:skin>

Step 3. Paste following code just above mentioned code.


.comment-bubble {float : right;width : 48px;height : 48px;background : url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCCmFJo_2gUwNK-EYfCrnSaLyeuYHC816KTbdPp-ASCTMYUJVvFYrDTPdiTagTA6pFLwbbVzJFfpDy8WM1j12ccgDXRsDu-ObpCUzx0HZ-2T76TCPBzaGKXnilSlMlfU_U3WLUu2bS4-qJ/s1600/Comment+Bubble+%2815%29.png) no-repeat;font-size : 18px;margin-top : -15px;margin-right : 2px;text-align : center;}


Step 4. Find first line of below mentioned code and paste following code..mentioned in red color..


<b:includable id='post' var='post'><div class='post hentry uncustomized-post-template'><a expr:name='data:post.id'/><b:if cond='data:post.title'><h3 class='post-title entry-title'>

Step 5. Paste following code..

<b:if cond='data:post.allowComments'><a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a></b:if>

Final code that look like this..


<b:includable id='post' var='post'><div class='post hentry uncustomized-post-template'><a expr:name='data:post.id'/><b:if cond='data:post.title'><h3 class='post-title entry-title'><b:if cond='data:post.allowComments'><a class='comment-bubble' expr:href='data:post.addCommentUrl' expr:onclick='data:post.addCommentOnclick'><data:post.numComments/></a></b:if><b:if cond='data:post.link'><a expr:href='data:post.link'><data:post.title/></a><b:else/><b:if cond='data:post.url'><a expr:href='data:post.url'><data:post.title/></a><b:else/><data:post.title/></b:if></b:if></h3></b:if>

No comments:

Post a Comment