Search code examples
facebookfacebook-graph-apifacebook-javascript-sdkfacebook-sharer

How to add facebook share button on my webpage?

I want to add the standard facebook share button (button_count) as this one: enter image description here

I'm trying to do this a couple of days, so I will need your help. I'm using the code from code placed at this link: developers.facebook.com. So as I understood, I place this code

<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/mk_MK/sdk.js#xfbml=1&version=v2.0";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

right after the <body> tag, and this code

<div class="fb-share-button" data-href="<<here_is_my_URL>>" data-type="button_count"></div>

at the place where I want the button to appear. But when I try to load the page, the button is not showing on my page and I got the error:

   Refused to display 'https://www.facebook.com/undefined/plugins/share_button.php?app_id=&channel…s.facebook.com%2Fdocs%2Fplugins%2F&locale=mk_MK&sdk=joey&type=button_count' in a frame because it set 'X-Frame-Options' to 'DENY'.

How can I implement this functionality on my webpage? It's very important to have the same design as the button in the image above, and to have counter. Any help will be appreciated.

Solution

  • I managed to get it to work. Simply use the XFBML version of the button and not the HTML5.