--- title: "How to: Donation Button to Start Accepting Money On Jamstack Sites" description: "See how accepting donations is a fast & powerful way to make money on your website. Whether you’re a non-profit or an indie creator, learn how to get started with Stripe in minutes!" source: "https://www.netlify.com/blog/2020/04/28/add-a-donation-button-and-start-accepting-money-on-jamstack-sites/" last_updated: "2026-07-16T11:11:52.000Z" --- Taking donations is a fast & powerful way to take in money on your website. Whether you’re a non-profit or an indie creator, get started with Stripe in minutes! We recently teamed up again on _Learn With Jason_ to [build a Jamstack site with a donation button](https://www.learnwithjason.dev/accept-donations-on-jamstack-sites). In this tutorial, we’ll walk through the process of adding a donate button to a Jamstack site and processing donations securely through Stripe Checkout. ## tl;dr - Demo: [https://stripe-donations-lwj.netlify.app/](https://stripe-donations-lwj.netlify.app/) - Source code: [https://github.com/jlengstorf/stripe-donations](https://github.com/jlengstorf/stripe-donations) - [Deploy your own copy to Netlify](https://app.netlify.com/start/deploy?repository=https://github.com/jlengstorf/stripe-donations&utm_source=blog&utm_medium=stripe-donations-jl&utm_campaign=devex) ## Watch this tutorial in video format If you prefer video, this tutorial is also available as [an egghead lesson](https://jason.af/egghead/stripe-donations). [Add a Donation Button to a Website Using Stripe](https://egghead.io/lessons/egghead-add-a-donation-button-to-a-website-using-stripe) ## Create a donation product on Stripe To get started, we need to create a product on Stripe that represents the donation. 1. Go to [https://dashboard.stripe.com/products](https://dashboard.stripe.com/products) 2. Click ”+ New” 3. Leave “one-time purchase products” selected 4. Add a descriptive name, such as “Donate $5” 5. Set the amount (e.g. $5.00) 6. Click “Save product” 7. Copy the SKU on the next page (will look similar to `sku_H7BEsLD3uMHLVB`) Keep the SKU handy, because we’ll need it in a minute. ## Get your Stripe publishable key Next, we need our Stripe publishable key, which tells Stripe which account the donations should be sent to. Go to [your API keys](https://dashboard.stripe.com/test/apikeys) and copy the publishable key. ![API keys section of the Stripe dashboard](/v3/img/blog/stripe-api-keys.png) ## Add a button to your site Next, we need to add the HTML to our page that displays the donation button, as well as a div to display error messages in case something goes wrong. Update `index.html` ```

Donate To Our Cause!

This demo is in test mode. That means you can check out using any of the test card numbers.

+ ++
```