Docs    Facebook    Customizations

Creating a slideshow, slider, or carousel from your Facebook posts

If you’re using the Pro version of the Custom Facebook Feed WordPress plugin then you can use our Carousel extension to create sliding carousels out of your Facebook content.

If you’re using the free WordPress plugin, or the PHP Standalone version, then it’s possible to achieve a basic slideshow by doing the following:

————

1) Add a class to the shortcode of the feed that you want to convert into a slideshow:

[custom-facebook-feed class="slideshow"]

2) Set the number of posts to display to be the number of posts you want to include in the slideshow (10 for example). You can do this by using the ‘num’ shortcode option:

[custom-facebook-feed class="slideshow" num=10]

3) Add the following to the plugin’s Custom JavaScript section, which is under the ‘Misc’ tab on the plugin’s ‘Customize’ page. Please note, if you change the class option in the shortcode above to be anything but “slideshow” then make sure to change that on the first line of the snippet below:

var shortcodeClass = 'slideshow',
    cffSpeed = 5000, 
    $cff = $('#cff.'+ shortcodeClass);
    $cffItem = $cff.find('.cff-item'),
    cffNum = $cffItem.length,
    cffCur = 0;
$cffItem.hide();
setTimeout(function(){ $cff.find('.cff-item').eq(0).show(); }, 200);
setInterval(function(){
    $cff.find('.cff-item').eq(cffCur).fadeOut( "fast", function() {
        if( cffCur == cffNum-1 ) cffCur = -1;
        cffCur++;
        $cff.find('.cff-item').eq(cffCur).fadeIn();
    });
}, cffSpeed);

4) You can change the speed of the transition by editing the cffSpeed = 5000 value at the top of the snippet. 5000 is equal to 5 seconds (5000ms).

Technical Support

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

Open a support ticket