Embedding Facebook Plugins into Custom Widgets

Learn how to embed a Facebook plugin, like your organisation's page, into your project page (and homepage on Torquay)

Gayathri Rajendiran avatar
Written by Gayathri Rajendiran
Updated over a week ago

Embedding Facebook Plugins in EngagementHQ is straightforward, but it does require copy and pasting a little bit of HTML code. 

Facebook has a range of plugins available, with the 'Page Plugin' arguably being the most appropriate one in the context of your project pages. 

While working with an embed code for the first time can be a little daunting, it is really quite simple and you will get used to it quickly. Below is a short video on how to configure this at Facebook's end (this is correct as of November 2020). As you can see, we are configuring the embed for Bang the Table's profile page with a width of 355 pixels. 

At the end of the video, we are copying an Iframe code, which you can see below. 

<iframe src="https://www.facebook.com/plugins/page.php?href=https%3A%2F%2Fwww.facebook.com%2Ffacebook&tabs=timeline&width=355&height=500&small_header=false&adapt_container_width=true&hide_cover=false&show_facepile=true&appId" width="355" height="500" style="border:none;overflow:hidden" scrolling="no" frameborder="0" allowfullscreen="true" allow="autoplay; clipboard-write; encrypted-media; picture-in-picture; web-share"></iframe>

This is the code you need to take to embed your Facebook page into your EnagagementHQ site, most likely a custom widget on a project page. This final step is shown below. 

Don't worry if the plugin doesn't full cover the editor's width when you first copy it in. If you are embedding this into your project page custom widget, the ideal width of the embed will be 355px.

There are other plugins Facebook provides that might be interesting. While there will be subtle differences in configuration, they will all most likely provide you with an embed code to paste into EnagagementHQ, hence the steps described above are the same. 

Contact our support team if you need any further assistance via chat or email support@engagementhq.com

Did this answer your question?