Are you facing issues with your Facebook and Instagram posts embedded on your WordPress website? After 24th October 2020 Facebook and Instagram deprecated support for the Default Embed feature used by WordPress. So if you have ever used the default oEmbed feature of WordPress to view your Facebook posts and Instagram feed on your website it is very likely to break.
If you are facing this problem then read this article to the end we will show you how can fix the Facebook and Instagram embed issue.
Before going to the fix let us understand in brief the reason behind this issue.
Why did the default Embed feature stopped working?
oEmbed is a protocol that allows users to fetch content from other third-party sites like photos and videos and display it on their website. This protocol was designed to avoid the hectic procedure of copying the HTML code and pasting it on the WordPress Block editor.
WordPress uses this protocol to embed content on WP sites, However, it doesn’t allow every oEmbed provider for security reasons. Some of the top trusted oEmbed providers by WordPress are Facebook, Instagram, Tumblr, Youtube, Vimeo, etc.
Now, Facebook and Instagram oEmbed endpoints are the keys for fetching data. These endpoints can be considered as an API that allows WordPress to pull not only main but also meta-data from their servers. After 24 October Facebook deprecated these endpoints.
Have a look at the official announcement made by Facebook:
“By October 24, 2020, developers must leverage a user, app, or client token when querying Graph API for user profile pictures via UID, FB OEmbeds, and IG OEmbeds. Developers should provide a user or app token when querying for profile pictures via a UID or ASID, though client tokens are supported as well. Please visit our changelog for User Picture, Facebook OEmbed, and Instagram OEmbed for details on how to start calling these Graph API endpoints today.”
Note: Old Facebook and Instagram content on your WordPress site will remain unaffected, this is because WordPress Caches the content and store it in the database. So unless you manually delete values from the database old content will remain unaffected.
These older oEmbed points are known as legacy oEmbed points. For all the new content from users on your site users might receive Error 400.
So Facebook now requires each developer to register an app and get the client token to fetch data from the Graph API for the oEmbed content.
Such a move wasn’t scalable for the WordPress team and hence it was leftover to the WordPress plugins to find a solution for the same.
This is the before and images after 24 October for Facebook and Instagram oEmbed :
Facebook oEmbed before and after 24 October:
Instagram oEmbed before and after 24 October:
What is the Fix to Facebook and Instagram oEmbed issue after 24th October 2020?
Using oEmbed plus plugin:
Now, this is can be considered as the standard method complying with the rules Facebook and oEmbed plus Plugin helps you to implement the new Facebook and Instagram endpoints to embed content on your WordPress website. oEmbed plus is also a third-party plugin developed by Ayesh Karunanartne. Make sure your WordPress hosting provides a PHP version higher than 7.3 otherwise this plugin might not work for you.
Here are the steps to activate and configure the oEmbed Plus plugin:
- Installing the plugin: From the plugins section of WordPress search for the oEmbed plus plugin and install it on your WordPress site.
- Generating an App id on a Facebook developer account: Now you need to create a Facebook developer account if you don’t have it. Click on the “create app” icon.
- Fetching App id and App secret: Once you click on this icon, you need to give a name to the app. An App id and App secret will be auto-generated. Go to settings panel -> Basic. Here you can see the App id and App secret note it down for further steps.
- Changing WordPress settings: Once you have copied the App id and App secret open your WordPress dashboard. Go to settings->Writing screen. Search for Facebook and Instagram Embed settings. Now enter the App id and App secret you have noted earlier.
Well, that is all that needs to be done. This is the method that follows the guidelines of Facebook OEmbed endpoints and now you can continue taking advantage of Facebook OEmbed services.
Using Smash Balloon plugin:
If you are not comfortable with the above standard method of implementing the fix then here is another alternative you can try. Smash balloon plugin helps you implement the new Facebook OEmbed features and restore the old functionality in a very simple way.
Smashballoon is widely used to fetch Instagram and Facebook custom feeds. SmashBallon doesn’t require any extra authentication or creating your own Facebook app to implement the functionality.
If you are already using the Smash Balloon plugin then you need to upgrade it to the latest version to fix the Broken Embeds problem. If you are not using the Smash Balloon plugin then go to the plugin section and just install it. Once you have installed the plugin click on the connect button.
Social media giants like Facebook and Instagram will keep updating their privacy policies and methods of doing work to keep track of data flow and enhance security. This will indirectly affect other users but change is the only constant thing in today’s world. Hope this article was useful to all the WordPress users if you still have any other issues related to WordPress we at wpuber.com a team of WordPress experts are always ready to help you maintain your WordPress site. Always ready to stay up to date with the pool of changes occurring in the technical world daily!