Facebook comments on every blog post WordPress
- SOLVED
If I want to have Facebook comments on every blog post (different comments on each blog post) then how do I do this?
I copy and pasted my code from the Facebook developers site (hiding my appId and url):
<div id="fb-root" ></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'xxx', // App ID
channelUrl : '//aaa.com/<?php echo $ad->id ?>', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
// Additional initialization code here
};
// Load the SDK Asynchronously
(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
This is giving me the same comments on every page. But I want different comments on every page.
Answers (7)
Arnav Joy answers:
why you don't try this plugin
http://wordpress.org/extend/plugins/facebook-comments-plugin/
Arnav Joy comments:
you can also try this code at the page under loop , where you want to show the commetns
while(have_posts()):
-----
----
<div class="fbcomment" id="fbcomment-<?php the_ID(); ?>" style="float:left; width:585px; display:none">
<html xmlns:fb="http://ogp.me/ns/fb#">
<div class="fb-like" data-href="<?php the_permalink(); ?>" data-send="false" data-width="585" data-show-faces="false" ></div>
<fb:comments href="<?php the_permalink(); ?>" num_posts="2" width="585" ></fb:comments>
endwhile;
Lawrence Krubner comments:
This is an older site and somewhat hacked up. Not sure I can use the plugin (using it would involve more work than I want to take on).
Arnav Joy comments:
so try the code at page.php inside loop
Arnav Joy comments:
oh Sorry , not in page.php
try that code at the place where you want to show the comments , or provide me the code for that page
Lawrence Krubner comments:
I couldn't make that work, but if I was working on a newer site then I think that would work.
AdamGold answers:
Tutorial:
http://wp.tutsplus.com/tutorials/add-facebook-comments-to-your-wordpress-theme/
Plugin:
http://wordpress.org/extend/plugins/facebook-comments-for-wordpress/
Lawrence Krubner comments:
This is an older site and somewhat hacked up. Not sure I can use the plugin (using it would involve more work than I want to take on).
AdamGold comments:
I have also attached a tutorial :)
Lawrence Krubner comments:
That is a good tutorial.
Pali Madra answers:
Another plugin I would recommend is
[[LINK href="http://wordpress.org/extend/plugins/facebook-comments-for-wordpress/"]][[/LINK]]
However if you are looking for a solution to the problem you are having I'm sharing the code which is to be used and to me it seems that the channelUrl is not the correct one as it should be a URL rather than using PHP to call the URL.
<div id="fb-root"></div>
<script>
window.fbAsyncInit = function() {
FB.init({
appId : 'YOUR_APP_ID', // App ID
channelUrl : '//WWW.YOUR_DOMAIN.COM/channel.html', // Channel File
status : true, // check login status
cookie : true, // enable cookies to allow the server to access the session
xfbml : true // parse XFBML
});
Lawrence Krubner comments:
I've played around with it and read the Facebook documentation. I'm under the impression that the channel URL has nothing to do with what I'm trying to do. I actually deleted that whole line and it had no effect.
Sébastien | French WordpressDesigner answers:
try this plugin lawrence
http://wordpress.org/extend/plugins/facebook/
try it and all your problems will be solved
Lawrence Krubner comments:
Hmm, that is great, but, again, I don't think it will work on such an old site.
Daniel Yoen answers:
try this :
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:comments href="{$baseurl}" num_posts="50" width="500"></fb:comments>
hope this help :)
Daniel Yoen comments:
or try to add link in variable like :
<?php $link = "http://" . $_SERVER['HTTP_HOST'] . $_SERVER['REQUEST_URI']; ?>
<script src="http://connect.facebook.net/en_US/all.js#xfbml=1"></script>
<fb:comments href="<?php echo $link; ?>" num_posts="50" width="500"></fb:comments>
hope this help :)
Lawrence Krubner comments:
Nice trick!
Navjot Singh answers:
Are you sure you are also adding the following line in your single.php file?
<div class="fb-comments" data-href="<?php the_permalink(); ?>" data-num-posts="10" data-width="470"></div>
Luis Abarca answers:
<div id="fb-root"></div>
<script>(function(d, s, id) {
var js, fjs = d.getElementsByTagName(s)[0];
if (d.getElementById(id)) return;
js = d.createElement(s); js.id = id;
js.src = "//connect.facebook.net/en_US/all.js#xfbml=1&appId=xxxxxxxxx";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
<div class="fb-comments" data-href="<?php echo get_permalink( get_the_ID() ) ?>" data-num-posts="2" data-width="470"></div>
xxxxxx = your FB App ID
Lawrence Krubner comments:
I delete this, right?
<div id="fb-root"></div>
I just use this instead, yes?
<div class="fb-comments" data-href="<?php echo get_permalink( get_the_ID() ) ?>" data-num-posts="2" data-width="470"></div>