How To Integrate Blogspot, Disqus And Facebook Comment Tabs On Blogger?
There is a debatable topic on selecting comment box for blogger blog, there are numbers of comment platform available on for blogger user like Disqus, Facebook, Livefyre, and so on. There is a positive and negative points of individual comment platform, If we want to gain the all advantages of each comment system than we have to add multiple comment system in our blogger blog. Today i am here bring the plugins that will helps you to integrate major comment like blogger, facebook and Disqus. I had visited one WordPress based blog which having all three integrated comment system, based on that idea i had develop this plugins i hope you will enjoy this.
Integrate Facebook, Disqus and Blogger Comment Together on Blogspot Blog.
Before proceeding you have your disqus username and Facebook App Id.
Now i had assumed that you had your own disqus account username and Facebook App Id, So Now lets start the tutorial.
Step 1: Login in blogger Account. And select Your Blog.
Step 2: Backup Your Blogger Blog. (Learn how to backup Blogger Blog)
Step 3: Navigate Blogger Dashboard > Go to Template > Edit HTML.
Step 4: Find Following Code by pressing CTRL + F.
</head>
Step 5: Just Above </head> tag paste below code.
<meta content='the.vip' property='fb:admins'/>
<meta content='3840756250xxxxx' property='fb:app_id'/>
<script src='http://code.jquery.com/jquery-latest.pack.js'/>
<script src='http://viptechfiles.somee.com/vtwcommentstyle.js'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>
Note:
Replace the.vip with with your own personal facebook username.
replce 3840756250xxxxx with your own facebook App Id.
Step 6: Now search for below code.
<div class='comments' id='comments'>
Note:If you find multiple code than paste below code under each "<div class='comments' id='comments'>" code
Step 7:
Use Below Integrated Facbook, disqus and blogger tab generator, Copy and Paste Generated Code Just After <div class='comments' id='comments'> code.
Step 8: Now we need to add disqus script to show no. of comment on button for it, find below code.
</body>
Step 9: Paste Following code just above </body> tag.
<script type='text/javascript'>
/* * * CONFIGURATION VARIABLES: EDIT BEFORE PASTING INTO YOUR WEBPAGE * * */
var disqus_shortname = 'Disqus-Site-Name'; // required: replace example with your forum shortname
/* * * DON'T EDIT BELOW THIS LINE * * */
(function () {
var s = document.createElement('script'); s.async = true;
s.type = 'text/javascript';
s.src = '//' + disqus_shortname + '.disqus.com/count.js';
(document.getElementsByTagName('HEAD')[0] || document.getElementsByTagName('BODY')[0]).appendChild(s);
}());
</script>
Replace Green Highlighted Disqus-Site-Name with your own disqus site username.
Step 10: Save Your Template, that set.
Note: If you find any trouble regarding appearance of 3 comment box, kindly change the comment setting as per instruction. Go to Setting > Post and Comment > In field of comment location select option "Embedded or Full Page" and check it respectively..
Credit link:
We have added a Credit attribution link is this gadget, Please it a humble request you all to do not remove it. No doubt, it is completely free for you all but, we also need your corporation to spread this widget to other who need it so please support us.
Final Words
Here in this widget i had used "onclick" events to disqus comment, it means disqus comment will load only when visitors click on disqus button. So as to it will not take unnecessary loading time. By adding Multiple comment system widget in blogger blog , Visitors have more space to share their thoughts, view, suggestions or query due to multiple logins facilities available to them. Share your point of view should we add multiple comment box to blogger blog or not?
0 comments:
Post a Comment