JavaScript Ads Dialog for Payments

This is a secure solution that enables you to provide a Facebook Ad Payments dialog in your own user interfaces with Facebook's JavaScript SDK. Advertisers can trigger the dialog on your platform using our JavaScript SDK. Someone can then enter their ad account billing information in your solution. With this extension to our JavaScript SDK, you can onboard new advertisers more easily.

Step 1: Facebook JavaScript SDK

Include the Facebook JavaScript SDK, along with your app ID.

<script>
  window.fbAsyncInit = function() {
    FB.init({
      appId            : ‘<YOUR-APP-ID>’,
      xfbml            : true,
      version          : 'v3.1'
    });
  };

  (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 = "https://connect.facebook.net/en_US/sdk.js";
     fjs.parentNode.insertBefore(js, fjs);
   }(document, 'script', 'facebook-jssdk'));
</script>

Step 2: Add Trigger

Step 2: Add this code to trigger the new dialog for someone's ad account. We recommend you trigger this code with a button click.

<script>
FB.ui({
  account_id: ‘<ACCOUNT-ID>’,
  display: 'popup',
  method: 'ads_payment',
});
</script>

Step 3: Check Payment Source

Verify a configured payment source. Make one of the following API calls against the user's ad account:

GET /act_<ACCOUNT_ID>/?fields=funding_source
GET /act_<ACCOUNT_ID>/?fields=funding_source_details

funding_source or funding_source_details has information about the payment details provided by the user. If the fields are not in the response, the user added no payment method to the account.

To access funding_source_details, the user making the API call must have a MANAGE task permission for that specific ad account. See Ad Account, Assigned Users for more information.