Selling digital goods online - set up in 15 minutes. Landing page built with Carrd and then using Gumroad for payment and product delivery.
(Inspired by Refactoring UI)
Create a landing page on Carrd
First set yourself up with a Carrd account (Makerpad members get 40% off with this deal). And select a blank canvas
We’re going to use the Refactoring UI website as inspiration for our site.
Set up your page with a white background, align center and up top.
Then add a container with width 70 and two columns. Set the alignment of the left column to ‘Left’ and the right column to Center. In the container apperance settings, set the contents alignment to center (vertically).
Add your heading and subheading text elements. Then add a form element.
We're using a Signup form and linking with Convertkit - you can follow the instructions on Carrd to do this.
Add an image on the right column.
The rest of the page is just basic styling which you can tweak how you wish.
I re-selected the page and changed the alignment to left so that the text in the second section would be left aligned. You can select containers to make them specifically center aligned. Adding two containers close togther, if you have them with background colours you will see a small gap between them. Make sure your top and bottom margins are on 0 instead of Auto.
For the Pricing section we use a list element and change the icon to checkmarks. For the FAQ section we use a Table element, remove the headings and style.
Set up your Gumroad product and link with your site
Sign up for Gumroad and go through the onboarding. Select your country and category. Now you can add a product - it's not recurring or anything so just select product.
Name it, price it and attach the file(s) you're selling - example: an ebook PDF. Then add a preview image and description as this is what will show on your 'checkout' page. You can also add a unique URL.
When editing you can preview what your page will look like. Copy the URL you created (and what shows when you preview) and head over to your Carrd site. Select the button in your pricing section and add the URL there.
You can add variants, discounts and license keys in your Gumroad product dashboard if applicable.
Publish your product! Once published, you'll be able to tweak the Gumroad button and add tags. Now you can add this button to your site - instead (or as well as) the custom button you created. You simply just add an embed element on the page, paste the code and you're done.
Publish the changes to your site and test it out - you'll see that both buttons work the same way.
And that's it - you're up and ready to sell your digital products in no time.