Skip to main content

Adding Facebook App Invite For Cordova and Phonegap Apps

Share on FacebookTweet about this on TwitterShare on Google+Share on RedditShare on StumbleUponDigg thisFlattr the authorPin on PinterestShare on TumblrShare on LinkedInPrint this pageBuffer this page

In this post, I will show you how you can add Facebook App Invites for you Cordova apps. App Invites are a grate way to increase downloads of you apps by giving users a way to share your app with their Facebook friends.

Before we begin I want you to use you own Facebook IDs and keys if you copy mine then it will not work for you as I will be deleting the Facebook app that I will create in this tutorial. Also this tutorial will be for android only but if you wish to do the same for iOS you can follow along and make changes for iOS wherever relevant.

What are app invites?

The facebook documentation has a pretty good definition, “App Invites are a content-rich, personal way for people to invite their Facebook friends to a mobile app.”. In other words you can invite your facebook friends to use an app. But a thing to note here is that App Invites can only be received on a mobile platform. So if you send an app invite to a facebook friend and they are using facebook from their computer they will not receive App Invite notification. Read more about App Invite here.

Step 1)

We will first start off by creating a fresh project, I will be creating it in Cordova. But if you are using another framework such as PhoneGap or Ionic you can create a new project and follow along as well.

 

Step 2)

Now we will need to create a Facebook app. So head over to https://developers.facebook.com/ and create a developer account if you do not have one already.

After logging into the developer Dashboard we will create a new Facebook app by clicking the MyApp button.

cordova facebook app invite image 1

 

Now select the platform in the prompt, I will select Android.

 

 cordova facebook app invite image 2

 

Hit Skip and Create App ID in the next prompt.

 cordova facebook app invite image 3

 

In the next prompt fill out the required app details such as Display Name, NameSpace and Category also make sure to note them down as we will need them later.

cordova facebook app invite image 4

 

After clicking Create App ID we will be given our app info with App ID as shown.

cordova facebook app invite image 5

Note down the App ID we will need it as well.

Now we will need to activate the app for public use, for that we will need to add a valid email address to our app so go to settings and add the email and click save changes.

cordova facebook app invite image 6

 

Now go to App Review and make the app public.

cordova facebook app invite image 7

 

Step 3)

We have created our Facebook App now we will need add a platform to it, for that again go to settings and click add platform and fill out the details as shown, you will need you own Package Name and Key Hashes (see below for how to get it).

cordova facebook app invite image 8

Here the Google Play Package Name is the package name / Widget ID of you app which you can find in config.xml file

The Class Name has to be com.facebook.LoginActivity

The Key Hashes are to be generated by you so here is how you can do it,

  • Download openSSL form here (Choose what is relevant to your platform).
  • Extract the contents of the download in a folder and navigate command prompt in that folder.
  • Run the following
You will be promoted for a password enter a password, and hit enter then a Key Hash will be generated for you. Copy and paste the Key and click save changes.

cordova facebook app invite image 9

For more on generating Key hash see here.

 

Step 4)

Now that we have created and configured our Facebook App we are not done yet, there is one more thing that we need to do before we leave Facebook which is creating an App Link, basically an App Link is the link that will point to your app and that is what will be shared in the App Invite.

Here is how we can do this,

  • Go to Facebook App Links Hosting here
  • Click on Create App Link
  • Select you Facebook App from the drop down do not click on Skip Quick Start
  • Scroll down to Enter App Data to Build Your App Link section
  • Under Android Data > Package Name enter the package name of your app e.g, io.cordova.hellocordova
  • click on Next

You will get a link which is something like this https://fb.me/123456789012345

This is the App Link that will be used for invites, we will need this link in the future so make sure you copy it down.

Now we are all done with Facebook.

In the next page we will go ahead and download plugins and code our app.

Consider Subscribing / Donating
Subscribe To Mailing List
Donate
If my site was helpful to you, then please consider donating via paypal:

Prantik Vaghela (pointdeveloper)

Hi my name is Prantik Vaghela. I have done my Bachelors and Masters in Computer Science and am a web developer and now a Tutor through my blog. :-)

%d bloggers like this: