Offer your most engaged readers multiple ways to support your content by adding a tip jar to your Ghost membership site with Stripe.
This tutorial will walk you through the steps of setting up the payment link in Stripe and how to add the link to your Ghost site as a navigation item, a page, and a content snippet.
Create a payment link on Stripe
Log in to your stripe account and go to Payments → Payment links. Click New to create a new payment link.
On the Create payment link page, select Let customers choose what to pay from the dropdown menu.
Fill in the details for your payment link. These details are entirely up to you. When everything looks good, click Create link.
Your payment link is now created. Click Copy to get the URL that we’ll use with Ghost.
When a visitor clicks the link, they’ll be taken to the Stripe checkout page, where they can enter their details and complete the payment.
Add the payment link to Ghost
Anywhere you can put a URL, you can use your payment link — we’re going to focus on adding it as a navigation item, a new page, and a snippet.
Navigation item
If you’ve ever added a navigation item to your Ghost site, then you’re already ahead of the curve on this one, because the process with a payment link is exactly the same.
Log into your Ghost site and go to Navigation. Add the link text and payment link URL. Click Save.
That’s it! Your tip jar is now live and active 🎉
Page
Maybe you want to make more of a case for a tip than just a navigation item. Another option to showcase your payment link is to create a new page in Ghost.
Go to Pages → New page. The design and content of the page are up to you. In the example below, we created a fictional publication, Coffee Talk. The page includes some copy along with a Button card that uses the Stripe payment link.
Publish the page and add it to the navigation bar, like in the previous section, or share it in newsletters, on social media, or wherever there’s an opportunity for support.
Create a content snippet
In Ghost, snippets are user-defined reusable bits of content. With them, you can easily copy and paste content across different posts and pages.
Here, they’re perfect for quickly adding a tip jar at opportune moments in your posts.
Using our Coffee Talk publication from above, let’s say we just shared a technique for brewing the most insane cup of coffee ever known. Now’s as good a time as any to make a call for action.
For this CTA, we used the Header card, which adds a beautiful, full-width element to the page with a customizable button (where we included the Stripe payment link).
To be able to use this on other posts and pages, we can turn the card into a snippet (which works for any post content — not just Header cards).
To create a snippet, select content and click the create snippet icon. Enter a name for your snippet and hit Save. Your snippet is now available on any post or page from the card menu 🤯
Summary
Tip jars offer your visitors a simple way to contribute to your content financially with a one-off payment, and thanks to Stripe and Ghost, this is easy to set up for your publication
How did you implement a tip jar on your website? Join the Forum to share your witty copy, ask questions, or just see what other Ghost users are up to.
Top comments (0)