Solved

Facebook Social Login: Fill form fields with details from Facebook

Show first post

36 replies

L

Hi Lisa, I’m not an specialist, but what I did - and it did work for me - was:

Enter the link https://developers.facebook.com/, on the upper right side, click on My Apps, and find the one you just created.

Then, click settings >> basic >> and in the field “App Domain” use yours (samwiseapp.com).
Below, at the “Website” block, include your page root URL (http://go.samwiseapp.com).

Hope it works for you too.

R

I use the basic profile from FB developer connection and have added more details of the user as age_range, and locale, which are included in the basic profile. Yet when I test people can indeed login, and I do see the basic data but these data I can never see, no matter with how many accounts (that indeed have this data) I try. I wonder if I did something wrong in the script.

I am using a test page to try it out: http://try.rekomendo.co/en/decoration/

Zoe_Tattersall
Userlevel 6
Badge +3

Hey @Johnny_Opao 🙂 this is awesome, thanks!

Quick question I haven’t been able to find an answer to in the Community – is there a way to have the Facebook data prefill the form if the user has come directly from Facebook to the landing page i.e. via a Facebook ad link ???

We’re more than just your type. We do awesome, too. And website design, graphics, product photography, video content & more. https://sevahcreative.com
J

Hi, thanks for your contribution. It works fine but the problem I have is it blocks the popup window image with facebook login.

I have looked at developer facebook and when implementing the current login button, the popup window is not blocked but I dont know how to associate it with unbounce autofill. Some help?
Thank you! 🙂

jhage

I’m the ultimate newbie here. I’m not a programmer and I’m new to the Unbounce platform. I’m trying to replicate functionality from my current landing page provider that is somewhat complex and includes a custom Facebook Login button. Despite all the amazing code shown here, I can’t figure out how to put all the pieces together to achieve what I’m looking for.

Example Page

The gist:

  1. A lightbox button on landing page

  2. Lightbox opens to display 2 options: A custom Facebook login button and a text link to sign-up via email instead.

3a. Custom FB button (upon approval by user) submits leads 1st name & email from FB to Zapier

3b. Text link opens new lightbox to enter 1st name and email address and submits to Zapier on submit

  1. User is re-directed to a “full” squeeze page requesting more information. First name and email address are shown but locked - user cannot change (see step 5)

  2. Upon Squeeze page submit, all user data is sent to Zapier. The additional information is appended to the previous submission (keyed to the email address provided).

I’ve been able create the Facebook App and have successfully setup the default buttons to generate a re-direct to a new page; however, I can’t figure out how to A) use a custom button to do this and B) how to submit the user’s data to my CRM. I don’t want a visible form in the 1st lightbox so how do I collect the data from facebook and forward it to Zapier?

Can anyone offer some help? I know it’s asking a lot! 😃

Hristian
Userlevel 7
Badge +3

Hi @jhage,

First, welcome to the community.

What you are trying to achieve is pretty complicated and unfortunately would require extensive custom development to make it all work.

Hopefully, the following should point you in the right direction:

In the past I’ve used Auth0 to fill out an Unbounce form with data from LinkedIn. They support pretty much any login platform, including Facebook, so I think that should be your first step.

After that it’s a matter of figuring out your exact flow, which you’ve done for the most part and coding it.

One of the ways to do the Facebook to CRM push is through a Zapier webhook. Once Facebook returns the necessary data, you would have to fire the data to Zapier.

Best,
Hristian

Hristian K. → experimentation-as-a-service → https://www.revise.agency/
jhage

@Hristian - THANK YOU for the recommendation on Auth0. I setup an account and created a FB social connection login - but being a non-programmer, I’m not exactly sure what to do next.

What callback URI should I be using? I’m not authenticating with my own app, I’m collecting the data and moving the user to a 2nd landing page on Unbounce. Is there an Unbouce callback URI that I should be using?

Thanks for your help. It’s sincerely appreciated!

-John

P_Fonseca1

Hi @jhage have you solved this problem?

I followed Auth0’s tutorial, but am always getting an error “Uncaught SyntaxError: Unexpected identifier” on “redirectUri: ‘https://unbouncepages.com/pedrosignup/’”

My test page is:
http://unbouncepages.com/pedrosignup/

Does anyone have any advice?

Thanks

jmo

Hi! Either I misunderstood the point or I’m doing something wrong here. I’m trying this on a landing page variant: https://www.aparelhosauditivosportugal.pt/d.html
I think I followed the tutorial exactly but it just doesn’t work. What am I missing? Thanks! 🙂
Some prints attached!

53

(upload://lfavQwegK6eU8Lmaof3WCdzPNZz.png)
12
34
57
52

ColoRedMax

Hello,
@Johnny_Opao Does this means that once visitor come into my website the form(email) on my website will be pre filled with their email fetching data through facebook (assume they did login their facebook account with their browser before) ?

Looking forward for your reply. Thank you.

S

Hi @Johnny_Opao, I’m having trouble using this script inside a Popup (iframe) on a landing page, so how can I use this script in this case? The problem is because the Popup-iframe generates another URL and Facebook doesn’t recognize it, informing that the URL is blocked. What can I do? I just need to fill the Name and Email fields on the form inside the Popup. Could you help me please?

Reply


Terms & ConditionsCookie settings