Using DonateMate on the Checkout Page
DonateMate's checkout extension lets customers add a donation during checkout. Built with Polaris Web Components for a seamless, Shopify-native experience.
Please note:
Checkout customization is available only on Shopify Plus plans. If you're not on Shopify Plus, use the DonateMate widget on your store pages instead (see Article 3).
Step 1: Set Up Your Donation Product
- In your Shopify admin, go to Products and find your donation product.
- Under Sales channels and apps, ensure Online Store is enabled.
- Save the product.
Step 2: Add the DonateMate Block to Your Checkout
- In your Shopify admin, go to Settings > Checkout.
- Click Customize to open the checkout theme editor.
- In the editor sidebar, click Add app block.
- Select donations@checkout from the DonateMate app blocks.
- Position the block where you'd like it (commonly in the order summary section).
- Save your changes.
Step 3: Configure the Checkout Extension
Once added, configure the donation block in the checkout theme editor:
- Select which donation product to display
- Choose between preset amounts, custom amounts, or both
- Adjust the display text and call-to-action
Troubleshooting:
The app block doesn't appear.
Please ensure you enable the product on the Online Store sales channel.
If the app block still does not appear, you must ensure that the product tags contain "DonateMate".
I can't change the button to a different style.
Because of the Shopify Checkout User Interface requirements, button changes are limited. Contact Shopify Support for more information on customising your Shopify Plus theme.
Change the preset values
You can change the preset values for your donation product from Apps > DonateMate > Manage Products.