Facebook Fan Page Embedded Codes

What is facebook embedded code? how to embedded facebook fan page code? Can I embedded facebook fan page timeline?
Today I will share with you facebook fan page embedded codes.
IF you have blog/website and you need your facebook fan page code so don't worry now its easy to make. Follow all steps and add your facebook fan page to your website/blog


  • 1.  First go to blogger Dashboard>> Templates>> Edit HTML
  • Now search <body> or <body  for easy search Ctrl+F
  • Copy the following code and past after <body> or <body
  • Make sure if you have already added it so please leave this step


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


  • IF this code not added already so add the code and then save your templates
  • Now go to Dashboard>> Layout>> HTML/Javescripts 
  • See the following facebook fan page timeline demo:



  • 2. IF you want to add this to your website so copy the following code

<div class="fb-page" data-href="https://www.facebook.com/Tutorial-Wayz-789245897843803//" data-tabs="timeline" data-width="300" data-height="400" data-small-header="true" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><blockquote cite="https://www.facebook.com/Tutorial-Wayz-789245897843803//" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/Tutorial-Wayz-789245897843803//">Tutorial Wayz</a></blockquote></div>


  • Copy code and make changes then add to your blog/website
  •  on green highlight add your facebook page url
  • on blue highlight add your faceobook page name
  • to change hight or width see the pink highlights area

  • 3.  IF you want to add only page embedded code without timeline just like this:





  • IF you want to add this code to your website/blog so follow step one 
  • then go to Dashboard>> Layout>> HTML/Javescripts 
  • copy the following code then past in HTML/Javascritps make chenges and click save

<div class="fb-page" data-href="https://www.facebook.com/Tutorial-Wayz-789245897843803//" data-width="300" data-height="400" data-small-header="true" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true"><blockquote cite="https://www.facebook.com/Tutorial-Wayz-789245897843803//" class="fb-xfbml-parse-ignore"><a href="https://www.facebook.com/Tutorial-Wayz-789245897843803//">Tutorial Wayz</a></blockquote></div>


  • Before saving please make changes
  •  on green highlight add your facebook page url
  • on blue highlight add your faceobook page name
  • to change hight or width see the pink highlights area

I hope you must enjoy this if you have problem please comment,
IF need facebook page messeges embedded code so please commment.


Subscribe To Get FREE Tutorials!

    TTW Comments
    Facebook Comments

0 comments:

Post a Comment