We’re going there. We’re moving a little bit closer to this newfangled social media fad the kids are talking about these days. I decided to add in a Facebook icon on the title screen of Brok, just for the purposes of giving our players an easy way to keep up with our scuttlebutt.
The idea is to offer the most painless way possible for players to “like” us on FB (btw, we have a FB page, you should check it out). I began by looking at the various Corona tutorials and examples to see how the integration should work. Corona has a Facebook api baked in, giving the developer an easy way to get a user logged in and make requests against the FB social graph. Below are a handful of the many posts that could help you get up and running.
- Corona’s own documentation on their FB api could be helpful
- Crawl Space has a custom wrapper around Corona’s api
- TutsPlus with a fairly extensive write up
- And Peach Pellen has some additional helpful comments on Techority
After reading through all that, and several other sites, I was still not sure what I wanted to do. Here’s the problem: in all the examples I could find, the author assumed I would want to publish to the user’s stream. All I really wanted was a quick way to have the player like our page. I’ve seen the FB plugins on various websites that let me like a page without actually viewing it from within FB. I want that, but from within my game. And I think I found that solution, sort of.
if(not system.openURL("fb://page/155914404475074")) then
system.openURL("http://www.facebook.com/SketchyVentures")
end
Change the URLs to be appropriate for you, then put the above code in the touch handler for your FB icon image. Explaining how to set that up is outside the scope of this post. However, if you DO need help with that part, let me know in the comments.
What does this get me? Well, despite what Corona’s docs tell you, system.openURL() does, in fact, return something; it returns true if the URL scheme is registered (the app is installed), and false otherwise. As you can see, in the first line I attempt to open the URL “fb://page/{id}”, where {id} is the page id of my Facebook page. Using “fb” instead of “http” lets the system know we would like the FB app to open this URL, as opposed to the default browser (“http”) or email program (“mailto”). If it can (the app is installed), great! Otherwise, we fall through to the standard URL request. This will open up the default browser and point it to that URL.
Now, I hear you saying, “But that’s a terrible user experience. You’re taking them out of your game to another app or browser!” You’re right. However, let’s consider the alternative. I could use the baked in FB api calls. I could request to log in to FB. If my app hasn’t logged in before, the user is presented with the FB login dialog. Once they login, they are shown a screen with all the permissions I’m asking for. They see that I want to be able to publish to their stream (you can limit this a bit by using publish_actions instead of publish_stream, which still gives you permission to like things on the user’s behalf). Hmm.
We want to user to like us, which should be a single click. But so far, we’ve asked them to type in credentials and evaluate whether they want to give us permissions to their timeline. Using single-sign on (SSO), we can mitigate one step (asking the user to login) if (1) they have the FB app installed, and (2) they are already logged in. There’s also the issue of creating all the necessary pieces on FB’s side (you must create an app page, even if you don’t intend to use it as such), and some other bookkeeping (small changes to your build.settings file, etc).
Despite the extra effort required, SSO is a best user experience when your app needs additional permissions to the user’s FB social graph. In my opinion, my way works better for the situation that I’m describing. It is nearly equivalent to using SSO, however there are two distinctions. First, my approach doesn’t require the user to consider giving me permissions. This is good; I don’t need permissions, and I don’t want permissions. Second, the user will possibly have to navigate back to my app after liking. This isn’t the case on Android, since the Back (hardware) button should return them to me. It is the case for iOS, and it’s not ideal. However, I prefer that to asking for permissions I don’t need.
Hello how did you get your “fb://page/155914404475074”
Im not sure how to change this link to the page that i need it directed to.
Hey Steve,
That long number, 155914404475074, is actually my facebook company page id. To get this for your page, use the following link:
http://developers.facebook.com/tools/explorer/?method=GET&path=YourPageNameHere
Replace ‘YourPageNameHere’ with your page. For example, mine is SketchyVentures, so I would use the link
http://developers.facebook.com/tools/explorer/?method=GET&path=SketchyVentures
If you get that to work, you should see a JSON response with a lot of properties. The one you want is “id”, and is a 15 digit number.
To test that you have the right number, use the following URL but with your id
https://graph.facebook.com/YourIDHere
If that pulls up the a JSON response as before, then you have the right id. Now take that original link you referenced, and replace my id with yours, and you should be golden!
Let me know if that helps, or if you are still having problems.