After six months of work, Grabble Words launched this week – hooray!
But – I’ve just discovered it contains an important bug – inviting Facebook friends to install the app doesn’t work – boo…
It all stemmed from a misunderstanding of the Facebook docs:
App Link URL: App Link for what should be opened when the recipient clicks on the install/play button on the app invite page.
I understood that this should be the URL for the app in the App Store, and assumed that as the App wasn’t yet active on the App Store, it would work as soon as it launched. Turns out the plot is thicker… (I have found there’s often some ambiguity in Facebook docs whether App is referring to iOS App or Facebook App – I will try to be clear about this distinction in this post.)
I have found tutorials on this topic thin on the ground, so here goes:
1. Set up a Facebook App Page.
To invite Facebook friends to install your iOS App, you’ll first need a Facebook App Page. Go to https://developers.facebook.com, create an app and make it public. Be sure to fill out the App Details tab, including Promotional Images. These images will display when inviting a friend to install your iOS App.
2. Set up a custom URL Scheme.
A what now?
Adding a custom URL Scheme to your app is like setting up a URL that will instruct your app to open. Why do we need this? Well if a user receives and clicks on an invitation to install your app, and they already have the app installed, the Facebook invitation should just open up the app directly.
It’s actually pretty easy, you just need to add a couple of items to your info.plist file:
- In the first item of your URL types property, add an identifier for your app(variously called URL identifier, CFBundleURLName) using a reverse DNS style, eg. I’ve called mine com.interactivecoconut.grabblewords.
- Within the same item, add an array called URL Schemes(or CFBundleURLSchemes), and within that, add an item with whatever word you wish to associate with your app. I’ve used the word grabble.
Here’s what that looks like in the plist file (Note the blue line is the Facebook app id which is also included for connecting to facebook)
Open the info.plist file as source code to get a look at the underlying XML:
Now we’ve set up a custom URL Scheme, build your app on your device. Done! Now, any time this URL Scheme is navigated to – from another app, or even from Safari, your app will open. Try it out – go to Safari and type the following into the URL field: (or the equivalent for the name you assigned to your app)
grabble://
You should find that after selecting return, your app opens! Custom URL Scheme set up. You can use this to pass parameters for deep linking within your app, but we don’t need this for setting up Facebook app invitations.
3. Create an App Link
Now we can set up our App Link, which is not the App Store link to your app! If I had have read on in the Facebook App Invites documentation I would have read a clearer definition of what an App Link is in this context:
The App Links protocol is a cross-platform, open-source protocol for simple mobile deep-linking.
The easiest way to set this up is using the Facebook App Link Quickstart tool.
- Select your app. (If you don’t see your app, you’ll need to first add your app to the Facebook Developers page)
- Select iOS
- Ignore Modify an existing App Link URL?
- Create an App Link Name just for yourself.
- Select iOS for a Universal App, and iPhone or iPad if your app has different settings for different devices.
- Under URL with custom scheme, you want custom URL scheme you set up earlier. Here I put: grabble://
- App Name: Straightforward!
- App Store ID: This was filled in automatically when you chose your app.
- Website Data URL – the easiest web page to add here is your Facebook App Page.
Select Next and Quickstart tool should present you with your App Link! Record this link to use later.
4. Write the code!
Ok, now comes the more familiar stuff – code!
Make your View Controller implement the Facebook App Invite Dialog delegate and add in delegate methods to receive completion handlers:
[sourcecode language=”javascript”]
extension ViewController:FBSDKAppInviteDialogDelegate {
//MARK: FBSDKAppInviteDialogDelegate
func appInviteDialog(appInviteDialog: FBSDKAppInviteDialog!, didCompleteWithResults results: [NSObject : AnyObject]!) {
print("invitation made")
}
func appInviteDialog(appInviteDialog: FBSDKAppInviteDialog!, didFailWithError error: NSError!) {
print("error made")
}
}
[/sourcecode]
Great! Now you can request the invitation – you’ll probably want to put it in an IBAction to respond to a button tap for example:
[sourcecode language=”javascript”]
@IBAction func tapInviteFriends(sender: AnyObject) {
let content = FBSDKAppInviteContent()
content.appLinkURL = NSURL(string: "https://fb.me/979111111111111")
FBSDKAppInviteDialog.showFromViewController(self, withContent: content, delegate: self)
}
[/sourcecode]
Too easy! Now when you tap your invitation button, you should see something like:
Stop press: The new version of Grabble Words is here now – try out inviting your friends, and enjoy! App Store link here.
Leave a Reply