How to Embed a Facebook Page in WordPress

Want to showcase your lively Facebook content right on your WordPress website? You're in the right place. Embedding your Facebook Page not only adds fresh content but also builds trust and encourages site visitors to follow your social channels. This guide breaks down exactly how to do it using two simple, step-by-step methods.

Why Bother Embedding Your Facebook Page?

Before getting into the how-to, let's quickly cover why this is a smart move for your brand. Integrating your Facebook Page directly into your WordPress site isn't just about looks, it's a strategic way to cross-promote your content and build your community without forcing visitors to leave your website.

• Boost Social Proof and Trust: When a new visitor lands on your site, an active Facebook feed full of posts, comments, and likes instantly shows that you have an engaged community. It acts like a live testimonial, signaling that your brand is active, credible, and trusted by others.
• Increase Your Facebook Followers: Your website traffic is valuable. By placing a "Like" or "Follow" button right next to your feed, you create a direct path for website visitors to join your Facebook audience with a single click. It's a low-friction way to convert site visitors into long-term followers.
• Keep Your Website Content Fresh: Search engines favor websites that are updated regularly. An embedded feed automatically pulls your latest Facebook posts onto your site. This means every time you post on Facebook, you're also adding fresh, dynamic content to your WordPress pages, all with zero extra effort.
• Improve Visitor Engagement: An interactive feed gives visitors more to do on your site. They can scroll your posts, watch your videos, and get a better sense of your brand's personality, which keeps them on your pages longer. This increased "dwell time" is a positive signal to search engines and can help improve your rankings.

Method 1: Using Facebook's Official Page Plugin (The Manual Way)

This approach uses the official tool provided by Meta (Facebook's parent company). It's completely free, doesn't require installing any third-party plugins on your WordPress site, and gives you a good amount of control. It does involve handling a small snippet of code, but don't worry - it's much easier than it sounds.

Step 1: Get Your Facebook Page URL

First, you need the unique web address for your Facebook Page. Open your web browser, navigate to your Facebook page, and copy the full URL from the address bar. It will look something like this: https://www.facebook.com/yourpagename.

Step 2: Configure the Page Plugin

Next, you'll use Facebook's official configuration tool to customize how your feed will look.

1. Navigate to Meta's Page Plugin developer page.
2. You'll see a Configurator with several settings and a live preview on the right.

Let's walk through the options:

• Facebook Page URL: Paste the URL you copied in the first step here. The preview will instantly update to show your page.
• Tabs: This lets you choose what content to show. You can enter timeline, events, or messages. For most people, timeline is the best option as it displays your recent posts.
• Width &, Height: You can set specific dimensions in pixels. However, for most modern websites, it's best to leave these blank. Doing so helps the plugin automatically adapt to the screen size, making it responsive on both desktop and mobile devices.
• Use Small Header: Ticking this box provides a more compact, minimalist look for the header section of the feed.
• Hide Cover Photo: If you want to save space or prefer a cleaner design, you can choose to hide your page's cover image from the feed header.
• Show Friend's Faces: This option helps boost social proof by showing a logged-in visitor if any of their friends already like your page.

Play around with these settings until the preview looks just right for your site's design.

Step 3: Get the Code

Once you're happy with the preview, click the blue "Get Code" button. A pop-up will appear with two boxes of code. It might look a little intimidating, but we only need to copy and paste them.

The first box contains the JavaScript SDK. This is a script that powers the plugin. The second box contains the actual code that places the feed on your page.

Step 4: Add the Code to Your WordPress Site

Now it's time to add these two pieces of code to WordPress. The easiest and safest way to do this without editing theme files is to place them directly where you want the feed to appear using a Custom HTML block.

1. Log into your WordPress dashboard and open the page or post where you want to embed the Facebook page. You can also do this in a widget area for your sidebar or footer by going to Appearance >, Widgets.
2. Click the `+` icon to add a new block and search for "Custom HTML." Select it to add the block to your page.
3. Go back to the Facebook Page Plugin pop-up. Copy the code from the first box (the SDK) and paste it into the Custom HTML block.
4. Hit "Enter" to create a new line in the same block. Then, copy the code from the second box (the plugin code) and paste it directly underneath the first bit of code.

Your Custom HTML block should now contain both snippets of code, one after the other. It will look something like this:

<,!-- The First Snippet (JavaScript SDK) -->,
<,div id="fb-root">,<,/div>,
<,script async defer crossorigin="anonymous" src="https://connect.facebook.net/en_US/sdk.js#xfbml=1&,version=v15.0" nonce="abc12345">,<,/script>,

<,!-- The Second Snippet (Display Code) -->,
<,div class="fb-page" data-href="https://www.facebook.com/yourpagename" data-tabs="timeline" data-width="" data-height="" data-small-header="false" data-adapt-container-width="true" data-hide-cover="false" data-show-facepile="true">,<,blockquote cite="https://www.facebook.com/yourpagename" class="fb-xfbml-parse-ignore">,<,a href="https://www.facebook.com/yourpagename">,Your Page Name<,/a>,<,/blockquote>,<,/div>,

Click "Update" or "Publish" on your page. Now, go view the page on the front end of your site. Your fully functional Facebook page feed should be there!

Method 2: Using a WordPress Plugin (The Easy Way)

If handling code isn't your thing, a dedicated WordPress plugin is a fantastic alternative. Plugins offer a much more user-friendly experience, more robust customization options, and remove the need to ever copy or paste a single line of code. Our recommendation for a reliable and popular choice is the Smash Balloon Social Post Feed plugin.

Why Use a Plugin?

• No Code Required: The setup is done through a user-friendly visual interface.
• Extensive Customization: Easily change colors, layouts, fonts, and which parts of a post (author, date, likes, comments) to display, all without knowing any CSS.
• Reliability and Support: Good plugins are regularly updated to stay compatible with changes from both WordPress and Facebook. They also come with documentation and support if you run into an issue.
• Optimized for Performance: Plugins like Smash Balloon have built-in caching systems that prevent their feeds from slowing down your site too much.

Step-by-Step Guide: Using the Smash Balloon Plugin

Step 1: Install and Activate the Plugin

In your WordPress dashboard, navigate to Plugins >, Add New. In the search bar, type "Smash Balloon Social Post Feed." The official plugin should be the first result. Click "Install Now" and then "Activate."

Step 2: Connect Your Facebook Page

Once activated, the plugin prompts you with a setup wizard that makes things super simple.

1. Navigate to Facebook Feed >, All Feeds from your WordPress menu and click "Add New."
2. You'll be asked to select a feed type. Choose "Timeline."
3. Next, you'll need to connect a source. Click "Add New Source" and follow the on-screen prompts to securely log in to your Facebook account and grant the plugin permission to access your page.
4. Select the Facebook page you want to display and click "Next."

Step 3: Customize Your Feed

This is where plugins really shine. Smash Balloon gives you a live preview and tons of easy-to-use customization toggles. You can:

• Choose from pre-made templates like Default, Modern, or Widget.
• Change the feed layout (list, grid, or carousel).
• Adjust the color scheme to perfectly match your brand's existing look.
• Show or hide elements like the header, "like" box, author name, or post text.
• Configure the "Load More" button to let users see older posts.

Take a few minutes to customize the feed until it looks exactly the way you want it. Remember to click "Save" after making your changes.

Step 4: Embed the Feed on Your Site

After saving your feed, embedding it is incredibly easy. The plugin gives you two options:

1. Using the Dedicated Block: Edit the page or post where you want the feed to appear. Click the `+` icon to add a new block and search for "Facebook Feed." Add the block, and your feed will instantly appear.
2. Using the Shortcode: The plugin also provides a shortcode for your feed (it will look like [custom-facebook-feed]). You can copy this shortcode and paste it into a "Shortcode" block on any page, post, or text widget.

Update your page, and you're all set! You now have a beautiful, fully customizable Facebook feed integrated directly into your site.

Best Practices for Your Embedded Facebook Page

You're all set up, but where should you actually put your new Facebook feed for the best results?

• Sidebar: Placing the feed in your blog's sidebar is a classic choice. It keeps your social presence visible on multiple pages without being too intrusive.
• Footer: The website footer is another popular spot. Visitors often scroll down to the bottom of a site for contact information or links, making it a great place to showcase your social feed.
• About Page: Add the feed to your "About Us" page to add personality and a human element. It shows the living, breathing side of your brand and its community.
• Dedicated "Community" Page: If you're active on multiple social channels, consider creating a dedicated "Community" or "Follow Us" page where you can embed feeds from Facebook, Instagram, and more, creating a social hub for your visitors.

Finally, a quick note on performance: while a feed adds great value, it is loading external content. To keep your site running fast, consider limiting the number of posts displayed initially (5-10 is a good starting point) and use a plugin with caching capabilities like Smash Balloon.

Displaying an active page on your site builds credibility, but that strategy depends on your Facebook page being consistently updated with engaging content. That's an area where we can help. I built Postbase to streamline the entire process of social media management. Using our simple visual calendar, you can plan, schedule, and publish content across Facebook, TikTok, Instagram, and all your other platforms from one clean dashboard. It's designed for modern social media - especially short-form video - and built to be reliable, eliminating the headaches of failed posts or disconnecting accounts. If you want to make sure your Facebook feed always shows off your best content, give it a look.