How to Embed Facebook into Your Website like a Boss

Facebook may no longer be the darling of the Millennials or Generation Z, but it is still the most popular social network in the world. It is also the de facto social network for businesses, with 80 million small and medium-sized business pages. This is more than double the number of business pages on (business specialist social network) LinkedIn, which has profiles for 30 million companies.

With Facebook use so widespread, it should be no surprise that many organizations choose to embed parts of their Facebook feed into their websites.

Having to make separate updates to both your website and your Facebook page can be a hugely time-consuming process. Being able to embed Facebook into your website can make life considerably easier for many social media/website managers.

There are a variety of ways that you can achieve this aim. We cover some of them here.


How to Embed Facebook into Your Website:


Install a Plugin or Widget

If you operate a WordPress website, then one of the easiest ways to embed Facebook on your site is to use a plugin or widget.

You can choose between official Facebook plugins or third-party versions.

Official Plugins

You can find several useful plugins at the Facebook for Developers website that might meet your needs. These include:

  1. The Page Plugin – this lets you easily embed and promote any public Facebook Page on your website. Your visitors can like and share the Page without leaving your site. You can use the Page plugin for any Page that is not restricted.
  2. The Comments Plugin – this lets people comment on content on your site using their Facebook account. They can choose to share their comment activity with their friends (and friends of their friends) on Facebook as well. Quite a few websites now choose to use the Facebook Comments Plugin, rather than allowing traditional WordPress comments on their website.
  3. The Quote Plugin – this lets people select text on your page and share it on Facebook, so they can tell a more expressive story.

Third-Party Plugins and Widgets

Facebook doesn’t have a monopoly on providing plugins to help with this process. You will also find a range of third-party plugins that help you embed parts of Facebook posts on your website. Some examples include:

  1. 10Web Facebook Feed – Custom Facebook Feed Plugin – this allows you to Integrate customized content to your WordPress website from Facebook. It provides features to display a wide range of content from any page with full control over the content length, type, and styling. You can display an entire timeline of the feed with all its content, or just specific photos, videos, links, and statuses from it.
  2. WP-Chatbot for Facebook Messenger Customer Chat – this adds a Facebook Messenger chat widget to your website. It adds live chat to your website, helps you convert more leads, and engage your customers, even after they’ve left your website.
  3. Magic Embeds – this automatically embeds any content from Facebook directly into your site just by copying the URL into the editor, using short codes or the new embed block. These include both Custom Embeds entirely native to this plugin and Social Plugins, which are pieces of code created by Facebook developers.
  4. Custom Facebook Feed – this displays multiple feeds from any public Facebook page and completely matches the look and feel of the site. They are completely customizable, responsive, and search engine crawlable.

Use a Facebook Button on Your Website

People love engaging with the people and brands they follow on Facebook. This is even more so now that Facebook changed its Like button to represent a range of emotions. Website commenting has reduced in importance over the last few years because people prefer to carry out their discussion on Facebook instead. Even forums are now becoming redundant, with more and more conversations occurring on Mark Zuckerberg’s baby.

If you want your audiences to engage in some way via Facebook, then you can easily place suitable social media buttons on your website. You would put them anywhere that would attract attention (likes, comments, shares, etc.), for example, your Home page, headers, footers, and blog posts.

You don’t need them everywhere, however. For instance, there is little point putting Facebook buttons on your Privacy Page, About Page, or individual items in your product catalog.

You can choose to add an official button, using the provided code, or again opt for a third-party social media buttons plug-in.


Official Buttons

The Facebook Developers Social Plugins page gives access to a range of these buttons. The advantage of using the official buttons (rather than somebody else’s plug-in) is that they are usually more customizable. Facebook do consider you a developer when you use their buttons. On the other hand, you are limited to the buttons provided by Facebook.

  1. The Like Button – the easiest way for somebody to interact with your website is to click on a Facebook Like button to show their appreciation for your content. As you can see from the linked Facebook for Developers page, they do provide step-by-step instructions on how to install a Like button on a specific page of your website. It is up to you where you place your Like button, and whether you show the number of likes (we would only really recommend showing Like numbers if you regularly receive a good number of likes on your posts).
  2. The Share Button - this lets people add a personalized message to links before sharing on their timeline, in groups, or to their friends via a Facebook Message. This takes more thought than a merely clicking on the Like button (although there is no compulsion for people to write the personalized message – they can simply copy and paste your link if they choose.
  3. The Send Button – the Send button is merely a variation of the Share button. It’s designed to allow people to share content privately with particular people, either to specific friends on Facebook, a group or in a private message.
  4. The Save Button – this lets people save items or services to a private list on Facebook, share it with friends, and receive relevant notifications.

Third-Party Plugins and Widgets

If you have a WordPress website, you’re just as likely to use a plug-in for a Facebook button as you are for any other embeds. In reality, most people opt to use a plug-in the provides buttons for multiple social networks, and then choose to use the buttons for the most popular networks for their audience. There is little point using buttons for every social network available if your audience only spends time on Facebook and Instagram, for example.

There are many useful third-party plug-ins (and others come integrated with packages of WordPress tools). Most only come with buttons for social shares, but you get a far more extensive range of graphic styles than if you rely on the official developer buttons. Some examples include:

  1. Shared Counts – this includes social sharing buttons to Facebook, Pinterest, Yummlu, Twitter, and LinkedIn, along with email sharing, share count totals, and a Print button. A number of these (including Facebook) support social count display and tracking. You can select from multiple button styles, ensuring that they suit the layout of your site.
  2. Sassy Social Share – this provides a vast range of social sharing options. Facebook is just one of over 100 social sharing and bookmarking services you can select. You can show share counts if you want them for some of the networks, including Facebook. You can also select a Facebook Like button. The plugin comes with three basic styles: rounded, square, or rectangle buttons.

Use Facebook Live Player

Facebook live has grown in popularity since its introduction. While Facebook has a problem stopping their Live videos being used for objectionable purposes (e.g., the Christchurch Mosque bomber broadcast his entire massacre live over the service), it has undoubtedly become a favorite marketing tool for businesspeople on Facebook.

The Facebook Developers page has code enabling you to embed both Facebook Videos and Facebook Live videos into your website. Indeed, you can embed any public video post into your site. Note that this clearly does not include trying to embed Facebook broadcasts of live sport or other copyright material.

It isn’t yet as simple as embedding YouTube video, but you can still do it. You effectively perform a three-step process:

  1. Pick the URL of a Facebook video you want to embed
  2. Paste the URL to the Code Configurator and click the "Get Code" button to generate your embedded video player code.
  3. Copy and paste the snippet into the HTML into your destination website.

If a Facebook video is set to public use, then you can just manually transfer the code from an existing Facebook video post. Click the options menu of the Facebook video player and then choose the “Embed video” option (it will only appear for public videos). You can then paste that code into your website.


Embed Facebook Posts

You can use Facebook for Developer’s Embedded Posts Code Generator to embed public Facebook posts directly into your website.

You can get the embed code directly from the post itself. If the post is public, click on the icon that appears in the top right corner of the post on Facebook and select Embed post. In the case of a photo post, you should see an Embed Post button on the bottom right.

There are other ways you can embed your post. These are listed on the relevant Facebook Developers page. Facebook currently notes that a new, easy WordPress integration will be released shortly.

Do NOT follow this link or you will be banned from the site!