on my website I have more than 200 pages and I want to add facebook ments feature to my website. I ran to this problem is that I have to change the code (the url) for each page. I do not want to change the code for every page. If you can see the second piece of code contain Url goes here can I include a method like location.href so that it can use the current url of the page. can I do this ? I do not care if it is php, javascript, or anything ealse.
Include the JavaScript SDK on your page once, ideally right after the opening <body> tag.
<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/en_US/all.js#xfbml=1&appId=324524777119";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Place the code for your plugin wherever you want the plugin to appear on your page.
<div class="fb-ments" data-href="Url Goes Here" data-num-posts="2" data-width="470"></div>
on my website I have more than 200 pages and I want to add facebook ments feature to my website. I ran to this problem is that I have to change the code (the url) for each page. I do not want to change the code for every page. If you can see the second piece of code contain Url goes here can I include a method like location.href so that it can use the current url of the page. can I do this ? I do not care if it is php, javascript, or anything ealse.
Include the JavaScript SDK on your page once, ideally right after the opening <body> tag.
<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/en_US/all.js#xfbml=1&appId=324524777119";
fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
Place the code for your plugin wherever you want the plugin to appear on your page.
<div class="fb-ments" data-href="Url Goes Here" data-num-posts="2" data-width="470"></div>
5 Answers
Reset to default 2This can be used for getting the page url on the initial load.
<?php
function get_current_page()
{
$page_url = (@$_SERVER["HTTPS"] == "on") ? "https://" : "http://";
$page_url .= $_SERVER["SERVER_NAME"].$_SERVER["REQUEST_URI"];
return $page_url;
}
?>
<div class="fb-ments" data-href="<?php echo get_current_page(); ?>" data-num-posts="2" data-width="470"></div>
If the url is changed after the initial page loads the FB.XFBML.parse() needs to be called to reload the ment box. This is good for ajax sites that do not do a full page reload when changing state.
You can use div and then dynamically create its contents with the innerHTML method in JavaScript
where it will be your fb-ments tag. You can get the current page with document.location.href.
After you create the fb-ments tag dynamically and render it inside the div, you need to reparse its contents so the XFBML is interpreted. You can do it with the FB.XFBML.parse() method.
var mydiv = document.getElementById('myCommentsDiv');
mydiv.innerHTML =
'<div class="fb-ments" data-href="' + document.location.href + '" data-num-posts="2" data-width="470"></fb:ments>';
FB.XFBML.parse(mydiv);
A simple suggestion is:
<script type="text/javascript">
document.write('<div class="fb-ments" data-href="' + document.location.href + '"
data-num-posts="2" data-width="470"></div>');
</script>
Edit: found the solution here: Different Facebook ment box after each ajax call
You have to remove the box pletely and put it back and call FB.XFBML.parse()
This one worked for me:
I defined the URL like this:
define('URL_FB','http://'.$_SERVER['SERVER_NAME'].$_SERVER['REQUEST_URI']);
and then I echoed like this:
<div class="fb-ments" data-href="<?php echo URL_FB; ?>" data-width="470" data-num-posts="10" data-colorscheme="dark"></div>
Hope to be clear enough. :)