Some people have been forwarding me this email message that they received from Facebook:
The Simple Facebook Connect plugin has not used the FeatureLoader.js script since before version 1.0, which was released 5 months ago. Version 1.2 of SFC fully integrated OAuth 2.0 authentication, and it was released 5 weeks ago.
So if you’re getting this email from Facebook, upgrade SFC to the latest version. Problem solved.
I frequently get emails from users of SFC saying that their Like/Send buttons or Publish buttons are putting in weird content, or getting the wrong images, or things like that. Many presume it to be a bug in SFC itself or some kind of plugin incompatibility. Actually, it’s neither of those. You’re running into what I call the Facebook Cache.
See, Facebook does more than simply let you send things to their pages and so forth. More and more, they’re becoming a search engine. Facebook actually crawls the web, to some degree.
When you click a Facebook Like button, Facebook’s servers retrieve the webpage you’re viewing, and parse it for the OpenGraph meta tags. These tags tell Facebook what content to display for a link. The title, the image, maybe audio or video, etc. SFC does a pretty good job of automatically populating your entire website with these OpenGraph tags, invisibly (side note, Google+ will use these same tags, although they also have their own set of tags you can use too).
Generally, users who email me about this problem are just using SFC for the first time, and have previously had Like buttons on their page manually, or have been sharing their links on Facebook manually at some other point. This is where they run into the issue: Facebook caches the results of this crawl, usually for a long time. So when somebody clicks a Like button, it doesn’t have to pull the contents of the page if it’s already pulled those contents once before. So since SFC is now populating the OpenGraph meta tags, but FB is reading the cached version instead, the data doesn’t match up.
There’s a simple one-time fix for this problem. Facebook has made an OpenGraph debugger tool:
On this page, you’ll find a simple box asking for a URL. Put in the URL of the page having the problem, and the tool will go and force retrieve the content of the page and display the parsed OpenGraph meta tags.
Now, this is meant to be a debugging tool for people trying to add OpenGraph tags to their site, but it has a rather nice side-effect. When it forcibly retrieves the page, it also updates Facebook’s cached info for that URL. So all you have to do to make Facebook see your updated content is to take the problem URL, put it in there, and hit the Debug button. Now go back to the page, refresh it, and try the Like/Send button again. Voila, it’s magically fixed to show whatever the Debugger tool saw.
So if you’re having trouble getting some particular page to work in the way you’re expecting, try the debugger tool on the URL first.
Facebook recently made a breaking change to the developer process, which makes it impossible for new applications to get the correct API keys. Since this essentially broke all previous versions of SFC, I went ahead and pushed the beta version public. It’s still unfinished, but Facebook didn’t really give me a lot of choice.
So, this is a quick walkthrough of some of the new features of SFC 1.0.
The upgrade process is slightly more involved for this one. It is recommended that you deactivate the old SFC plugins before upgrading. Why? Well, if you don’t, you’ll get a bunch of errors when visiting the Plugins screen later, saying that all the old SFC plugins either don’t exist or have an invalid header. These errors are normal, because of the next feature:
One plugin only
No more sub-plugins
Simple Facebook Connect is now a single plugin, with modular features. If you examine the plugins screen, you’ll find only one entry: Simple Facebook Connect.
The many-plugins-in-one was a useful experiment, IMO, and I still think it’s a better way to do things. But many people find it confusing, and some have disagreed with the notion. A lack of useful core support for plugin dependencies and user feedback convinced me to switch it up. So now, SFC is one plugin. But it’s still modular!
As you can see in the image, you can still turn on and off pieces of the plugin. Why have a piece running and consuming valuable resources if you’re not using it? Turning a module off completely disables it in the code. And the core of SFC itself is still written modularly, for maximum performance (since integrating Facebook itself is such a drag on performance for a site to begin with).
Support for new Facebook code
Over a year ago, Facebook stopped supporting the original Facebook Connect libraries. This was a major problem for sites, however the old code still worked. So as time went on, and the old Connect libraries started to degrade and become less and less useful, SFC was rewritten from the ground up to use all the newer supported libraries. Facebook’s JS SDK is used. FB’s Graph API is used. The old Facebook REST Platform code is completely gone, as are the older incompatible Facebook Connect libraries. OpenGraph meta tags (including embed info for images and video) are inserted into the entire site, completely automatically, allowing Facebook to see the content of your site and act accordingly.
Many of the plugins themselves have been rewritten fairly extensively as well, but with this comes some removal of older code.
Faux Share button settings
The Share button is gone. It was previously implemented using the older Connect libraries, but with the newer libraries from Facebook, it’s been completely removed. There was just no good way to retain it, Facebook has simply dropped any and all support for it. So, in it’s place (because it was so handy) is a modified Like button, which can still look sorta like the old Share button. The SFC module is still named Share, for ease of transition. The Like button itself is still around too, so you can use both Like and Share to get two Like buttons on the same post, perhaps for different placement.
The Bookmark widget is gone. It simply isn’t supported anymore, and didn’t work anyway.
The Find on Facebook widget is gone. This didn’t do really anything special to begin with, other than place the Find Us image into a widget, with a link to the Facebook Page. The image it once used is still included in the plugin, for people that want to do this themselves via a text widget.
The Connect widget is gone, but may make a return in the next version, as soon as some bugs are sorted out.
The Upcoming Events widget is gone. It rarely worked properly to begin with, and the newer XFBML libraries doesn’t have support for it anymore. A alternate approach to this may make it back into the next version.
All the remaining widgets have been combined into a single module for use on the widgets screen. In addition, most of them still have a way to access them directly, such as from a function call in a theme.
The Publisher has been simplified greatly. For one, auto-publishing now works even for Applications! The confusing permissions dialogs have been reduced to one. Colored indicators have been added, showing when the plugin has the necessary “tokens” from Facebook in order to be able to publish properly. The manual publishing functionality is still on the edit post screens too. And for those people using the auto-publish, a new system for pulling Facebook comments on their published posts back into the blog has been implemented.
For those who wanted it, Custom Post Type support has been added to the publisher as well. Any CPT marked as “public” gets shared like everything else.
The Register system has been completely rewritten to take advantage of Facebook’s new register plugin functionality. It can handle standalone registrations, or registrations using Facebook information. It even adds a Facebook created captcha to prevent spam registrations.
Login has been improved. One of the most common complaints was “What does ‘User not recognized’ mean?” This should be severely reduced now, since the Login module will auto-detect existing users and automatically connect their local WP accounts with their FB accounts, when they try to login. This follows Facebook’s own Registration Flow Models for connecting users to sites.
There’s a lot more too. I’ll be updating this post with new stuff soon!
Another new thing in SFC 1.0 is the new Login and Registration mechanism. The login mechanism in the older SFC worked, but it was slightly buggy and didn’t work very well. The new mechanism works quite well indeed.
Login screen with Facebook popup
For starters, it will auto-connect existing accounts to Facebook, based on matching email addresses. Just Login with your FB credentials, and if you’re using the same email in both sites, then it auto logs you in based on that. Your account gets automatically connected to your Facebook Profile, and this appears in the “Howdy” dropdown as well as on your Profile.
This may seem insecure to some, however the mechanism behind the scenes is that Facebook sets a cookie in your browser, and cryptographically signs it. Your Application Secret is the key used to decode this signature, thus proving it came from your Facebook application, and eliminating the risk of having users log in without your valid credentials.
However, this does point out something everybody should know: Secrets are supposed to be secret. So keep your Facebook Application Secret a real secret. This applies anytime you’re setting up interconnected web applications. Secrets are called that for a reason.
In order to integrate Login and Registration using Facebook, Facebook came up with what is essentially a flow diagram explaining the steps an app should use to login and register somebody to a third party site.
Facebook's rather complex registration flow diagram
This rather complex looking flowchart shows how a site which has its own login and registration mechanism can implenent Facebook. I’ve followed this chart as best as possible, and thanks to FB’s Registration plugin, it works quite well now. Here’s how it breaks down.
For existing users:
You click the Login button.
You login to Facebook if needed.
If your email on Facebook matches your email in WordPress, you’re logged in and your account is automatically connected.
If your email doesn’t match, then you can log in normally with WordPress instead, and connect your account manually, on the Users->Your Profile screen.
For new users:
You click the Login button.
You login to Facebook if needed.
If no account can be found for you from the login process, you get redirected to the Register page.
There the Facebook register plugin shows up and lets you register for the WordPress site, using your Facebook credentials. All it asks for is a username and to solve a CAPTCHA (to prevent spam registrations).
You get a new WordPress account, already connected to Facebook for you. It even emails you a password.
Some have expressed concern that Facebook seems required for registration. This is not actually the case, because after all, not everybody uses Facebook. One of the nice things about the FB Register plugin is that it has different methods for Facebook connected users vs. non-Facebook connected users. Both types of users can register for the site. Facebook users get some advantages like having their account automatically connected and not having to type in an email address, but the basic process is the same.
For new users not using Facebook:
You click the Register link.
The Facebook register plugin shows up and lets you register for the WordPress site. It will ask for a username and your email address, as per the normal registration process. It does have the CAPTCHA too, and tells you that you can login using Facebook as well, if you want.
You get a new WordPress account, and it emails you a password.
And after logging in and having it recognize you, the user will be automatically connected to their account on their Profile page.
I sort of snuck this into Simple Facebook Connect 0.18 for you all.
If you go to http://facebook.com/insights, then one of the new things they have is “Insights for your Domain”. Basically, this lets you hook the Facebook Insights system up to your own domain.
They give you meta info to add to your site so as to define who has control over that site. This lets them know who should be able to see the insights and such.
Well, if you use SFC, that information is already there for you. Just go over to the insights page, put in your domain, then “Link With” your SFC Application. No need to add anything else to your site, the base SFC plugin is adding that fb:app-id meta tag for you automatically (once you’ve configured SFC itself, of course).
Note that you may have to link it a few times before it actually takes. Facebook has to retrieve your webpage to verify the connection, and it seems to time out rather easily. Took me several tries and I kept getting messages like “Bad Domain” and such. But it finally worked.
Since I just added it, I don’t have any data yet to show you, but basically it will keep track of the “Shares” from your site, so those Share buttons will now give you some useful information and feedback on the Insights page.
Additional: Note that since I wrote this post, Insights never actually updated or worked at all. Facebook basically dropped the ball and never actually finished this code or turned it on or something. I seriously wonder exactly WTF they are doing over there sometimes. Anyway, here’s the bug if you want to track it: http://bugs.developers.facebook.com/show_bug.cgi?id=10174