Migrate to Netlify Today

Netlify announces the next evolution of Gatsby Cloud. Learn more

ContactSign Up
Community Plugin
View plugin on GitHub

npm package npm downloads



Add a PayPal Smart Payment Buttons to your Gatsby website easily.


npm install --save gatsby-plugin-paypal

How to use Paypal plugin

// In your gatsby-config.js
module.exports = {
  plugins: [
      resolve: `gatsby-plugin-paypal`,
      options: {
        clientId: `YOUR_CLIENT_ID`,
        currency: `EUR`, // Optional
        vault: true // Optional



Your PayPal Client ID. You will find it on: https://developer.paypal.com/developer/applications/


The currency of the transaction.


The vault status of the transaction. If set to true:

  • Shows only funding sources that you can add to the vault
  • Set up a billing agreement, reference transaction, or subscription.

How to Use Paypal component

This is what a component using gatsby-plugin-paypal might look like:

import React from "react"
import Paypal from "gatsby-plugin-paypal"

const PaypalButton = () => (
        shape: 'rect',
        color: 'blue',
        layout: 'horizontal',
        label: 'paypal',

export default PaypalButton

Additional props of Paypal component

Name Type Description Default
amount string The amount value of the transaction.
currency string The currency of the transaction. The three-character ISO-4217 currency code. PayPal does not support all currencies. Warning: Uses the same value as declared in the plugin options USD
createOrder (data, actions) => any See createOrder
onApprove (data, actions) => any See onApprove
onError (error) => any See onError
onCancel (data) => any See onCancel
onInit (data, actions) => any See onInit
onClick () => any See onClick
shippingPreference string The shipping preferences. The possible values are: -NO_SHIPPING: Redact shipping address fields from the PayPal pages. Recommended for digital goods. - GET_FROM_FILE : Use the buyer-selected shipping address. - SET_PROVIDED_ADDRESS : Use the merchant-provided address. Buyer cannot change the address on the PayPal pages. If the merchant does not pass an address, the buyer can choose the address on PayPal pages. GET_FROM_FILE
createSubscription (data, actions) => any See createSubscription
style object See Customize the PayPal Buttons {}


Pull requests

© 2023 Gatsby, Inc.