Company Blog Support
Frank Hagan
posted

Contents

    Back to Top

    Facebook Integration

     

    About

    This integration allows you to create a Connect with Facebook button and place it on your website. When clicked, the button connects the person to their Facebook account and, with their permission, opts them into your Contact database. The first name, last name and email address are added. You must create a separate Connect with Facebook button for each website or domain.

     

     

    Create the Facebook App

    1. Configure Facebook Developers App

      1. Log into your Facebook account

      2. Go to https://developers.facebook.com/

      3. Mouse over My Apps and click Add a New App Show me


      4. Select Website from the pop up dialog Show me


      5. Click Skip and Create App ID in the top right of the pop up dialog Show me


      6. Give your app a Display Name and Choose a Category. Click Create App ID Show me


      7. Fill out the captcha

      8. Go to Settings  Show me


         
      9. Fill out the info in the Basic tab. Note: you do not need to add an entry into the Namespace, App Domains or Contact Email fields for the app to be active.  Show me

      10. Click the + Add Platform button Show me


      11. Select the Website option Show me


         

      12. Enter the URL the Facebook button will be hosted on Show me


      13. Save Changes

      14. Copy the App ID: on this page to the clipboard and click Save.  Show me


      15. Click the Status & Review tab and make sure the slider next to "Do you want to make this app and all its live features available to the general public?" is set to Yes Show me


      16. There is nothing else to do in Facebook, and you can safely close the developer center.

    NOTE: As per item "p." above, you should not submit the app to Facebook for approval. Facebook does not require approval for apps that are just using the Facebook ID to log into your site. Note that the items your app requests are listed with green "approved" radio buttons as shown here:


     

    Configure the App in ONTRAPORT

    1. Configuration

      1. Log into ONTRAPORT

      2. Go to Administration > Integrations section > Facebook

         

      3. Click the New Facebook App button Show me


      4. Name the app

      5. Paste the Facebook App ID from step 1n into the Application ID field

      6. Set a redirect URL. After a contact opts in using Facebook they will be directed to this page. Show me


      7. Save

    2. Get your ‘Connect to Facebook’ button code

      1. Select your Facebook App

      2. Click Generate Code Show me


      3. Copy the generated code to your clipboard.

      4. Paste the code on your web page where you want the Connect with Facebook button to appear. Save the page and test the button function.

        Note: Facebook may display an error code when you click the button. If it does, edit this line in the code:  scope="email,public_profile,user_location,user_hometown,user_birthday,user_website,user_likes,user_friends" to read simply: scope="email,public_profile,user_friends"

         

     

    Have more questions? Submit a request

    Comments

    • Avatar
      Kai Thomas Gilb

      thes instructions need updating. Facebook looks nothing like this now.

    • Avatar
      Frank Hagan

      The images on the Facebook side are exactly what you should be seeing. Here is a quick screen grab I did this morning of steps (a) through (m) in the Create the Facebook App section of the instructions: http://screencast.com/t/vBU0QxZmf2  Compare those to the screen shots in steps (a) through (m) above. 

      Facebook does do a lot of split testing on their pages; try again and see if you don't get pages at least similar enough that you can complete the instructions.

       

       

    • Avatar
      Karin Amali

      Hi Frank, I have followed these instructions. I change the button code as per 2(d) above. When I have the code one any of my website pages, and I go to a page on the site that has the code, it just automatically goes across to my Facebook page. So people don't have any time on my page. Can you advise how to fix this please? Thank you. 

    • Avatar
      Caroline Sumners

      Hi Frank - where exaclty should I put the code?

    • Avatar
      Michael

      Yeah these instructions need updating a bit. Also, how can we add this button to an ONTRApage or ONTRAform? Do we need to use Custom HTML block? This would be a useful button next to or alongside the current forms!

    Powered by Zendesk