Monday, May 1, 2017

How to Add Like/Dislike Button for Every Post in Blogger


Putting like and dislike button in every post in Blogger will influence visiting and reading your article with more encourage. It is strongly said to make the best relation between blogger and audiences to get more revenue from blogging and this option is the another most important technique to complete this journey.

How to Add Like/Dislike Button for Every Post in Blogger

Why You Should Add Like/Dislike Button in Every Post:

  • To increase the interest reading your blog.
  • To see and analyze popular statistics instantly.
  • To encourage be freedom to vote your article.
  • To make visible your contents popularity in Google Rich Snippet.
This tutorial will help you to add an awesome like/dislike button in Blogger platform. Probably, you have tried more to do it but failed to get expected result. No matter. Just follow the steps and see what you have done.

Before starting, special thanks to likebtn to share the efficient and useful widget for Blogger platform (Free and premium). We will see how to add this widget properly.

3 Reasons You Should to Choose Likebtn:
  • Both free and premium widget.
  • Customizable own theme, color, icon, option and others feature.
  • Easy to install.

How to Install Likebtn in Blogger Properly:

To install follow the instructions.

Step-1: Go to Like Button Generator option and customize your button and option.

While customizing you will see the demo. So it is easy to check live properly.

Step-2: After completing customization just copy the code and save to JavaScript file.

Step-3:
Add the following attributes to the first span
expr:data-identifier='data:post.id'

Finally your code may be like:
<!-- LikeBtn.com BEGIN -->
<span class="likebtn-wrapper" data-theme="custom" data-icon_l_c_v="#058bfb" data-icon_d_c_v="rgba(232,57,18,0.8)" data-rich_snippet="true" data-counter_frmt="km" data-counter_zero_show="true" expr:data-identifier='data:post.id'></span>
<script>(function(d,e,s){if(d.getElementById("likebtn_wjs"))return;a=d.createElement(e);m=d.getElementsByTagName(e)[0];a.async=1;a.id="likebtn_wjs";a.src=s;m.parentNode.insertBefore(a, m)})(document,"script","//w.likebtn.com/js/w/widget.js");</script>
<!-- LikeBtn.com END -->

Step-4: Now go to Blogger DashboardThemeEdit HTML

If you want to put like/dislike button after headline or beginning the article, then search for <div class='post-header-line-1'/> and hitting ENTER twice stop in second and paste the following code just after it.

And if you want to put on the end of article, then search for <div class='post-footer-line post-footer-line-1'> and hitting twice stop in second and paste the following code just after it.

Step-5: Save your Template.

I think you have added like/dislike button in your blogger properly.

Recommended:
Check more Blogger Customize Tool.
Effective SEO tips for Blogger.
Have got this article helpful or not working? Put your comment below.

No comments:

Post a Comment

We appreciate your comment. Shout here.