---
title: Add Donation Progress Item in Paymattic
description: "In [Paymattic](https://paymattic.com/) the **Donation Progress Item**is an essential feature for creating a **Donation Form** to add a list of items with a fixed price with a progress bar. This article will guide you on how to add the Donation Progress…"
url: "https://paymattic.com/docs/how-to-add-donation-progress-item-in-wordpress-with-paymattic/"
updated: "2024-10-21"
category: Donation and Product Fields
---

# Add Donation Progress Item in Paymattic

In [Paymattic](https://paymattic.com/) the **Donation Progress Item**is an essential feature for creating a **Donation Form** to add a list of items with a fixed price with a progress bar. This article will guide you on how to add the Donation Progress Item to the WordPress Site through Paymattic.

[How to Use the Donation Progress Item in Paymattic | WordPress 2024](https://www.youtube.com/embed/10PaObzyW6k?list=PLXpD0vT4thWH80g5e9wYnoBMgEqUXbr53)

**Donation Progress Item** is a free feature except for the **Recurring Amount**and **Custom Amount** option and to use these two options in your field, you need [**Paymattic Pro Plugin**](https://paymattic.com/docs/how-to-install-and-activate-paymattic-in-wordpress/#1-toc-title)**.**

## Adding Donation Progress Item Field

To learn how to add the Donation Progress Item to the Paymattic Donation Form on your WordPress site, follow the steps with the screenshots below –  

First, go to the **All Forms**section from the **Pymattic Navbar,**choosea**Form,**and click the **Pencil/Edit** icon to open the **Editor** page of that form.

If you do not have any existing forms, read this [Create a Form from Scratch](https://paymattic.com/docs/how-to-create-a-form-from-scratch-with-paymattic/) or [Create a Form using Templates](https://paymattic.com/docs/simple-form-templates/) documentation to create one.

For example, I choose an existing form to show the whole process.

![](https://paymattic.com/wp-content/uploads/2022/06/Open-desired-form-7-scaled.webp)

Once you open the **Editor** page, add the Donation Progress Item fields by typing the**“ / ”**or clicking the **Plus Icon** placed at the bottom.

**Remember**, we always suggest you keep the [Name](https://paymattic.com/docs/how-to-use-general-form-input-fields-in-wordpress-with-paymattic/#5-toc-title) and [Email](https://paymattic.com/docs/how-to-use-general-form-input-fields-in-wordpress-with-paymattic/#6-toc-title) field at the beginning of any Form.

![](https://paymattic.com/wp-content/uploads/2022/06/Type-or-click-icon.webp)

For example, I choose the **Type “/” to insert fields** option to select the**Donation Progress Item**field.

![](https://paymattic.com/wp-content/uploads/2022/06/choose-Donation-Progress-Item-field-by-typing-.webp)

## Editing/Customizing the Field

You can see the **Donation Progress Item** and other necessary fields are added to the form.

You can edit their field name and settings. To learn more about form editing, read this [Documentation](https://paymattic.com/docs/how-to-edit-forms-in-wordpress-with-paymattic/).

Specifically, to edit the **Donation Progress Item**field according to your needs, click the**Settings Icon** from the right-side corner. 

![](https://paymattic.com/wp-content/uploads/2022/06/Settings-icon-of-Donation-Progress-Item-field.webp)

Now, a pop-up page will appear with various settings options for customizing the field. 

### General Settings 

All the Settings under the General Tab mentioned in the below screenshot are briefly explained:

1. **Required**: Enable this option to make this field mandatory to fill in for users for a successful submission.

1. **Enable Image**: Enable this option if you want to show image/s in your form. You can simply add image/s by clicking the Plus Icon tab option under**Upload Image**.

1. **Statistics**: Enable this option to set the Donation**Goal amount** and **Show** **a progress bar** to track the donation progress. But, if you don’t want to display the progress bar in your form, simply uncheck the **Progress Bar** box.

1. **Initial Raising Amount**: Here, you can set the minimum amount for donations your donors can send.

1. **Predefined donation amounts**: Here, you can set a list of donation items with a fixed price. 

1. **Allow custom amount**: Check this option, if you want your users to pay whatever amount they wish. This is a Pro feature.

1. **Default donation amount**: Here, you set one item from your predefined item list as a default donation item for your donors.

1. **Collect Recurring Donations**: Check the **Allow Recurring Amount** option, if you want to collect subscription payments repeatedly. Here you can set the **Maximum billing time**, and recurring duration as **daily**, **weekly, fortnightly, monthly, quarterly, half-yearly, or yearly**billing intervals and **how you want to display these options**. This is a Pro feature.

Once you set up all the settings, click the **Update** button to save all the customizations.

![](https://paymattic.com/wp-content/uploads/2022/06/General-Settings-of-Donation-Progress-Item.webp)

### Advanced Settings

Once you complete the General settings, go to the **Advanced** tab, and you will find some advanced settings for your Donation Progress Item field. These are:

- **Admin Label**: This label is used for the admin wants to see the field’s label from the back end.

- **Field Wrapper CSS Class**: This is used for adding a Custom CSS/JS for an entire field of a specific form using the Field Wrapper CSS Class element. To learn more, click [here](https://paymattic.com/docs/how-to-create-custom-css-js-in-wordpress-with-paymattic/).

- **Conditional Render**: You can set conditional logic to display the field in the form that will be triggered by specific actions taken on a previous input field. To learn more about conditional renderings, click [here](https://paymattic.com/docs/how-to-use-conditional-logic-in-form-fields-with-paymattic/).

- **Field ID**: This option is used for adding or tracking form fields. Plus, creating the custom CSS/JS for a specific form field.

Once you finish, click the **Update** button to save all your configuration. 

![](https://paymattic.com/wp-content/uploads/2022/06/Advanced-page.webp)

### Embed Form into Front-end

Now, you can see the**Donation Progress Item**field along with a **Progress Bar** is added to your form.
You can change the form’s Title and Description by clicking on it.

But, don’t forget to add a **Payment Method** field to collect the donation payments. To learn how to add a payment method field, click [here](https://paymattic.com/docs/how-to-use-the-payment-method-fields-section/).

Also, to embed and display the form on a specific Page/Post, **copy** this **Shortcode** and paste it into your desired Page/Post.

Once you complete the edit, press the **Save** button to save all the changes you made.
And, to see the **Preview** of the form, click the **Eye** icon.

![](https://paymattic.com/wp-content/uploads/2022/06/Added-Donation-progress-item-field-in-form-editor-scaled.webp)

## Preview of Donation Progress Item Field

Here is the **preview** of the **Donation Progress Item** field in a **Donation Form**.

![](https://paymattic.com/wp-content/uploads/2022/06/Preview-of-Donation-Progress-Item-feature.webp)

This way you can easily add the **Donation Proggress Item** field in Paymattic Forms!
If you have any further questions, concerns, or suggestions, please do not hesitate to contact our [@support team](https://wpmanageninja.com/support-tickets/?utm_source=wpmn&utm_medium=home&utm_campaign=site#/). Thank you. 
