Custom Facebook Feed

The Facebook feed you’re trying to display has to be from a publicly accessible Facebook page or Facebook group. This means that you can’t display the feed from your own personal Facebook profile. This is to do with Facebook’s privacy policies. You can’t display a non-public Facebook feed publicly.

If your Facebook page has any restrictions on it (age, for example) then it means that people have to be signed into Facebook in order to view your page. This isn’t desirable for most Facebook pages as it means that it isn’t accessible by people who don’t have a Facebook account and that your Facebook page can’t be crawled and indexed by search engines.

An easy way to determine whether your Facebook page is set to public is to sign out of your Facebook account and try to visit your page. If Facebook forces you to sign in to view your page then it isn’t public. You can change your Facebook page to public in your Facebook page settings simply by removing any age or location restrictions you have on it (screenshot), which will then allow the Custom Facebook Feed plugin to access and display your feed.

Yep! Create as many feeds as you like from different Facebook pages. Just click “Add New” to create a new feed and then embed it anywhere on your site.

Yep! First, authorize the plugin by using the big blue Facebook button on the “Facebook Feed” settings page and then select your Facebook group. You must be a member of the group and an admin of that Facebook group must have installed our app in the Facebook group settings. Directions for this are provided when you authorize the plugin via the Facebook Feed settings page.

Due to Facebook’s privacy policy you’re not able to use the plugin to display all of your posts from a personal profile, only from a public page, as posts from a personal profile are protected for privacy reasons. You may have limited success in displaying certain posts from a personal profile but most posts are not able to be displayed.

If you’re using the profile to represent a business, organization, product, public figure or the like, then we’d advise converting your profile to a page per Facebook’s recommendation, as there are many advantages to using pages over profiles.

Once you’ve done so, the plugin will be able to retrieve and display all of your posts.

In version 2.5, support was added to allow the plugin to power your Facebook oEmbeds as official support for these is no longer available in WordPress core. Just connect your account on the oEmbeds settings page inside the plugin and the plugin will power all Facebook embeds on your site, old and new. No developer app or account required.

This free plugin only allows you to display text from your Facebook posts. To display photos and videos in your feed you would need to upgrade to the Pro version of the plugin. Try out a demo of the Pro version on the Custom Facebook Feed website, and find out more about the Pro version here. Click here for a full list of all differences between the free version and Pro version.

This is a feature of the Pro version of the plugin. To display comments, shares and likes you would need to upgrade from the free version to the Pro version.

It sure is. Unlike other Facebook plugins which use iframes to embed your Facebook feed into your page once it’s loaded, the Custom Facebook Feed uses PHP to embed your Facebook feed content directly into your page. This adds dynamic, search engine crawlable content to your site.

You can embed your Facebook feed directly into a template file by using the WordPress do_shortcode function: <?php echo do_shortcode('[custom-facebook-feed]'); ?>.

Please refer to this FAQ for potential solutions on how to resolve this issue.

The Custom Facebook Feed plugin doesn’t currently have a slideshow feature built into it, but it’s possible to achieve a basic slideshow by doing the following:

1) Add a class to the shortcode of the Facebook 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 Facebook 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).

Please refer to this FAQ for directions on how to use Google fonts in your Facebook posts.

Please refer to this FAQ for directions on how to display your Facebook posts in multiple columns.

If your Facebook feed doesn’t appear to be showing the most recent Facebook posts then the most likely explanation is that the recent Facebook posts in your feed may be shared from a user’s personal Facebook profile. Facebook’s privacy policy doesn’t allow posts that you share from personal Facebook profiles to be shared outside of Facebook as the posts don’t technically belong to your Facebook page, they belong to the user who posted it to their personal Facebook profile. There’s an example of a post shared from a user’s personal Facebook profile here.

Please note, this isn’t a limitation of our plugin, it’s a restriction which Facebook places on it’s content in order to protect the privacy of their Facebook users.

Potential solutions

• You could re-post the Facebook post to your page rather than sharing it to your Facebook page. If you re-post the content as your own post on your Facebook page then the content now originates from your Facebook page and will be displayed in the Facebook feed on your website.

• If you were to share a post from another Facebook page or public source, rather than sharing it from someone’s personal Facebook profile, then it would show up in your feed outside of Facebook, but by default any posts that originate from a personal Facebook profile are protected by Facebook’s privacy policy and is the private content of that Facebook profile owner.

Please refer to our Error Message Reference page for information on how to resolve common error messages.

Please refer to this FAQ for directions on how to create a Masonry grid layout from your Facebook feed posts.

You can customize the Facebook feed by setting the options on the Customize page, which can be found under the Facebook Feed menu in your left hand WordPress admin menu. If you need even deeper customization than the built in options allow then you can add your own CSS to the plugin in the Custom CSS section under the Misc tab to further customize your Facebook feed.

You can also override these styles for individual Facebook feeds by setting options within the shortcode. For example, you can change the height of a specific Facebook feed like so: [custom-facebook-feed height=500px].

The most common causes of this are:

1) There’s HTML tags within the [custom-facebook-feed] shortcode which are preventing it from working correctly

If you copied and pasted the shortcode into the Visual editor on your WordPress page/post editor then it may have inadvertently included some HTML tags from the page that you copied it from. The easiest way to check this is to view the ‘Text’ view in your WordPress editor and see whether there are any stray HTML tags in the shortcode itself.

2) The shortcode includes curly single quote characters

If your shortcode includes single quotes then check that they are the standard single quotes and not the curly kind.

3) Typo in the shortcode option

Ensure that there aren’t any spelling errors in the shortcode options that you’re using and that the format is consistent with that demonstrated on the Shortcode Options reference page.

The most common reason for this is that an add-on or extension you have installed in your web browser is blocking the pictures being loaded from Facebook. Try checking to see whether you have any add-ons or extensions installed in your browser and, if so, try disabling them to see whether that solves the problem and displays the pictures from Facebook.

Screenshots:

1. 

   By default the Facebook feed inherits your theme's default styles and the Facebook feed is completely responsive

2. 

   Completely customize the way your Facebook feed looks to perfectly match your site

3. 

   Use custom CSS to customize every part of the Facebook feed

4. 

   Display Facebook events in your Facebook feed

5. 

   Configuring the Custom Facebook Feed plugin

6. 

   General Facebook Feed options - Custom Facebook Feed Layout and Style page

7. 

   Facebook Feed Typography options - Custom Facebook Feed Layout and Style page

8. 

   Misc Facebook Feed options - Custom Facebook Feed Layout and Style page

Other notes:

Latest Change log entry:

• Fix: Feeds with masonry layout selected would still show as a list feed.

Tags:

+ Jason's Comments