Fill your Unbounce Forms using Facebook data

facebookformfill.md

Fill your Unbounce Forms using Facebook data

Follow the full instructions here: https://community.unbounce.com/unbounce/topics/filling_in_form_fields_with_info_from_facebook#reply_14318503

<script>
  /**
    * Do not remove this section; it allows our team to troubleshoot and track feature adoption. 
    * TS:0002-13-010
  */

  function setFormValues(response) {
    
    // ***UPDATE FIELDS BELOW***
    //Adjust field IDs on the left with the field IDs on your form
    $('#email').val(response.email);
    $('#name').val(response.name);
      
    //Uncomment the lines below if you require the additional data
      
    //$('#firstNameField').val(response.first_name);
    //$('#lastNameField').val(response.last_name);
    //$('#linkField').val(response.link);
    //$('#genderField').val(response.gender);
    
    //The form willl submit by default. To disable this comment out the line below
    lp.jQuery('.lp-pom-form .lp-pom-button').click();
  }
  

  function statusChangeCallback(response) {
    if (response.status === 'connected') {
      fillForm();
    } else if (response.status === 'not_authorized') {
      triggerLogin();
    } else {
      triggerLogin();
    }
  }
  
  // Show Login Window
  function triggerLogin() {
    
   FB.login(function(response) {
     if (response.status === 'connected') {
         fillForm(); 
        }
   }, {scope: 'public_profile,email'}); 
  }
  
  // Called when your Facebook button is clicked
  function checkLoginState() {
    FB.getLoginStatus(function(response) {
      statusChangeCallback(response);
    });
  }

  // Update appId below to reflect your Facebook Apps ID
  window.fbAsyncInit = function() {
  FB.init({
    appId      : '552705011513631',
    cookie     : true, 
    xfbml      : true, 
    version    : 'v2.0',
    status     : true
  });
  };

  (function(d, s, id) {
    var js, fjs = d.getElementsByTagName(s)[0];
    if (d.getElementById(id)) return;
    js = d.createElement(s); js.id = id;
    js.src = "//connect.facebook.net/en_US/sdk.js";
    fjs.parentNode.insertBefore(js, fjs);
  }(document, 'script', 'facebook-jssdk'));
  
  function fillForm() {
  
  // Update the variable below with the fields you wish to obtain
  // See the full list of fields here:
  // https://developers.facebook.com/docs/graph-api/reference/user
    var requestedFields = {
      fields: 'name, first_name, last_name, email'
    };
    
    FB.api('/me', requestedFields, function(response) {
      setFormValues(response);
    });
  }
</script>