WordPress Ultimate Facebook Plugin

Installing Ultimate Facebook

Ultimate Facebook is one mammoth of a plugin, but installs like a breeze. It works with the latest version of WordPress and integrates well with BuddyPress and WordPress Multisite. To install Ultimate Facebook:

Download a copy of Ultimate Facebook to your hard disk.
Go to your WordPress Dashboard. Navigate to Plugins > Add New. If you are using WordPress Multisite you have to go to your Network Admin. Navigate to Plugins > Add New
Switch to the “Upload” Tab on the Add New plugin page.
Click Browse and find the file you downloaded. Open it and Click “Install Now”.
When the installation is complete, click “Activate Plugin” (for standard WordPress install) or “Network Activate” (for Multisite, if you want to activate the plugin across all sites on the network. If not you can go to the Plugins section under each site and activate individually).

Setting-Up Ultimate Facebook

Once installed and activated, you will see a Facebook Menu entry in sidebar of your WordPress Dashboard. Click on it to configure the plugin settings before you can use it. If you are using WordPress 3.3.1 and beyond, you will see the Step-By-Step tutorial, which will guide you through the process. Lets get started!

Facebook API Settings

This is where the plugin gets connected to Facebook. You will need a Facebook account for the plugin to work. Start with creating a Facebook App. Just follow the on-screen instructions, clearly written inside the plugin with all the links you will ever need. The Site URL, that you need to provide the app with, once its created, will also be given to you here:

When you click the link “create your application“, you will end up the Facebook developer dashboard. You need to look for a “Create new app” button, that look like this, on the top right corner:

Once you enter the Name of the App and fill up the captcha, you will find something similar to this on your Facebook Apps section on Facebook (you will be automatically taken here):

You need to enter the Site URL in the website portion of the app page. The Site URL must be exactly what the plugin provides you in Step 2. Hit save when you are done. Having created the app (Congrats! Ever thought it would be this easy to create a Facebook app?), now you can enter the following details into the plugin:

App ID / API key
Secret key

Besides these essential settings, there are other Optional plugin options in the Facebook API settings:

API Locale – Here you can explicitly tell the plugin, which language you want to use with Facebook.
Prevent access to my linked accounts – Ticking this would prevent the application you just created from accessing your linked accounts and Pages.
Allow sub-sites to use these credentials – This menu option shows up only if you are on the Network Admin of a Multisite installation. If ticked, all the sub-sites will be able to use the Facebook application you just created. This might not be what you want, especially if you are using the app to Post to your Facebook Wall. If so, other blog owners would also be able to post things to your Wall through the app. But this option would come handy if you have a Facebook account for the Network and want all the users to use the same account. Use wisely!

Here is a screenshot of what a completely filled up API settings page would look like:

Note: An important thing to note is that the permissions are entirely on the Facebook-side, and related to your app – the plugin communicates with Facebook through your Facebook app. When you’re granting permissions, you’re granting them for your app, as it is set up in in Facebook app creation/editing pages *and* as it is referenced in the plugin settings (app ID and secret).

If you’re certain that your settings are correct and are still having an issue, logging out and back into Facebook and WordPress in that order (to refresh stale cookies) may help as well as clearing cache and re-checking the plugin page to make sure everything is correct. Removing and re-adding an Ultimate Facebook widget to the sidebar may help as well when dealing with caching issues.

If you are on a Multisite and have installed Ultimate Facebook and enter an erroneous set of API and Secret keys the first time and if you are trying to change it, you will have to change it on all Sub-sites for the app to work. So when you are installing Ultimate Facebook on a Multisite, make sure that you get the App ID and Secret Key right the first time. If you wish to change it later, refer to the Network Options Tab in the documentation. Now that the marriage between the plugin and Facebook is done, lets look into other options. So far so good?

Grant Extended Permissions Tab

This is an optional step where you give the application extended permissions to use your Facebook account. If you wish to import photos / events or auto post your articles for you, then you have to Grand Extended Permissions to your app.

Here are some of the permissions that you can give:

Access to your Photos.
Access to your Pages.
Post to Facebook on behalf of you.
Access your news feed.
Manage your events.

You can either give the app all the permissions, or selectively disable permissions by removing them using the ‘X’ button for each of them (marked with the pointer in screenshot).

Facebook Connect Tab

This is where you integrate Facebook registration to your blog. Facebook registration is the easiest way for users to sign-up. If you are using BuddyPress, Facebook registration and login makes even more sense. Lets take a look at how to get it done, one setting at a time!

Allow users to register with Facebook – This is the control switch. Tick to enable the whole Facebook connect procedure. In other words, if you are thinking of Facebook Registrations / Logins, this must be ticked!

Force users to register with Facebook – When you enable the previous option “Allow users to register with Facebook“, Facebook registration is added as an option for the user. But if you choose to Force FB registration, the default WordPress registration page will be replaced by a Facebook registration page. If the user is already logged into Facebook, the fields will be pre-filled. If not, users can either choose to login to Facebook and get the form filled up, or can manually enter their details and complete the registration process.

Require Facebook account – If you tick this one, then a user who tries to register at your site MUST have a Facebook account. The user will have to sign-in to their Facebook account to complete their registration.

Allow single-click registration – When enabled, the “Login with Facebook” button will act as a quick register option. If a user tries to login, and if he isn’t already registered, a new user will be created in his name. When a user tires to login with Facebook, the plugin checks the email address of the user in their Facebook account across all the email addresses of the registered users. If a match is found, the user will be logged in as that WordPress user. If no match is found, either a new user will be created or Login will be denied, depending on what you set here.

Redirect on login – If you wish to send users to particular areas of your website when a user login, this is where you do that. You need not provide absolute URLS here (in many cases, like in a Multisite network, you might not know the absolute URL). You just have to provide a URL fragment (eg: admin.php?page=wdfb ).

If you choose “Site URL” from the drop down, the redirect url will be preceded by the URL to the front end of the site. Like wise, if you choose “Admin URL” from the drop down, the redirect url will be preceded by the admin URL. In this example, you have to choose Admin URL, and the user will be redirected to http://YOURSITE.com/wp-admin/admin.php?page=wdfb

When you save the settings, the actual redirect URL will be shown just below the box. Do not show CAPTCHA on registration pages – Removes the captcha from the registration boxes. A welcome note to spammers? You’re the boss!

Map WordPress profile to Facebook – This is how you can import details from Facebook profiles of users to corresponding WordPress / BuddyPress profile fields. This is particularly useful if you are using BuddyPress extended profiles. This section works differently for WordPress and BuddyPress. For WordPress, you have some basic mappings like first_name, last_name and description, but when it comes to BuddyPress, all your Extended Profiles that you have created will be listed here. Simply pick the appropriate Facebook profile field from the drop down.

When you are done with all your mappings, hit Save and lets move on to the next tab.

Facebook Like / Send Button Tab

Here you can configure and set the style of your Facebook Like and Send buttons. Everything is self explanatory, lets take a quick look:

Allow Facebook Like Button – Tick here if you want to show a Facebook Like button along with your posts.
Show “Send” button too – If you want to let users have a Send button, with which they can send your article to people or specific groups, this is where you enable it! More like a “Email this” button for the Facebook nation.
Show on Front page posts – If you want the buttons to show up on home page of your blog, tick here. If you are only showing excerpts of posts, then it would be a good idea NOT to show the button on homepage, as it can save up on valuable load time. Your call!
Do NOT show button in these types – You can choose to not show the like and send button on specific post types. Supports custom taxonomies too. For instance, If you do not want the like button to show up on Pages, just tick “Pages”. Sweet!
Button position – Choose where you want the button to appear. You can position it above the post, below the post, or both, or you can manually set the position using shortcodes.
Button appearance – How do you want the button to look like? You get to decide!

Save the settings and go ahead to your site to see it live. That was easy!

Facebook OpenGraph Tab

OpenGraph is a way to better integrate with Facebook. If you want precision control over what data is sent to Facebook, rather than Facebook trying to figure it out for itself, OpenGraph is the way to go! For normal use of the plugin, the best OpenGraph can do for you is to choose what image you want to set for each posts. If you wish to dive in, Tick “Use OpenGraph support“. Now here is how the plugin will tell Facebook which image is to be used when a user share the article, and for auto-posting:

If you have set an Image in the “Always use this image” option, this image will be used every time an article is shared. Want to show off your Brand Logo with every post? This is where you do that. Just upload the image somewhere and provide a full direct link to the image here.
If the image is not set, the plugin looks for a featured image and uses it.
If both above cases are false, the plugin looks for an image in the post, and uses it.
If none of the above are true, and if you have set a Fallback image, then the fallback image will be used.

The rest of the settings are for advanced users who wish to pin point everything to Facebook. For instance, if you enable “Do not autodetect my OpenGraph type, I will set it manually” and set “OpenGraph Name” to “og:title” and “OpenGraph Value to “My Title For Every Post”, then every article of will have the title “My Title For Every Post” when shared of Facebook.

You can read more about using OpenGraph here. Here is a list of all OpenGraph Names that you could use and here is a tool to see what Facebook sees, once you set OpenGraph values manually. Have fun!

Facebook Comments Tab

Ultimate Facebook lets you integrate Facebook comments with WordPress comments. And here are all the settings you need to set. The plugin after all is named Ultimate Facebook, and we are just getting started!

Import Facebook comments – When turned ON, the Facebook comments for your article will be imported as regular WordPress comments.
Skip importing comments for these accounts – The plugin would list all the accounts known to the plugin here. If you do not want to import comments for a specific account, you can tick here.
Reverse checking logic – Ticking this reverses the “Skip import comments” logic. Something like an “Invert Selection” option. If you choose to reverse the logic by ticking here, only the accounts that you have ticked above will be checked for comments.
Limit – The number of Facebook posts checked for comments. Facebook doesn’t allow its Apps to dive directly into the comments. An app can import the comments for a specific post. What Ultimate Facebook does is, it takes the latest 10 of your Facebook posts (assuming the limit you set is 10 for this example), and then check which of them are created by the App, and imports the comments from them.
Notify post authors – If you wish to notify post authors when comments are imported, tick here. They would love to hear what others are saying about their work, so go ahead!
Import comments now – The Green signal. This could take a while so hang on!

Now you can use Facebook for comments right within your blog itself. Logged in users will be able to comment using their Facebook id and take part in the discussion right on your website. You have the following settings:

Use Facebook for comments – A Facebook discussion box is shown as shown in the screenshot above. Users logged in to Facebook can use it and also choose to send the comments directly to Facebook as well.
Override WordPress discussion settings – When ticked, this would turn off WordPress comments. Facebook comment box will appear.
Facebook Comments box width – Set the width of the comment box here.
Show Facebook Comments in reverse order? – Wish to show off the last comment first? One tick will do it for you!
Show this many Facebook Comments – The number of Facebook comments that you wish to show.

Using a custom hook – You can show off Facebook comments in your theme by creating a custom hook. Enter a name for the hook, say “my_fb_comment” in the box here (without the quotes) and then usein your theme file to show off Facebook comments. In some cases, when a theme fails to automatically show off your comments, this can come handy!

Autopost to Facebook Tab

Ultimate Facebook can publish your articles automatically for you. You will have to grant your app extended permission for autopost to work. Its very convenient and easy to set-up:
Allow autoposting new posts to Facebook – Check this to turn ON autoposting.

Allow fontend autoposting to Facebook – Some plugins let users post from the front end of the blog. Plugins like the Q&A plugin, or the Wiki plugin. When you let users auto-post stuff from the front end, new user-created posts will be posted to your Facebook as well.

Show post Facebook status column – Adds a column to your Posts summary page with the status of the Post. You can quickly and easily know which post is on Facebook and which ones are not.

Map WordPress types to Facebook locations – This is where you decide what-goes-where. You could choose your Posts to go to your Facebook wall or to your Fan Page. You get to choose!

If you wish to enable Posting to your Pages, you need to Grant permission to your App to access your pages in the Extended Permissions. Also “Prevent access to my linked accounts” in the Facebook API settings must be un-checked. The “post AS Page” check box means, when your article gets posted to your Page, it will look as if its posted by the Page (and not the user), provided the check box is ticked.

Do not allow individual posts to Facebook – If you wish to disable the Facebook Publishing Box in the Post Editor Meta, just tick here. Using the Facebook Publishing box, authors can choose to send their article to their Facebook account, and set a different title for the article. It looks like this:

When you are done, click SAVE before proceeding to the next tab.

Network Options Tab

This tab shows up only when you are on a Multisite. Here you can control the behavior of Ultimate Facebook over the network.

Override individual blog settings -When ticked, all Individual blogs settings will be replaced by what you set in the Network Admin. Note that this is a one time process and it replaces all settings when you hit SAVE. Site Admins can go back and edit their individual settings again.
Preserve individual blog API settings – When ticked, each individual blog owner can create their own app and use the APP ID and secret Key to integrate with their App. If you are trying to change your APP by creating a new app, or if you are resetting your App Secret Key, un-tick this, and tick Override individual blog settings so that it gets updated across all the sites on your network. You will need to tick this if you are using Domain Mapping.
Do not allow per-blog settings – This is the “Master Override” button. When turned on, each individual site on the network cannot have its own App or Settings. Everything will the just the way you set in the network settings. You have to tick “Allow sub-sites to use these credentials” in the Facebook API settings for this to work.

When you are done, hit Save!

Facebook Widget Pack

Ultimate Facebook comes loaded with a ton of widgets for you to use at your disposal. Head over the the Widget Pack section of Ultimate Facebook to Enable the Widgets that you want. All widgets are easy to configure and intuitive!

Facebook Connect widget

Easily Let users Login / Register to your site with a Sidebar Widget.

Facebook Albums Widget

Show off your Facebook Albums on your sidebar. You need to grant extended permissions for this widget to work.

Facebook Events widget

Show off your Facebook events on your Blog Sidebar with the Facebook Events Widget.

Facebook Facepile widget

A Facebook Facepile is a ‘pile’ of profile pictures of Facebook users who have connected to your website. For instance, you could show a neat ‘pile’ of people who have liked your pages / posts.

Tip: Facepile and Facebook Like Box can help increase your conversion rates of your sales pages. Studies have shown that, having some familiar Faces on the sales pages makes the page more trust worthy and thereby increases conversions. If a visitor who is logged into to Facebook (or even has a valid session cookie, which means the user need not have a Facebook window open) visits your page, he would see the faces of his friends on the pile first.

Facebook Like Box widget

This is one of the most popular Facebook widgets. With this widget, you can neatly add a list of users who have liked your Fan Page along with some of the latest updates on your Fan Page as well.

Tip: Adding this box on your sidebar or Footer is one way to boost your Facebook likes.

Facebook Recommendations widget

Add Facebook Recommendations to your website easily with this widget. When a user visits your site and if he is logged in to Facebook, he will see recommendations tailor made for him using Facebook’s OpenGraph technology.

Facebook Activity Feed widget

Just like the activity feed you have on your Facebook right sidebar, this widget adds the Activity feed to your website. When a visitor who is logged into the Facebook visits your site, he will see his activity feed on your sidebar.

Tip: if you are using BuddyPress to create a network for your friends, displaying the activity feed from Facebook can make your site more engaging.

Facebook Recent Comments widget

Something like the WordPress recent comments widget, this widget shows off recently imported comments from Facebook. Very useful when you are using Facebook for Comments.

Facebook Dashboard widgets

These widgets show up on your WordPress dashboard, and comes handy when you have multiple users on your Website, like a BuddyPress / Multisite network. There are two widgets that show up on your Dashboard when this is enabled:

Facebook Permissions Widget – Lets users Grant Extended Permissions to their Facebook profile directly from their Dashboard.
My WordPress Profile Widget – Using this Widget, a user can fill-up their profile fields on one click. The plugin uses the same mapping that you have set in the “Facebook Connect Tab” under Facebook settings of the plugin.

Once you have chosen which widgets you want, hit Save.

Now head over to Appearance > Widgets in your dashboard and you can see that the new widgets are there, ready to be picked and served!

Ultimate Facebook Shortcodes

Ultimate Facebook comes with a whole array of shortcodes for easy integration into Posts / Pages and Sidebar widgets. You can find them all under the Shortcodes section of the plugin. To use a shortcode, you need to page them in a Post / Page along with the text. You will have to paste shortcodes in the HTML view, or sometimes they will show-up on your posts just as short codes. For example, if you include [wdfb_like_button]in a post, it will be replaced by a Like button when the post is live. To use shortcodes on your sidebar, include them in a text widget and hit save. The available shortcodes are:

“Like” button shortcode – [wdfb_like_button]
Events shortcode – [wdfb_events]
Connect shortcode – [wdfb_connect]
Album shortcode - [wdfb_album]

All these shortcodes can have attributes as well. For example, using the Album shortcode like: [wdfb_album id="379473193359" photo_class="thickbox" columns="5"] will open the images in a Thickbox and will show 5 images per row. Using attributes for shortcodes are explained in detail with examples in the Shortcodes page.

Error Log

Error log is the easiest way to check if the plugin is working properly. Anything goes wrong, you will see an error message here, so checking your error log once in a while is ideal. For instance, if auto-posting doesn’t work, you will see it as an error in the error log. Note that, error log is not available in the network admin on a Multisite, but all sub-sites will have individual error logs.

note: this plug-in requires curl. If you are developing in a localhost environment, please check for the presence of curl.

Go ahead! Have fun!

Ultimate Facebook is fun to configure and with this guide, you should be able to get it up and running in under 20 minutes. If you ever get stuck, just drop in a support request at our forum, we got your back! We would also love to hear from you, and your suggestions on how we can further improve Ultimate Facebook. Have fun Facebook-ing your Website!

WPMU DEV

Ultimate Facebook

Screenshots

Video

Detail

Here is just a taste of what it can do:

Usage