facebook page like button on website Popup & sidebar

How to add facebook like box to your website?

 

If you are in WordPress platform you can use plugin directly from WordPress directory. otherwise if you are using another platform like blogger, drupal etc. you can manually generate code and copy the same, add as a widget in WordPress or blogger.

Two parts of the Code

1 is javascript

2nd DIV tag where you want to show the Facebook like button.

here is the demo to add facebook fan page to your website.

if you have jetpack plugin already installed on your WordPress website. just click enable facebook like box module and go to Appearance widgets. you can select facebook like box. just add your FB page username or Page ID,

you may see your fb Fan page on your website.

get fb like button from here https://developers.facebook.com/docs/plugins/page-plugin

FB Fan page Like box within posts.

Just composed as a text editor or in HTML paste the code and publish. you can view Facebook like button within post.

or if you want facebook like button at end or beginning of the post you have look at social share button for the website.

 

Adding FB like box to website is ery simple task. but Reason for posting this Article page SIZE and speed recommendation problem by google pagespeed insights.

Because Facebook like box javascript Size is 1.12MB(optimal website size is 512 to 1 MB only including HTML, Image, JS,CSS all the script) but here FB pan page script only have 1MB. but we are not hosting the JS it served by Facebook itself.

Download the script is necessary to view the FB like box.

Solution: Google page speed insights suggestion is Compress the Javascript. but we cannot do that because its not our website, All we have to do that,

access the external Facebook javascript by visiting URL, copy the javascript, compress javascript using online tools (compressing the script means removing unnecessary spaces and comments only),

if we use caching plugins like w3tc and wp super cache, we can host Facebook javascript in our WordPress directory and the plugins automatically compress the javascript.

Facebook page javascript 1.1 MB not only includes like box widget maybe facebook placed all the code at 1 one place. we have to separate the code from them and use for FB page.

for this we have to check Lightweight facebook like box plugins in WordPress directory.

compress facebook javascript

we need facebook js for every component from facebook, FB share and like

box, widget and comment system too.  I have tried copying external JS & compressed hosted at google drive but not worked for me.

so i have to checked out how lightweight FB WordPress plugins used that javascript.

google page speed insightt saying its 1.2MB, we have to use

pingdom and Gtmertix  not caught this an error but google pagespeed only.

usedthe plugin same problem (WP Facebook FanBox)

Jetpack facebook like box plugin also same suggestion compress js (page speed score 30 in google insights).

InstLLED FACEBOOK officila plugin by facebook.

many features ability to add likebox, send, share button before after the page. recommoded posts by by facebook widget as sidebar. fb recent activity and lot of other features. 20,0000+ Active installs.

same problem.

i have to test again.