How To Integrate Facebook And Nanacast

We will setup a Facebook app that integrates with a Nanacast offer based on the instructions found here.

1. Create your offer in Nanacast. It must be a free offer.

You are on your own for this one. Do what they say, create a free offer in your Nanacast account.

2. Go to https://developers.facebook.com/ and allow the Facebook Developers App

I’m thinking that something got clipped here … basically you need to login to the developer area of Facebook. I don’t recall if there was anything special you needed to do or not to have developer privileges.

3. Go to the Apps section of Facebook Developers and Create New App. Note: Creating multiple apps per offer is supported.

Click on the Apps link, https://developers.facebook.com/apps, near the top of the page.

Click on the Create New App button.

4. Give your App a name that corresponds to your offer. You’ll need to agree to Facebook Terms and conditions, and complete the Captcha.

Provide an App Display Name. You can skip the App Namespace. Check the “I agree to the Platform Privacy Policy” box. Click Continue.

See if you can pass the security check – good luck.

5. Fill out the Basic Info section, using “nanacast.com” as the domain (without the quotes)

Where is says “App Domain”, type in nanacast.com.

6. In the Website section, the Site URL should be: http://nanacast.com

Scroll down till you see “Website I own a website and want to integrate Facebook login”. Click there to expand.

You should see a text box labeled Site URL, type in http://nanacast.com.

Click on “Save Changes”.

7. At the top of the Basic Settings page for the App, you will find the App ID and App Secret fields. Copy these, you will need to paste them into the Nanacast Facebook API.

Make note of the App ID and App Secret near the top of the page – copy them because you will need them inside your Nanacast account.

8. Login to Nanacast, and click Advanced > Facebook API.

I’m not going to say anything …

9. Click the Add Facebook App button

Go.

10. Add your App Name, Facebook App ID and App Secret. Select your Nanacast offer – only free offers will be available for selection. Submit.

Do it, then click on Submit.

11. Your new app will now show in the app list on the Manage Facebook Apps page. Click the ‘Show HTML’ button for your app to show the Facebook form code.

Copy the generated code. This is going to get paste into your website.

12. Copy the code and paste it into your website.

You will need to dig into the HTML code of your actionac.net website and figure out where to put this. As an example …

When you are done …

… your website should look something like this …

What is very cool is that the form is prefilled with your Facebook visitor’s name and email!

P.S.

Haven’t figured out how to get this to play well with WordPress. WordPress doesn’t like javascript running around in posts. When I get a solution, I’ll post it up or link out to the source.