Advertisement

Saturday, 1 November 2014

How to Use Blogger, Disqus and Facebook Comment tab Together on Blogger blog?

By Admin  |  20:27 No comments


Integrate Facebook, Disqus and Blogger Comment Together on Blogspot Blog. 


Before proceeding you must have to have disqus and Facebook App Id. See Below Tutorial to get your on Facebook App id and Disqus Account.

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.

<script src="http://code.jquery.com/jquery-latest.pack.js">
<script src='http://tipsviablogging.github.io/tvbcommentstyle.js'/>
<script src='http://connect.facebook.net/en_US/all.js#xfbml=1'/>

Note:
Replace eblog with with your own personal facebook username.
replce 1212xxxxx123 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 = &#39;Disqus-Site-Name&#39;; // required: replace example with your forum shortname
/* * * DON&#39;T EDIT BELOW THIS LINE * * */
(function () {
var s = document.createElement(&#39;script&#39;); s.async = true;
s.type = &#39;text/javascript&#39;;
s.src = &#39;//&#39; + disqus_shortname + &#39;.disqus.com/count.js&#39;;
(document.getElementsByTagName(&#39;HEAD&#39;)[0] || document.getElementsByTagName(&#39;BODY&#39;)[0]).appendChild(s);
}());
</script>>


Replace Disqus-Site-Name with your own disqus site username.

Step 10: Save Your Template, that set.

Author: Admin

Hello, I am Author, decode to know more: In commodo magna nisl, ac porta turpis blandit quis. Lorem ipsum dolor sit amet, consectetur adipiscing elit. In commodo magna nisl, ac porta turpis blandit quis. Lorem ipsum dolor sit amet.

0 comments:

E-mail Newsletter

Sign up now to receive breaking news and to hear what's new with us.

© 2014 e Blogup. WP themonic converted by Bloggertheme9. Powered by Blogger.
TOP