Step 1: Creation of a Facebook App

To be able to integrate Facebook interactions in your app, you must create a Facebook app. This app is a small software that will enable to create links between your app and the Facebook account of your users.

To create a Facebook page click on this link: https://developers.facebook.com/ .

This window appears:

To create a Facebook Application, you have to register as a developer on Facebook. Don’t worry it’s completely free. Click on Apps to follow the process.

This appears:



Click on “I accept the Facebook Platform Policy and the Facebook Private Policy” and then click on Continue to validate your choice.

This appears:

You have to enter you phone number to validate your account.

Step 2: The creation of a Facebook app

Now, you are registered on Facebook as a developer, you are now able to create the app which will enable your users to connect to your app with their Facebook account. To do this, click on “Apps” at the top of the page.

The application page appears. To create a new app click on:

This appears:

Enter the required information in the fields:

Ex:

App Name: Test
App Namespace: Test (optional)
App Category: Local or Communication (Facebook may display another type of screen, so choose “communication” if you don’t see “Local”)

Once you have entered all the informations in these fields click on Continue. A security check appears.

Now you should see one of these pages, the one on the left is the old version, and the one on the right is the new one:
 or 

Here we are. We have just created our first Facebook app. Now you must have to set it. If you see the right screen, click on “settings” from the left menu.

Step 3: Settings of your Facebook App

Now you will have 3 possibilities depending on 3 types of settings:
  • On rocketappbuilder.com, for your app, you don’t have set up a custom domain name for your mobile website, and you don’t have set up a white label admin panel. So, click here to see the process.
  • On rocketappbuilder.com, for your app, you don’t have set up a custom domain name for your mobile website, but you have set up your white label admin panel. Click here to see the process.
  • On rocketappbuilder.com, for your app, you have set up a custom domain name for your mobile website, regardless you have or not set up a white label admin panel. Click here to see the process.
1st CASE:
In Facebook, in the “App domains” field, enter “rocketappbuilder.com” without “http” neither “www.” :

Next, Go in “Settings” and click on “+ add platform”, and add “Website”.

Just fill out the “Mobile Site URL” field with the URL of your mobile website you will find in the “Extra” section on rocketappbuilder.com, enter http://www.launchpad.rocketappbuilder.com/xx/XXXXXX (replace the “x” by your info).

2nd CASE:
In Facebook, in the “App domains” field, enter the url of your white label admin panel without “http” neither “www.”. For example, “admin.yourdomain.com”

Next, Go in “Settings” and click on “+ add platform”, and add “Website”.

Just fill out the “Mobile Site URL” field with the URL of your mobile website you will find in the “Extra” section on tigerappcreator.com, which should be like http://admin.yourdomain.com/xx/XXXXXXX (replace the “x” by your info):


3rd CASE:
In Facebook, in the “App domains” field, enter the url of your mobile website custom domain without “http” neither “www.”. For example, “mobile.domain.com”

Next, Go in “Settings” and click on “+ add platform”, and add “Website”.

Just fill out the “Mobile Site URL” field, enter the url of your mobile website custom domain, this time with “http://”, and “www.” if needed:

Here is the continuation regardless of your previous case.

Step 4: Your app keys

Now, you just have to enter the application ID and the secret key on Rocket App Builder

Then go in “Settings” from the left menu, and you will find your App ID and Secret Key:

Copy and paste it in rocketappbuilder.com.
Then, in “status&reviews” in your Facebook App page, from the left menu, and in front of “Do you want to make this app and all its live features available to the general public?” switch to “yes”.

Step 5: Submission

You have to submit your Facebook app to Facebook for validation.
Note that if you don’t have a Facebook page in your app, but you just want to offer the Facebook login in the “My account” tab in your app, you don’t have to submit your Facebook app to Facebook. Your system is working and the next steps are not for you.
Thus, if you have a Facebook page and you want users to like and comment, first, go on App Details from the left menu on Facebook.
Enter a description of your app. Stay simple: “this app allows the mobile users to login with their Facebook account, and like and comment on our Facebook page”.

Then, in the “Contact info” section, copy and paste the url of your Privacy policy you will find in “Settings” on launchpad.rocketappbuilder.com

In the “Icon” section, upload a 1024x1024px icon for your Facebook app. Save changes

Then go in “Roles” menu from the left menu on Facebook. In the header menu, click on “Test users”, then click on “add”. Switch to on “Authorize Test Users for This App?”, and “Enable Ticker?”, let the select box on “V2.0 API”.     Click on “create test user”. Then click on the pencil to edit the new test user, and enter a password for this user (a simple one like “password123” for instance), and save. Copy the email of this test user, we will have to use it on the last step.

Then, go in the “Status & Reviews” section from the left menu on Facebook, click on “start a submission”. In the window that opens choose “Publish_actions” in “login permissions”. Click on “add items”.
Then, at the bottom of the page you will see a “screenshot section”.
At this stage, you will have to create some screenshots of your app created on tigerappcreator.com to show the Facebook review team how Facebook will work on your app. The best way to do that is to take some screenshots from our previewer app.
Launch Mobile Company Previewer, go in your app, and take only screenshots regarding where Facebook is used: if you have integrated a Facebook page in your app, take 2 screenshots, one of the timeline (the first page of your Facebook page), and one of status details with the comment and like buttons.
But as you have to send at least 4 screenshot, takes some other screenshots to complete, it doesn’t matter if it’s not related to Facebook.

Send these screenshots on your computer, go back on your Facebook app on Facebook, and upload these screenshots.

Then, on the right of “Publish_actions”, there is a “add notes” link, Click on add notes, and write this (be sure to replace the quotes in red by the right info):

“We are using this permission to allow the user to comment or like a status of the Facebook page directly from our mobile website.
Instructions:

  • 1. open the mobile website [give the URL of the mobile website] in a web browser (no need to be in your mobile browser)
  • 2. be sure to be disconnected from Facebook in this browser before the next steps
  • 3. Then, in the mobile website, open the Facebook tab, click on a status
  • 4. Scroll down in the status, and click on the “Comment” button
  • 5. A Facebook window appears 
  • 6. login with the test user credentials: login: [copy the email of the test user], password: [enter the password for this test user].
  • 7. then you should get back to the mobile website with a successful message
  • 8. go in the Facebook page at [give the URL of your Facebook page]
  • 9. go in the status you have commented, and you can see the status has been commented
  • 10. Without the publish_actions property the user wouldn’t been able to post on the Facebook page status directly from the mobile website.

Then, click on “submit for review”.
And it’s done!