checkout

PayPal Checkout Quick Start

Follow these steps to create a fully functioning PayPal Checkout buttons within minutes:

  1. Copy and paste this HTML and JavaScript code snippet into an HTML file.

    <div id="paypal-button-container"></div>
    <script src="https://www.paypalobjects.com/api/checkout.js"></script>
    <script>
    // Render the PayPal button
    paypal.Button.render({
    // Set your environment
    env: 'sandbox', // sandbox | production
    
    // Specify the style of the button
    style: {
      layout: 'vertical',  // horizontal | vertical
      size:   'medium',    // medium | large | responsive
      shape:  'rect',      // pill | rect
      color:  'gold'       // gold | blue | silver | white | black
    },
    
    // Specify allowed and disallowed funding sources
    //
    // Options:
    // - paypal.FUNDING.CARD
    // - paypal.FUNDING.CREDIT
    // - paypal.FUNDING.ELV
    funding: {
      allowed: [
        paypal.FUNDING.CARD,
        paypal.FUNDING.CREDIT
      ],
      disallowed: []
    },
    
    // Enable Pay Now checkout flow (optional)
    commit: true,
    
    // PayPal Client IDs - replace with your own
    // Create a PayPal app: https://developer.paypal.com/developer/applications/create
    client: {
      sandbox: 'AZDxjDScFpQtjWTOUtWKbyN_bDt4OgqaF4eYXlewfBP4-8aqX3PiV8e1GWU6liB2CUXlkA59kJXE7M6R',
      production: '<insert production client id>'
    },
    
    payment: function (data, actions) {
      return actions.payment.create({
        payment: {
          transactions: [
            {
              amount: {
                total: '0.01',
                currency: 'USD'
              }
            }
          ]
        }
      });
    },
    
    onAuthorize: function (data, actions) {
      return actions.payment.execute()
        .then(function () {
          window.alert('Payment Complete!');
        });
    }
    }, '#paypal-button-container');
    </script>
    
  2. Open the HTML file in your browser and click your new PayPal Checkout buttons.

    Mobile Web


    Venmo (U.S. only) displays on mobile when the buyer opts in to pay with Venmo.

    Venmo doesn't display on desktop.

    Congratulations, you now have working PayPal Checkout buttons!

Tip: If you already have sandbox credentials, enter them in the PayPal window to see the buyer's checkout flow. To create a sandbox account, see Create sandbox accounts.

Make test calls to the API using the interactive API Explorer.

Next

Enhance your payment button with a full client-side integration:

If you're satisfied with this button layout, see PayPal Checkout button customization options and best practices tips:

Feedback