How to Embed Facebook Albums in WordPress

Do you want to embed Facebook albums in WordPress?

Embedding Facebook albums is a great way to get more engagement on both your WordPress website and your Facebook page. It can also grow your social media following.

In this article, we’ll show you how to easily embed Facebook albums in WordPress.

Embedding a Facebook Album in WordPress

Showing albums on your WordPress website can make your pages more engaging.

As you add more photos to Facebook, they’ll appear on your site automatically, so it’s also a great way to keep your website fresh, even for regular visitors.

You can even use embedded albums to promote your Facebook page. If visitors see lots of interesting photos then they’ll want to follow you on Facebook. This can get you some extra followers and more engagement.

WordPress used to come with built-in embed support for Facebook albums. Just like you embed a YouTube video, you could simply copy and paste the URL of any Facebook album and WordPress would display that album automatically.

However, Facebook and Instagram have since made changes to their API. These changes make it impossible for WordPress to continue oEmbed support for Facebook and Instagram.

If you try to embed a link to an album, then WordPress will tell you that ‘Sorry, this content could not be embedded.’

Thankfully, there is a way to fix Facebook and Instagram embeds in WordPress using a plugin.

Let’s see how you can easily embed Facebook albums in WordPress, including how to show a specific album on any page or post.

Installing a Facebook Album Plugin

The best way to embed Facebook albums in WordPress is by using the Smash Balloon Custom Facebook Feed plugin.

This plugin lets you show Facebook albums, comments, reviews, community posts and more on your site.

It also lets visitors take a closer look at your photos and images without having to visit Facebook, by opening a lightbox popup on your website.

In this guide, we’ll be using the pro version of Smash Balloon as it allows you to embed Facebook albums, display videos, show photos in a custom Facebook feed, and more. However, there’s also a free version that allows you to create a custom Facebook feed for WordPress, no matter what your budget.

The first thing you need to do is install and activate the Smash Balloon Custom Facebook Feed plugin. For more details, see our guide on how to install a WordPress plugin.

Upon activation, you’ll need to go to Facebook Feed » Settings and enter your license key into the ‘License Key’ field.

You’ll find this information under your account on the Smash Balloon website.

After entering the key, click on the ‘Activate’ button.

Connect Your Facebook Page or Group to WordPress

Smash Balloon Custom Facebook Feed allows you to embed albums from your different Facebook pages and groups. You can even show the latest comments in a dropdown box below the photo, along with the like and shares.

To connect your Facebook page or group to WordPress, go to Facebook Feed » All Feeds and then click on ‘Add New.’

Smash Balloon lets you show posts from your photo albums, timeline, events, and more.

To embed your Facebook albums, you’ll need to click on ‘Albums’ and then click on ‘Next.’

Now, you need to select the Facebook page or group where you’ll get the albums from.

To get started, click on ‘Add New.’

On the next screen, choose whether you want to show albums from a page or group.

After that, just click on ‘Connect to Facebook.’

This opens a popup where you can log into your Facebook account and choose the pages or groups where you want to embed albums from.

After making this decision, click on ‘Next.’

Once you’ve done that, Facebook will show all the information that Smash Balloon will have access to, and the actions it can perform.

To restrict Smash Balloon’s access to your Facebook account, just click any of the switches to turn it from ‘Yes’ to ‘No.’ Just be aware that this may affect the albums and photos that you can embed on your WordPress blog or website.

With that being said, we recommend leaving all the switches enabled.

When you’re ready, click on ‘Done.’

After a few moments, you should see a message confirming that you’ve connected your WordPress website to Facebook. With that done, it’s time to click on ‘OK.’

Smash Balloon will now take you back to the WordPress dashboard automatically.

How to Embed Facebook Albums in WordPress

You will now see a popup with the group or page you just linked to your website. Simply select the radio button next to your source and then click on the ‘Add’ button.

If you accidentally closed the popup, then don’t panic. You can simply refresh the tab to reopen the popup.

After that, WordPress will take you back to the Facebook Feed » All Feeds page automatically. Just like before, click on the ‘Add New’ button, select ‘Albums’ and then click on the ‘Next’ button.

Now, select your Facebook page or group, and click on ‘Next.’

On this screen, you can choose the template you’ll use as the starting point for your feed. All of these templates are fully customizable so you can fine-tune the design depending on how you want to show the Facebook albums on your website.

We’re using the ‘Default’ template, but you can choose any template you want.

With that done, click on the ‘Next’ button.

Smash Balloon will now go ahead and create an album feed based on your source and the template you’ve chosen. This is a good start, but you may want to fine-tune how the albums appear on your WordPress website.

How to Customize Your Embedded Facebook Albums

The Smash Balloon Custom Facebook Feed plugin gives you lots of ways to customize how the albums are displayed. With that in mind, it’s worth seeing what changes you can make.

On the Facebook Feed » All Feeds screen, find your album feed and then click on its ‘Edit’ button, which looks like a small pencil.

This opens the Smash Ballon feed editor, which shows a preview of your Facebook albums to the right.

On the left-hand side, you’ll see all the different settings you can use to customize how these albums appear on your site. Most of these settings are self-explanatory, but we’ll quickly cover some key areas.

To start, you can change how the albums are displayed by clicking on ‘Feed Layout.’

On this screen, you can switch between different layouts, such as masonry and grid, and change the feed height. As you make changes, the preview will update automatically so you can try different settings to see what looks the best.

By default, the feed will show the same number of posts on desktop computers and mobile devices such as smartphones.

You can preview how your albums will look on desktop computers, tablets, and smartphones using the row of buttons in the upper-right corner.

Mobile devices usually have smaller screens and less processing power, so you may want to show fewer albums on tablets and smartphones.

To do this, just type a different number into the ‘Mobile’ field under ‘Number of Posts.’

By trying out different layouts you can create a custom feed that looks great, no matter what device the visitor is using.

By default, the Facebook feed shows less columns on smartphones and tablets, compared to desktop computers. This helps all your albums and photos fit comfortably on smaller screens.

After testing the mobile version of your WordPress website, you may be unhappy with how the columns look on smartphones and tablets. If this is the case, then you can show fewer columns by changing the numbers in the ‘Columns’ section.

When you’re happy with the changes you’ve made, click on the ‘Customize’ link.

This will take you back to the main Smash Balloon editor, ready for you to explore the next settings screen, which is ‘Color Scheme.’

By default, Smash Balloon uses a color scheme inherited from your WordPress theme, but this screen allows you to switch to a ‘Light’ or ‘Dark’ look,

You can also create your own color scheme by selecting ‘Custom’ and then using the controls to change the background color, change the text color in WordPress, and more.

By default, Smash Balloon adds a header to your feed, which is your Facebook profile picture and the name of the page or group.

To change how this section looks, click on ‘Header’ in the left-hand menu.

On this screen, you can change the size of the header, its color, hide or show your Facebook profile picture, and more.

If you want to remove the header completely, then click to turn off the ‘Enable’ toggle.

By default, Smash Balloon shows the title of each album. If you want to hide the title, then select ‘Posts’ from the main Smash Balloon editor menu.

Then, click on ‘Post Style.’

Here, you can remove the album titles by clicking on the ‘Show album title’ slider.

This can be useful if your album titles distract attention away from the photos, or they don’t make sense when embedded on your website.

On this screen, you can also choose whether to show how many photos are in each album.

To add this number, simply click on the ‘Number of posts in album’ toggle.

By default, Smash Balloon doesn’t include the Facebook ‘like’ button in your feed. To get more Facebook followers, you may want to add this button by selecting ‘Like Box’ from the editor’s left-hand menu.

After that, simply click on the ‘Enable’ button so that it turns blue.

By default, Smash Balloon adds this button below your embedded photo albums, but you can change this by opening the ‘Position’ dropdown and choosing ‘Top.’

On this screen you can also change how the ‘like’ section looks including adding a custom call to action, showing how many people follow you on Facebook, and more.

When you’re happy with how the ‘like’ button looks, you can move on to the ‘Load More Button’ screen.

The Load More button encourages visitors to scroll through more of your Facebook feed, so Smash Balloon adds it to your embedded photo albums by default.

Since it’s such an important button, you can help Load More stand out by changing its background color, text color, and label.

Another option is to remove the button completely, by clicking the ‘Enable’ toggle.

By default, Smash Balloon allows visitors to look through your Facebook albums without leaving your website.

They can simply click on any album to open a lightbox, as you can see in the following image.

The visitor can then use the arrows to scroll through the album.

If they want to like a photo, leave a comment, or share the image with their Facebook friends, then they can click on the ‘View on Facebook’ link.

There are a few different ways that you can customize the default lightbox.

To see your options, click on ‘Lightbox’ in the left-hand menu.

Here, you can change the color of the lightbox’s text, links, and background colors.

The lightbox feature makes it easy for people to engage with your photos, but it also allows people to scroll through your albums without visiting your Facebook page. If you want to get more visitors to your Facebook page then you can disable the lightbox feature by clicking on the ‘Enable’ toggle.

Now, if a visitor clicks on an album they will be redirected to your Facebook page in a new tab.

When you’re happy with how the photo albums look, don’t forget to click on ‘Save’ to store your changes.

You’re now ready to add these albums to your WordPress website.

How to Add Facebook Albums to WordPress

You can add your Facebook albums to WordPress using a block, widget, or shortcode.

If you’ve created more than one feed using Smash Balloon, then you’ll need to know the feed’s code if you’re going to use a block or widget.

Simply go to Facebook Feed » All Feeds and then look at the feed="" part of the shortcode. You’ll need to add this code to the block or widget, so make a note of it.

In the following image, we’ll need to use feed="4".

If you want to embed your Facebook albums in a page or post, then you’ll typically use the Custom Facebook Feed block.

Simply open the page or post where you want to embed your albums. Then, click on the ‘+’ icon to add a new block and start typing ‘Custom Facebook Feed.’

When the right block appears, click to add it to your page or post.

The block will show one of your Smash Balloon feeds by default. If you want to use a different feed instead, then simply find ‘Shortcode Settings’ in the right-hand menu.

You can now add the feed="" code to this box. After that, click on ‘Apply Changes.’

The block will now show the albums from your Facebook page or group. Just publish or update the page to make the albums live on your website.

Another option is to add the feed to any widget-ready area, such as the sidebar or similar section. This allows visitors to see your Facebook photos from any page of your site.

Simply go to Appearance » Widgets in the WordPress dashboard and then click on the blue ‘+’ button.

Once you’ve done that, find the Custom Facebook Feed widget.

Then, just drag it onto the area where you want to show the feed.

The widget will show one of the feeds you created using Smash Balloon.

To show a different feed instead, type the feed’s code into the ‘Shortcode Settings’ box and then click on ‘Apply Changes.’

You can now click on the ‘Update’ button to make the widget live. For more information, please see our step by step guide on how to add and use widgets in WordPress.

Finally, you can embed your albums on any page, post, or widget-ready are using shortcode.

Simply go to Facebook Feed » All Feeds and copy the code in the ‘Shortcode’ column. You can now add this code to your site.

For more information, please see our detailed guide on how to add a shortcode in WordPress.

Add a Specific Facebook Album in WordPress

Smash Balloon also allows you to embed a specific Facebook album anywhere on your WordPress site. This allows you to show your latest or best album to visitors, or to display an album that’s relevant to the rest of the page’s content.

To embed a particular Facebook album, you’ll need to buy and install the Album extension by going to Facebook Feed » Extensions.

Here, find the ‘Album’ extension and click on its ‘Add’ button.

This will open the Smash Ballon website in a new tab, with instructions on how to purchase the extension.

Once you have the extension, you can install it in exactly the same way you install a plugin. If you need help, then please see our guide on how to install a WordPress plugin.

After activating the plugin, go to Facebook Feed » All Feeds and click on ‘Add New.’

Under ‘Advanced Feed Types,’ select ‘Single Album’ and then click ‘Next.’

You can now choose the page or group that you want to use as your source, and choose a template by following the same process described above.

On the next page, you’ll need to enter the ID of the album that you want to embed.

In a new tab, simply open the Facebook album that you want to display.

You can now copy the numbers after the = symbol, and inbetween the first two periods. For example, in the following image we need to copy 447443907512397.

You can now paste these numbers into the WordPress dashboard.

After that, click on ‘Next’ and Smash Balloon will fetch the album.

After that, you can style the album and add it to your site following the same process described above.

We hope this article helped you learn how to embed Facebook albums in WordPress. You may also want to check out our guide on how to create a custom Instagram photo feed in WordPress, and how to create an email newsletter to connect with your visitors after they leave your website.

If you liked this article, then please subscribe to our YouTube Channel for WordPress video tutorials. You can also find us on Twitter and Facebook.

The post How to Embed Facebook Albums in WordPress first appeared on WPBeginner.

from WPBeginner https://ift.tt/nSk2Fyf
More links is https://mwktutor.com