How to Add Instagram and Facebook to Your Website

Starting October 24th, 2020, there is no opportunity to automatically embed Facebook and Instagram content in WordPress using the default methods due to a breaking change in the Facebook API. Facebook now requires each developer to register an app, and use a client token when getting data from their Graph API for oEmbed content.

The easiest and most beginner friendly way to display embed Instagram and Facebook posts is to use the Smash Balloon free Social Photo Feed plugin, and Social Post Feed plugin. When using the Smash Balloon plugins you don’t need to go through a process of creating your own app.

Another solution for embedding Facebook and Instagram posts in Block Editor (Gutenberg) and Classic Editor is to use the oEmbed Plus plugin.

How to setup the Social Post Feed plugin

Formerly "Facebook Feed"

After installing and activating the Social Post Feed plugin proceed to the Settings tab and connect a Facebook Account.

Here you can find an instruction on how to setup the plugin: https://smashballoon.com/doc/setting-up-the-free-custom-facebook-feed-wordpress-plugin/

To display the Facebook embeds proceed to </> oEmbeds tab and click on the ‘Connect to Facebook and Enable oEmbeds’ button.

You’re all set! To embed the Facebook post just copy its URL and paste it in the Text Editor widget (using Elementor) or Embed block (using the Block editor).

How to setup the Social Photo Feed plugin

Formerly "Instagram Feed"

After installing and activating the Social Photo Feed plugin proceed to the Settings tab and connect an Instagram Account.

Here you can find an instruction on how to setup the plugin: https://smashballoon.com/doc/setting-up-the-free-instagram-feed-wordpress-plugin/

To display the Instagram embeds proceed to </> oEmbeds tab and click on the ‘Enable Instagram oEmbeds’ button. As Instagram is part of Facebook, in order to display Instagram embed posts, you must connect to Facebook.
You’re all set! To embed the Instagram post just copy its URL and paste it in the Text Editor widget (using Elementor) or Embed block (using the Block editor).

How to setup the oEmbed Plus plugin

This plugin implements the new APIs to bring back support for Facebook and Instagram content embedding.

Note that you will need to register a Facebook developer account and create an app to get API credentials that this plugin uses. There is no coding necessary, but an API key needs to be created and set for the plugin.

Detailed setup instructions are available in oEmbed Plus guide.

facebookfaqinstagram
1

Related Articles