Show Mobile Navigation

Ads

Wednesday 8 May 2013

,

Facebook Like Button for Websites

Unknown - Wednesday, May 08, 2013

Facebook Like Button For Websites

The Like button lets a user share your content with friends on Facebook. When the user clicks the Like button on your site, a story appears in the user's friends' News Feed with a link back to your website.
To integrate facebook like button to your website,first you have to create a facebook page for your website.
 

Follow the below steps to Generate Code and integrate into your website Step 1: Open this URL, https://developers.facebook.com/docs/reference/plugins/like/
Step 2: Configure and Generate Code
Type your Facebook page URL like below Ex: https://www.facebook.com/mobiappswebpage
If you want Send button keep the check box right otherwise remove the check box selection
Adjust the Width, default width of Like button 450.like below
facebook like button for websites

After completion of all these steps click on Get Code. Pop up will show like below.

facebook like button for websites

Step 3:  Copy and paste the first box code after the opening <body> tag in webpage.

<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";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>

Step 4:  Copy and paste the second box code your plugin wherever you want the plugin to appear on your web page.
<div class="fb-like-box" data-href="http://www.facebook.com/mobiappswebpage" data-width="240" data-show-faces="true" data-stream="false" data-header="false"></div>
Finally, Whole HTML code look like this:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <title>facebook like button | mobiappsweb.com</title>
</head>
<body>
<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";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));</script>
  <div class="fb-like-box" data-href="http://www.facebook.com/mobiappswebpage" data-width="240" data-show-faces=
"true" data-stream="false" data-header="false"></div>
</body>
</html>


0 comments:

Post a Comment