Docs    Facebook

How to use the Album extension to display photos from a specific Facebook album

Installation

Extensions are installed just like any other WordPress plugin. You can follow the same process used when uploading and installing the Custom Facebook Feed Pro plugin.

Finding the Album ID

You can find the ID of a Facebook album from its URL. It is the set of numbers between the first two periods in the URL, as highlighted below:

https://www.facebook.com/media/set/?set=a.440612488444.242105.15087023444

Plugin Version 4.0 and above

In plugin version 4.0 and above, you can also enter the full album URL directly and the plugin will find the correct ID automatically.

Creating a Single Album Feed

Go to Facebook Feed > All Feeds > New. When asked to select the Feed Type, select Single Album. You will be asked to add the Album URL or ID.

For an already set up feed go to Facebook Feed > All Feeds > select Edit for the feed > Settings > Feed Type > click Change and then Single Album. Change the Feed Type and you will then be able to add the Album URL or ID to this specific feed.

Display captions on hover

When clicking on a photo the caption will be displayed in the pop-up lightbox, but you can also choose to display the caption when the photo is hovered/rolled over without opening the lightbox. Just add the following to the plugin’s Custom JavaScript section, which is found under Facebook Feed > Settings > Feeds > Custom JavaScript:

$('.cff-album-cover').each(function(){
  $self = $(this);
  $self.find('.cff-photo-hover').html('<p style="color: #fff; width: 90%; padding: 5%;">' + $self.find('.cff-lightbox-link').attr('data-title') + '</p>');
});

Below Plugin Version 4.0

Shortcode

The Album extension allows you to specify the ID of a Facebook album directly in the shortcode:

[custom-facebook-feed album=440612488444]

You can also set the number of columns in the photo grid by using the ‘albumcols’ shortcode option, and the number of photos to display using the ‘num’ option:

[custom-facebook-feed album=440612488444 albumcols=4 num=100]

Shortcode Options

Name Attribute Options Description Example
Album ID album Any album ID The ID of the Facebook album you want to display album=440612488444
Number of columns albumcols 1-4 The number of columns in the photo grid albumcols=2
Number of photos num Any number The number of photos to display num=50

Show newest photos first

To change the order of the photos you would need to manually reorder them inside the album on Facebook, by clicking the 3 dots in the corner and selecting “Edit album”. You can then drag and drop the photos in the album and click “Save”. If you then clear the cache on the plugin settings page then the plugin will update to reflect the order on Facebook.

Display captions on hover

When clicking on a photo the caption will be displayed in the pop-up lightbox, but you can also choose to display the caption when the photo is hovered/rolled over without opening the lightbox. Just add the following to the plugin’s Custom JavaScript section, which is under the Misc tab on the plugin’s Customize page:

$('.cff-album-cover').each(function(){
  $self = $(this);
  $self.find('.cff-photo-hover').html('<p style="color: #fff; width: 90%; padding: 5%;">' + $self.find('.cff-lightbox-link').attr('data-title') + '</p>');
});

Technical Support

Still have questions? We are here to help you succeed.

Open a support ticket