Add icons next to titles to categorize topics by blog sections

Add icons next to titles to categorize topics by blog sections




Peace be upon you and the mercy and blessings of God Almighty, in this paragraph we will add a beautiful comment related to the comments by showing the number of comments in front of each title of the post, which will make it easier for the visitor to know the number of comments in the topic without going to the bottom of the page and now I leave you with the application
Go to your blog's dashboard, select "Design", then "Edit HTML" and check the Expand Widget Templates box. Search for the following code using the control panel (CTRL + F).
 ]]></b:skin>
Then put the following code immediately before it:
 .comment-bubble { float : left; width : 48px; height : 48px; background : url(http://www.yasour.org/images/comment.jpg) no-
repeat; font-size : 18px; margin-top : -15px; margin-right : 2px; text-align : center; padding:0px 0px 0px 0px; /*for more hacks: http://www.monte-escalier-prix.org/ */ }
Now search for this code and add what color is red:
 <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>

I hope you like it, waiting for your encouragement
Previous Post Next Post