Facebook Like Box allows website owners to provide their visitors with an easy way to join their facebook community and get updates right in their Facebook news feed with a click to like from their website. It is a good way to promote a Facebook Page. Facebook Like Box only works for Facebook Pages, this isn’t working for Facebook Profiles
Adding Facebook Like manually without a plugin
Login to your Facebook account. Go to Facebook Social Plugin’s Like Box page. Provide the URL of your Facebook page and configure the looks of the like box.
There three methods to add Facebook Like Box after we click Get Code button, HTML5, IFRAME and XFBML.
HTML5
As instruction say there, copy the first part of the code (JavaScriptSDK) and paste it right after <body> tag which is usually found in header.php file, e.g
&lt;/pre&gt; &lt;div id="fb-root"&gt;&lt;/div&gt; &lt;pre&gt;&lt;script&gt;// &lt;![CDATA[ (function(d, s, id) { var js, &lt;span class="hiddenSpellError" pre="" data-mce-bogus="1"&gt;fjs&lt;/span&gt; = 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&amp;appId=370859723023930&amp;version=v2.0"; fjs.parentNode.insertBefore(js, fjs); }(document, 'script', 'facebook-jssdk')); // ]]&gt;&lt;/script&gt;After that we could copy second part of code underneath first part of code
&lt;div class="fb-like-box" data-href="https://www.facebook.com/PixelInsert" data-colorscheme="light" data-show-faces="true" data-header="true" data-stream="false" data-show-border="true"&gt;&lt;/div&gt;This part of the code tells JavaScript SDK that we loaded earlier to display the like box at this location with these parameters.
We are using Text Widget to add Facebook Like Box to sidebar of our site. Go to Appearance » Widgets. Drag and drop a text widget to your sidebar and paste all inside it. Save the text widget
IFRAME
Iframe is the easiest way to add Facebook Like Box. Drag and drop a text widget to your sidebar, copy iframe code from Facebook Social Plugin’s Like Box and paste iframe code inside it. Save the text widget. That’s it
XFBML
Steps to add XFBML almost same with HTML5 method, except for XML Namespace.
xmlns:fb="http://ogp.me/ns/fb#"&gt;Add XML Namespace to the <html> tag of your header.php, before <body>
After that, copy first code and third code (JavaScript SDK and fb:like-box) from Facebook Social Plugin’s Like Box and paste the code inside text widget
Change Facebook Like Box language (localization)
HTML5 and XFBML
Find following code in JavaScript SDK
js.src = "//connect.facebook.net/en_US/sdk.js#xfbml=1&amp;appId=370859723023930&amp;version=v2.0";See en_US in above code, change it to local language
IFRAME
We need to add locale operator to iframe code, e.g
&lt;iframe src="//www.facebook.com/plugins/likebox.php?locale=fr_FR&amp;href=https%3A%2F%2Fwww.facebook.com%2FPixelInsert&amp;width&amp;height=290&amp;colorscheme=light&amp;show_faces=true&amp;header=true&amp;stream=false&amp;show_border=true&amp;appId=203533006486565" scrolling="no" frameborder="0" style="border:none; overflow:hidden; height:290px;" allowTransparency="true"&gt;See this part of code above
locale=fr_FR
Leave a Reply