How to Embed a Facebook Album on Your Website

How to Embed a Facebook Album on Your Website

by Stacey Corrin on June 30, 2020

Are you looking for an easy way to add Facebook albums on your website? Displaying Facebook photos on your site is a great way to showcase your best visual content and engage your visitors.

But embedding albums from Facebook in WordPress is tricky without hiring a developer. So, in this article, we’ll show you how to embed a Facebook album on your website with no technical knowledge required.

Here’s a table of contents to help you navigate this post:

Before we start, let’s explore the benefits of displaying Facebook photos on your website.

Why Embed Facebook Albums on Your Website?

why embed facebook album on website

Visual content is essential these days, especially on Facebook, where most posts have an image or video attached.

But did you know that when people hear information, they only remember around 10% of it 3 days later? Yet, people recall 65% of the information after 3 days if that information has a relevant image.

So backing up your website posts with relevant visual content is one of the best ways to ensure your message sticks in people’s memories. And if you link that visual content to your Facebook page, it’s easy for your site visitors to follow you for future updates.

Even more benefits for displaying Facebook photos on your website include:

  • Improving the appearance of your website with eye-catching images
  • Offering visitors exciting ways to interact with your website
  • Increasing interest in your business and the products your offer
  • Keeping people on your site for longer to increase sales and leads
  • Displaying user-generated content to increase social proof and encourage customer loyalty

As you can see, when you embed a Facebook album on your website, you make it easier for potential costumers to engage with your brand and keep you in their memories for longer. When combined, that increases the chances of turning your visitor into loyal customers.

Methods for Embedding Facebook Albums on Your Website

As we mentioned briefly earlier, displaying Facebook photos on your website can be difficult if you’re not a technical person. So some of the methods for embedding Facebook albums on your site are likely outside your comfort zone and level of experience.

The 3 main ways to embed Facebook albums in WordPress are:

  1. Share an album as a new post on Facebook, then paste the embed code into your website.
  2. Generate a Facebook album embed code from a 3rd party website to paste on your website.
  3. Use a WordPress plugin to connect your Facebook account and embed your albums with a few clicks.

The first 2 methods for embedding Facebook albums are pretty complex. They involve using multiple websites and require you paste code snippets directly into your website.

They also make it difficult to customize how your albums look on your site, which can ruin your website’s carefully designed branding. What’s more, if you run into a problem, there’s limited support available to get your issues fixed.

But if you use a WordPress plugin to embed a Facebook album on your website, you won’t have those problems.

Instead, you’ll be able to…

  • Display your Facebook albums in stunning photo galleries with no coding required
  • Control how your albums look and feel on your website
  • Customize the information displayed in your photo albums
  • Encourage people to follow your Facebook page with call-to-action buttons
  • Display multiple Facebook albums in different areas of your site
  • Get access to help and support from WordPress experts

Using a WordPress plugin to embed a Facebook album on your website gives you much more control over how you display your photos. So let’s learn how to display your Facebook photos the easy way, with a plugin.

How to Embed a Facebook Album the Easy Way

add facebook album on website easily

For this tutorial, we’ll be using the Custom Facebook Feeds plugin from Smash Balloon. Custom Facebook Feeds lets you seamlessly integrate your Facebook content onto your website without requiring any technical work to make it look great.

You can embed any type of Facebook content on your site and display it anywhere you like, including Facebook reviews, events, and more. And with powerful customization options, you can choose which parts of your Facebook content is displayed and keep the design consistent with your site’s theme and branding.

Plus, with the Facebook Album extension, you can embed photos from specific Facebook albums on your site in stunning galleries.

facebook album on website example

With that in mind, let’s dive into setting up your Facebook albums in WordPress using the Custom Facebook Feeds plugin.

Step 1: Install The Custom Facebook Feeds Plugin

The first step is to get your copy of Custom Facebook Feeds Pro here. You’ll also need a copy of the Album Extension, which you can find here.

Once you’ve downloaded both plugins, follow these step by step instructions to install a WordPress plugin.

After you install Custom Facebook Feeds, navigate to Facebook Feeds » Extensions from your WordPress dashboard.

Then find the Album extension and click the checkbox to make it active and click the Save Changes button.

Activate Album extension to add facebook album on website

Step 2: Connect Your Facebook Facebook Account

Next, navigate to Facebook Feeds » Settings. This is where you’ll link the plugin to your Facebook page.

To connect your account, click the blue Connect a Facebook Account button and follow the instructions on-screen to link your account.

facebook album on website connect account

After, scroll down to confirm the settings for your Facebook feed which include:

  • Selecting if it’s a page, group, or profile
  • Choosing whose posts to display such as yours and/or other peoples
  • The number of posts to display in your album feed
  • How often the plugin checks for new posts
  • Your language preferences
  • Your timezone

settings to add facebook album on website

Once you’ve done that, click Save Changes, and we’ll move on to choosing which type of post to display in your feed.

Step 3: Select the Album Post Type

Now navigate to Facebook Feed » Customize. Here you can change the width, height, and padding of your Facebook album feed.

customize facebook album on website

You can also set a custom background color and CSS classes to match the design of your website.

After that is the Post Types section. To display only a feed of photos from your Facebook albums, uncheck all the boxes apart from the Album option.

select post type to display facebook album on website

With the Album option checked, you can choose to source album photos from the photo’s page or your Facebook timeline. You can show or hide the album’s title and the number of photos. Then when you click the drop-down box, you can select how many columns your photo gallery displays.

Remember to click Save Changes to store your preferences.

Further down the page, you can enable the option to include a header on your album gallery and select the information you want to display including:

choose header type for facebook album feed on website

  • Your cover photo
  • Name and avatar
  • About info

You can also choose to include a Facebook Like box and Load More button below your album feed.

Facebook like box and load more button settings

When you’re happy with the settings, click the Save Changes button and move on to the next step.

Step 4: Find Your Facebook Photo Album ID

Before you publish your Facebook album on your website, you need to find the ID of the album you want to display.

You can find the ID of a Facebook album from its URL. It is the set of numbers after the second period in the URL, as highlighted below:

get album ID to display facebook album on website

Copy the album ID and paste it into a notepad or blank document to use in the next step.

Step 5: Embed Your Facebook Photo Album on Your Website

There are 3 ways to embed your Facebook album on your website, which include:

  1. Using the Facebook Feed WordPress block in the new WordPress block editor
  2. Adding the Facebook Feed shortcode to the classic WordPress editor
  3. Using a WordPress widget to display your feed in your sidebar

Let’s look at all 3 options.

Embedding a Facebook Album in the WordPress Block Editor

To embed a Facebook album in a page using the WordPress block editor first, navigate to Pages » Add New.

Then in the block editor, click the Plus (+) icon to add a new content block. Then in the search box type “feeds” to find the Facebook Feed content block.

Embed a facebook album in website page

Clicking the block ads it to the content editor.

Now click the Facebook Feed block inside the editor. On the right-hand side of your screen, you’ll see the Custom Facebook Feed shortcode settings.

facebook album on website shortcode

In the settings box, add this shortcode:

custom-facebook-feed album=xxxxxxx

Replace “xxxx: with the Facebook album ID you copied in the previous step and click Apply Changes.

Now when you click Preview, you’ll see your Facebook album displayed in a beautiful grid of photos.

embed a facebook album in wordpress website

When you click any photo, it’ll open in a distraction-free, lightbox popup to give your visitors a closer look.

facebook album on website lightbox popup

Embed a Facebook Album in the Classic WordPress Editor

If you’re still using the classic WordPress content editor, embedding your Facebook album is just as easy.

Simply follow the instructions in the previous step to add a new post or page. Then in the content editor, paste your shortcode as shown below.

Embed a facebook album in the classic WordPress editor

Display Your Facebook Photos in Your Sidebar

To embed a Facebook album in your website’s sidebar, you can use the WordPress Text widget.

First, navigate to Appearance » Widgets. Then drag a Text widget over to your sidebar area.

add facebook album feed to website widget

In the widget content area, paste the shortcode to display your Facebook album photos. Then click Save to store your settings.

When you navigate to your main website, your gallery of album photos will be displayed in your site’s sidebar.

facebook album on website sidebar

There you have it!

You now know how to embed a Facebook album on your website easily with a WordPress plugin.

By engaging your visitors with relevant visual content, you’ll make it easier for them to remember you and increase chances of turning them into loyal customers that grow your business.

Get started with Custom Facebook Feeds today.

And don’t forget to follow us on Twitter and Facebook for more helpful social media content.

Want to Try our Facebook plugin for Free?

Enter the URL of Your WordPress website to install Custom Facebook Feed Lite.

Comments

  1. Lynn Appleget

    This looks so easy

    Reply
  2. Karen Webster Hunt

    Great and Thank you!

    Reply
  3. Coleman Jackson

    another awesome giveaway !!!

    Reply
  4. Michael DeFren

    Thanks this is awesome

    Reply
  5. Jakaria

    Awesome post

    Reply
  6. Melinda Mattox

    I didn’t know how to do this before. Thanks for the information, I’m very curious to try this now!

    Reply
  7. Ashley Zabel

    Thank you so much for this!!!

    Reply
  8. Phyllis Huebbe

    I’m really interested in trying this.

    Reply
  9. David Esca

    Great info!

    Reply
  10. Kakhaber Khmelidze

    Thanks for always extensive article.

    Reply
  11. Vitor

    Incredibly well explained!

    Reply
  12. Frankie Pinnix

    I love how you’ve simplified the instructions! Thank you!

    Reply
  13. McKnight

    I’m still learning how to build my own site. This looks very useful

    Reply
  14. Jennifer Hall

    Incredibly detailed.

    Reply
  15. Paula S

    Thank you looks very interesting!

    Reply
  16. Jill Hanson

    Very interesting, thanks!

    Reply

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

Leave a Reply

Your email address will not be published. Required fields are marked *