Monday, 4 May 2015

Add Facebook Fan Page widget/plugin to Blogger/blogspot using Shortcode

The New Facebook Page plugin is creating a lot of attention on the internet as many bloggers and webmasters are finding it hard to embed it, The Facebook page widget for Blogger is a new advanced plugin which keeps your blog readers right into your site instead of sending them out to Facebook because Facebook is a very addictive site I believe nobody would like to lose readers to it.
In this post I will share a short tutorial that will give you a simple way in which the page widget can be embedded to Blogger.

NB: Please make sure you have added the Shortcode Plugin to your Template

Must Read : Add The Shortcode Plugin to Blogger/Blogspot

Adding Facebook Java script SDK


Add Facebook Fan Page widget/plugin to Blogger/blogspot

Step 1: Go to Blogger dashboard>>>Template>>>Edit Html   to open the template code.

Step 2: on your template search for this code : 

<body>

Step 3: Just below body paste the following code


<div id='fb-root'/>
<script>
//<![CDATA[
(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.3";
  fjs.parentNode.insertBefore(js, fjs);
}(document, 'script', 'facebook-jssdk'));
//]]>
</script>


Adding the Facebook Page widget to Blogger Post/page

Step 1 : On your Blogger dasboard, go to New Post/Page

Step 2 : Change your settings from Compose to HTML .

Step 3 : Paste this Facebook shortcode on the empty page


[facebook src="ajaxsurf" width="500" height="400" hide-cover="true" posts="true"/]

Step 4 : Press Publish and view your Facebook page widget in your blogspot blog.

Adding Facebook shortcode on Blogger sidebar

Step 1: Go to Blogger dashboard>>>Layout>>>Add Widget>>>Javascript/Html

Step 2: Paste the shortcode on the empty box and add the title you want for the Widget.

[facebook src="ajaxsurf" width="500" height="400" hide-cover="true" posts="true"/]

Step 3: Press Save to publish the widget to blogger.








And once you are done then the Facebook page plugin will show on your blog  and to adjust it the way that suites you, you will have to make  these changes.

Sifiso Nkwanyana

Author & Editor

Has laoreet percipitur ad. Vide interesset in mei, no his legimus verterem. Et nostrum imperdiet appellantur usu, mnesarchum referrentur id vim.

2 comments:

  1. If you are looking forward into joining the world-online trading community you will need a professional guidance to make your way to the top.
    http://www.scorpionfx.com/

    ReplyDelete
  2. Thank you for your great post. It's really very informative and really helpful. Please Keep posting. Thanks again.
    23traders

    ReplyDelete

Although every comment is appreciated, due to time limitations I might not be able to respond to everyone. Keep it in mind that we respect all comments by our readers but all spam comments and spam links will be deleted. Thanks for understanding!