Using the DonateMate App Block

Adding the Donation Widget to your Shop

1. Go to your Shopify Admin > Online Store and select the Theme you want to customise.

2. In the Theme editor, find the page you want to add the donation app block to. In these steps, we will add it to the homepage but the steps are the same for any other page.

3. At the bottom right, click Add Section and select Donation Widget 

4. You'll now see the Apps section populated with a Donation Widget and a message appear in your preview that says "Product Missing". This means that a DonateMate product has not been selected yet. Don't worry, if you don't have time to set one immediately, you can always do this later. 

Important note: The "Product Missing" message is not displayed on your live shop.

5. Click on the Donation Widget and you will be taken to the settings screen (it may also appear on the right-hand side of your browser if your screen is big enough) and click Select Product.

7. You will now see a list of all your products in your shop. There can be quite a few so it might take a second. If you select a product that is not managed by DonateMate, then a message will appear asking you to select a different product. You can always add a new product to DonateMate from the Apps > DonateMate > Products option.

8. If you want, you can search for your DonateMate product in the search bar. You could try to use just 'DonateMate' as it will be listed as the vendor for any DonateMate products. When you select an eligible product, the Donation Widget will automatically populate with the title, description and main image from the donation product. These can all be managed from the Shopify Admin > Products page. 

9. Click Select.

10. You can also edit some of the other settings, but if you are happy, click Save in the top right corner, and you are all done!

Finished! You have now added a donation widget to your home page!