Adding Facebook feed to website

Adding A Facebook Feed on Your Website

Have you noticed businesses that have their Facebook feed embedded directly on their website? Did you think that Facebook had discontinued that feature? Well, they did! But this year they released a new and improved way of adding a Facebook feed to your WordPress website. Facebook calls it a page plugin now, and it’s even easier for your customers to follow you on Facebook, without ever leaving your website.

Now to do this you need a wee bit of code to add to your website, but Facebook gives you everything you need, so don’t fret! You can get this code by going here on the Facebook For Developers page.  On this page enter the URL of the Facebook page you would like to embed on your website.

Facebook Feed Options

Select if you want to show the header image, or cover photo, if you want your pages friends faces to be visible (I usually uncheck that option, I think it gets too cluttered looking with all those faces), then make sure the adapt plugin to container box is checked. That ensures where ever you put it on your website the box will fit the space provided.

My favorite new feature that Facebook added with this plugin are the tabs. You can specify if you want your Facebook events tab to be visible on your website plugin, or even allow people to submit Facebook messages directly on your website!

Facebook plugin optionsTo do this in the tabs field, after timeline, add the tabs you would like to show, separated by commas.

Once you have all your options selected, you will see a preview of what your plugin will look like on your website.

FAcebook feed options for website

 

 

 

 

 

 

 

 

 

If it looks correct, go ahead and click on ‘Get Code’.

plugincode

A new box will pop up showing you the code to enter on your website.

Enter the lower box code on your website directly where you want the plugin to appear. In a sidebar or footer widget, or directly on a page. Just make sure when you paste in the code you are on the Text or HTML tab, not the visual tab on your page.

HTMLfield

 

Once you save the code to place your plugin, and saved your page, the next step is the trickiest. On your WordPress dashboard go to Appearance > Editor, and click on Theme Header on the right.

Preferably you are using a child theme, so this page will be mostly blank. Below the last line paste in the top box of code you received from Facebook, and click update File.

Facebook Feed OptionsNow go back to the page you added the plugin to, and check out your handy work!
You are now a pro at adding a Facebook feed to your website! Great job!

 

*Disclaimer: I am by no means an HTML expert. This is just what I have learned by adding the Facebook plugin to my websites, and customer website I have created. Different WordPress themes, and plugins can react differently when you edit the header.php on your website. I recommend backing up your website before making any changes in the Editor. If you are not comfortable editing your website this way, contact your web developer or drop me a line today!

 

Leave a Reply

Your email address will not be published.