Joomla does not natively support embedding Facebook posts in articles. If you’ve attempted it before, you may have noticed Joomla either removes the embed code or fails to display the post.
The good news? There’s a simple workaround! Follow these steps to successfully embed a Facebook post in your Joomla article.
Step #1: Install the Sourcerer Plugin
- Go to this page and download the Sourcerer plugin from Regular Labs. This plugin allows you to insert custom code into Joomla articles.
- Install the plugin on your Joomla site and ensure it is enabled.
Step #2: Copy the Facebook Embed Code
- Click on the required Facebook post timestamp:
- The post will open in a mini-window. In the top-right corner, click the three-dot icon:
- In the popup menu, click Embed:
- Your post mini-window will change to the "Embed Post" screen. Click the Advanced settings link:
- This redirects you to the Embedded Posts area on developers.facebook.com. Click the Get Code blue button:
- You will see a new window with the JavaScript SDK tab open. The Step 2 and Step 3 boxes contain two snippets of the post embed code you will use in a minute:
Step #3: Insert the Embed Code into Joomla
- Open your Joomla admin dashboard and navigate to the article where you want to embed the post. Click CMS Content > Code:
- A mini-window titled "Code" will open, displaying an Insert button and a Code box:
- Go back to developers.facebook.com and copy the two JavaScript SDK code snippets from the Step 2 and Step 3 boxes:
- Paste both code snippets into the Code box inside your Joomla article. Your Code box should now look like this:
- Look for
data-width="500"
in your embed code and erase500
, replacing it withdata-width=""
. This change allows the embedded Facebook post to scale properly, ensuring it looks great on both desktop and mobile screens:
- Click the green Insert button. The code will now appear inside your Joomla article as you can see it in the next image:
- Click Save or Save & Close.
- Visit the article's front page to preview the embedded post in a desktop browser:
- Finally, test the article on your mobile phone to confirm it displays correctly:
🎉 That’s it! You’ve successfully embedded a Facebook post into your Joomla article.
What's Next?
Save $1,000's when you sign up for Joomlashack's Everything Club.
You will get your hands on our extensive range of over 20 extensions, plus legendary support!