How To Show Facebook Posts On SharePoint Online Modern Page

In this article, we will see how to show Facebook posts on SharePoint modern page.

Introduction

 
SharePoint is mainly being used as a collaborative platform and content management platform internally in many organizations. When you have your intranet portal and department sites in SharePoint, you would  probably also love to have some social feeds on your home page. Providing social updates on internal portals will keep employees updated with what the company is doing.
 
In SharePoint Online, with modern UI and pages, Microsoft has provided one of the social web parts, Twitter, already. You can easily configure it on your modern page. But if you want to show Facebook posts, then there was no out of the box web part available until now. The Microsft Team might be working on it but until then, there is an easy way to achieve this functionality. Let us see how we can do that.
 

Solution

 
We will be using Embed web part and iframe embed code from Facebook Developers’ site. Let’s see the steps in details
 
 
How To Show Facebook Posts On SharePoint Online Modern Page
 
Enter the Facebook page URL as shown below. Get the URL of the Facebook account whose posts you want to show in SharePoint and put that URL below.
 
In my example, I want to show what Elon Musk is up to on Facebook.
 
How To Show Facebook Posts On SharePoint Online Modern Page
 
Keep the timeline word as is in the Tabs section. If you want this iframe to be of a specific size, then provide your specific width and height; if not, keep those empty. Play around with the four options provided, like use small header, hide cover photo, show friends faces, etc. 
 
Check what fits you better and keep those configurations. Once done, click on the “Get Code” button in the bottom.
 
How To Show Facebook Posts On SharePoint Online Modern Page
 
This will generate the HTML, script, and iframe tag with the above configuration. We will just need iframe tag. So, click on the IFrame tab and copy the iframe tag as shown below. Keep this iframe tag handy somewhere, we need to use this on SharePoint page.
 
How To Show Facebook Posts On SharePoint Online Modern Page
  1. <iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Fermusk%2F&tabs=timeline&width=340&height=500&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=false&appId" width="340" height="500" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowTransparency="true" allow="encrypted-media"></iframe>   
Now, let's go to the SharePoint Online site >> modern page >> Edit page.
Click on the + icon to add a new web part.
Select the Embed web part.
 
How To Show Facebook Posts On SharePoint Online Modern Page
 
Edit web part properties by clicking on the edit icon OR click on “Add embed code” button.
Paste the iframe tag copied from developer site as shown below. You will be shown an error like:
 
Embedding content from this website isn’t allowed, but your admin can change this setting. They will need to add ‘www.facebook.com’ to the list of sites that are allowed.
 
How To Show Facebook Posts On SharePoint Online Modern Page
 
Let’s see where we need to add Facebook URL to overcome the above error.
 
Go to Site Settings >> click on “HTML Field Security” as shown below.
 
How To Show Facebook Posts On SharePoint Online Modern Page
 
Enter the domain URL as shown below and click on Add – facebook.com
 
How To Show Facebook Posts On SharePoint Online Modern Page
 
Once added, scroll down and click on OK to save this configuration.
 
How To Show Facebook Posts On SharePoint Online Modern Page
 
Now, go back to SharePoint modern page and try to paste the iframe tag in Embed web part. This will work like a charm now. Check the below screen.
 
How To Show Facebook Posts On SharePoint Online Modern Page
 
That’s it. Facebook posts are integrated to your SharePoint modern page. That’s how it will look once it's saved and published.
 
How To Show Facebook Posts On SharePoint Online Modern Page
 
That’s it for this article. Will come up with more articles like this soon. Thanks for reading.