Facebook share button


(james koh) #1

how do i put Facebook share button into my hype work?

i got this code from Facebook developers.

  1. Include the JavaScript SDK on your page once, ideally right after the opening 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.net/en_US/sdk.js#xfbml=1&appId=352304691646566&version=v2.3";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>
 2. Place the code for your plugin wherever you want the plugin to appear on your page.

> <div class="fb-share-button" data-href="https://developers.facebook.com/docs/plugins/" data-layout="button_count"></div>


Social Share Buttons: Twitter, Facebook & Google+
(Andrew) #2

Are you putting the HTML in an HTML-widget, or a rectangle ?


#3

One thing I’ve noticed is that especially when previewing, you’ll need to include the full URL of this, so it would be:

https://connect.facebook.net/en_US/sdk.js#xfbml=1&appId=352304691646566&version=v2.3

or

http://connect.facebook.net/en_US/sdk.js#xfbml=1&appId=352304691646566&version=v2.3

When you don’t include the protocol, that URL will try to access the file system and fail.

So place this in the head (You can edit the contents of the … of your exported .html file by clicking on ‘Edit HTML Head’ in the Document Inspector.)

<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 = "https://connect.facebook.net/en_US/sdk.js#xfbml=1&appId=352304691646566&version=v2.3";
      fjs.parentNode.insertBefore(js, fjs);
    }(document, 'script', 'facebook-jssdk'));</script>

And this within a rectangle’s inner HTML:

<div class="fb-share-button" data-href="https://developers.facebook.com/docs/plugins/" data-layout="button_count"></div>

(james koh) #4

well i tried both and rectangle works fine.


(james koh) #5

Thank you @Daniel.
i really appreciate your answer.
now it works fine.