We often see Like/Dislike buttons under articles and posts in websites and blogs, and we want to be in our blogs or websites, so in this article I'll show you how to add them in different and attractive formats just follow me*_*
Preview :
Step 1 : Go To Blogger.com >> Template >> Edit Template
search for </body> tag and copy paste the code bellow before it
<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>
(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>
Step 2: search for this <data:post.body/> tag and copy paste the selected code bellow before it :(You'll find 1 or more of it depending on your template, try each one of it)
Style 1:
<span class="likebtn-wrapper" data-show_dislike_label="true"></span>
Style 2:
<span class="likebtn-wrapper" data-theme="lightgray" data-show_dislike_label="true"></span>
Style 3:
<span class="likebtn-wrapper" data-theme="gray" data-show_dislike_label="true"></span>
Style 4:
<span class="likebtn-wrapper" data-theme="black" data-show_dislike_label="true"></span>
Style 5:
<span class="likebtn-wrapper" data-theme="padded" data-show_dislike_label="true"></span>
Style 6:
<span class="likebtn-wrapper" data-theme="drop" data-show_dislike_label="true"></span>
Style 7:
<span class="likebtn-wrapper" data-theme="line" data-show_dislike_label="true"></span>
Style 8:
<span class="likebtn-wrapper" data-theme="github" data-show_dislike_label="true"></span>
Style 9:
<span class="likebtn-wrapper" data-theme="transparent" data-show_dislike_label="true"></span>
Style 10:
<span class="likebtn-wrapper" data-theme="youtube" data-show_dislike_label="true"></span>
Style 11:
<span class="likebtn-wrapper" data-theme="heartcross" data-show_dislike_label="true"></span>
Style 12:
<span class="likebtn-wrapper" data-theme="plusminus" data-show_dislike_label="true"></span>
Style 13:
<span class="likebtn-wrapper" data-theme="greenred" data-show_dislike_label="true"></span>
Style 14:
<span class="likebtn-wrapper" data-theme="large" data-show_dislike_label="true"></span>
Style 15:
<span class="likebtn-wrapper" data-theme="sku" data-show_dislike_label="true"></span>
Style 16:
<span class="likebtn-wrapper" data-theme="baidu" data-show_dislike_label="true"></span>
Style 17:
<span class="likebtn-wrapper" data-theme="disk" data-show_dislike_label="true"></span>
Style 18:
<span class="likebtn-wrapper" data-theme="ublack" data-show_dislike_label="true"></span>
Style 19:
<span class="likebtn-wrapper" data-theme="roundthumb" data-show_dislike_label="true"></span>
Style 20:
<span class="likebtn-wrapper" data-theme="nero" data-show_dislike_label="true"></span>
Step 3 : Click Save Template and Enjoy!!.
That's all, if you have any question leave a comment in this tutorials *_*
Tags:
Blogger_Widgets
Post a Comment
0 Comments