https://github.com/alexislepresle/gatsby-plugin-paypal

💰 Add a PayPal Smart Payment Buttons to your Gatsby website easily.
https://github.com/alexislepresle/gatsby-plugin-paypal

gatsby gatsby-plugin paypal paypal-button paypal-rest-sdk

Last synced: 2 months ago
JSON representation

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

• Host: GitHub
• URL: https://github.com/alexislepresle/gatsby-plugin-paypal
• Owner: alexislepresle
• Created: 2020-10-23T08:48:47.000Z (over 4 years ago)
• Default Branch: master
• Last Pushed: 2021-09-25T10:01:05.000Z (over 3 years ago)
• Last Synced: 2023-12-23T11:06:29.009Z (about 1 year ago)
• Topics: gatsby, gatsby-plugin, paypal, paypal-button, paypal-rest-sdk
• Language: JavaScript
• Homepage:
• Size: 36.7 MB
• Stars: 8
• Watchers: 2
• Forks: 4
• Open Issues: 3
• Metadata Files:
  • Readme: README.md
  • Security: SECURITY.md

Awesome Lists containing this project

README

        
[![npm package](https://badge.fury.io/js/gatsby-plugin-paypal.svg)](https://www.npmjs.com/package/gatsby-plugin-paypal/)

[![npm downloads](https://img.shields.io/npm/dm/gatsby-plugin-paypal.svg)](https://www.npmjs.com/package/gatsby-plugin-paypal/)



    



# gatsby-plugin-paypal

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

## Install

`npm install --save gatsby-plugin-paypal`

## How to use Paypal plugin

```javascript

// In your gatsby-config.js

module.exports = {

  plugins: [

    {

      resolve: `gatsby-plugin-paypal`,

      options: {

        clientId: `YOUR_CLIENT_ID`,

        currency: `EUR`, // Optional

        vault: true // Optional

      }

    }

  ]

};

```

## Options

#### `clientId`

Your PayPal Client ID.

You will find it on: https://developer.paypal.com/developer/applications/

#### `currency`

The currency of the transaction.	

#### `vault`

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:

```js

import React from "react"

import Paypal from "gatsby-plugin-paypal"

const PaypalButton = () => (

    

)

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](https://developer.paypal.com/docs/integration/direct/rest/currency-codes/) 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](https://developer.paypal.com/docs/checkout/integrate/#5-capture-the-transaction) |                |

| `onApprove`               | `(data, actions) => any`  | See [onApprove](https://developer.paypal.com/docs/checkout/integration-features/funding-failure/)  |                |             |

| `onError`                 | `(error) => any`          | See [onError](https://developer.paypal.com/docs/checkout/integration-features/handle-errors)       |                |

| `onCancel`                | `(data) => any`           | See [onCancel](https://developer.paypal.com/docs/checkout/integration-features/cancellation-page/) |                |

| `onInit`                  | `(data, actions) => any`  | See [onInit](https://developer.paypal.com/docs/checkout/integration-features/validation/)        |                |

| `onClick`                 | `() => any`               | See [onClick](https://developer.paypal.com/docs/checkout/integration-features/validation/)        |                |

| `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](https://developer.paypal.com/docs/subscriptions/integrate/#4-create-a-subscription)                                                                                        |

| `style`                   | `object`                  | See [Customize the PayPal Buttons](https://developer.paypal.com/docs/checkout/integration-features/customize-button) | `{}` |

## Contribution

[Pull requests](https://github.com/alexislepresle/gatsby-plugin-paypal/pulls)