--- title: "Add a Payment Event to a Form" slug: "add-a-payment-event-to-a-form" description: "Learn how to add Payment Events to forms, enabling seamless transactions and conditional logic for a smooth user experience." updated: 2026-08-28T14:45:00Z published: 2026-08-28T14:45:00Z canonical: "www.civicplus.help/add-a-payment-event-to-a-form" --- > ## Documentation Index > Fetch the complete documentation index at: https://www.civicplus.help/llms.txt > Use this file to discover all available pages before exploring further. # Add a Payment Event to a Form After [setting up the CivicPlus Pay integration](/process-automation/docs/payments-integration), you can add Payment Events to forms. Payment events allow users to process transactions as part of the form submission. These will be completed after any scheduling events if they are configured. Learn how to [Build a Form that Accepts Payments](/process-automation/docs/build-a-form-that-accepts-payments). > [!NOTE] > Important Notes > > - The user can only be directed to one payment gateway. If you need to add multiple gateways to a form, ensure that [conditional logic](/process-automation/docs/conditional-logic) is configured so that only one payment gateway can ever run for a submission. > - To embed a form with a payment you will need to create a payment receipt page on your website. Learn more about [Embedded Forms with Payments](/process-automation/docs/embedded-forms-with-payments). ## Instructions [Embedded content](https://www.iorad.com/player/2046831/CivicOptimize--How-to-Add-a-Payment-Event-to-a-Form-Practice-Tutorial) 1. [Sign in to your site](/process-automation/docs/sign-in-to-your-site) 2. Navigate to **Forms** and open an existing form ![The Forms tab in the left navigation menu with a form selected on the page.](https://cdn.us.document360.io/17dc564a-8310-4f61-b929-1bd73b36e158/Images/Documentation/Select Form - PADS.png?sv=2026-02-06&spr=https&st=2026-11-12T17%3A22%3A05Z&se=2026-11-12T18%3A22%3A05Z&sr=c&sp=r&sig=G%2BUJWtKqL6TnGZ%2BGBpvu6mqBz8mb09qGzQwdp6txuPo%3D) 3. Click the **Workflow** tab ![The Workflow tab on the form builder screen.](https://cdn.us.document360.io/17dc564a-8310-4f61-b929-1bd73b36e158/Images/Documentation/Workflow Tab - PADS.png?sv=2026-02-06&spr=https&st=2026-11-12T17%3A22%3A05Z&se=2026-11-12T18%3A22%3A05Z&sr=c&sp=r&sig=G%2BUJWtKqL6TnGZ%2BGBpvu6mqBz8mb09qGzQwdp6txuPo%3D) 4. Select **Payment Events** and click **Add Payment Event**![User interface for pet license renewal highlighting payment events and adding payment event option.](https://cdn.us.document360.io/17dc564a-8310-4f61-b929-1bd73b36e158/Images/Documentation/Payment%20Event%20-%20PADS.png?sv=2026-02-06&spr=https&st=2026-11-12T17%3A22%3A05Z&se=2026-11-12T18%3A22%3A05Z&sr=c&sp=r&sig=G%2BUJWtKqL6TnGZ%2BGBpvu6mqBz8mb09qGzQwdp6txuPo%3D) 5. Choose the **Gateway** from the dropdown ![CivicPlus Pay event setup with highlighted Gateway selection and payment options.](https://cdn.us.document360.io/17dc564a-8310-4f61-b929-1bd73b36e158/Images/Documentation/Gateway%20-%20PADS.png?sv=2026-02-06&spr=https&st=2026-11-12T17%3A22%3A05Z&se=2026-11-12T18%3A22%3A05Z&sr=c&sp=r&sig=G%2BUJWtKqL6TnGZ%2BGBpvu6mqBz8mb09qGzQwdp6txuPo%3D) 6. Select how you wish to configure the **Payment Amount** - **Form Element:** The dropdown will display a list of all [Number](/process-automation/docs/form-element-types#number) and [Calculation](/process-automation/docs/calculation-element) elements from the form. ![Form element selection for payment options including total amount due and fees.](https://cdn.us.document360.io/17dc564a-8310-4f61-b929-1bd73b36e158/Images/Documentation/Form%20Element%20on%20Payment%20Event%20-%20PADS.png?sv=2026-02-06&spr=https&st=2026-11-12T17%3A22%3A05Z&se=2026-11-12T18%3A22%3A05Z&sr=c&sp=r&sig=G%2BUJWtKqL6TnGZ%2BGBpvu6mqBz8mb09qGzQwdp6txuPo%3D) - **Fixed Amount:** Enter a fixed payment total that users will be charged. ![Payment form showing fixed amount option and conditional run toggle.](https://cdn.us.document360.io/17dc564a-8310-4f61-b929-1bd73b36e158/Images/Documentation/Fixed%20Amount%20-%20PADS.png?sv=2026-02-06&spr=https&st=2026-11-12T17%3A22%3A05Z&se=2026-11-12T18%3A22%3A05Z&sr=c&sp=r&sig=G%2BUJWtKqL6TnGZ%2BGBpvu6mqBz8mb09qGzQwdp6txuPo%3D) - **Calculation:** Calculate the payment total using form elements, rounding, null values, and math expressions. Learn more about [Calculation elements](/process-automation/docs/calculation-element). ![Calculation section for payment amount including pet license and taxes fees elements.](https://cdn.us.document360.io/17dc564a-8310-4f61-b929-1bd73b36e158/Images/Documentation/Calculation%20on%20Payment%20Event%20-%20PADS.png?sv=2026-02-06&spr=https&st=2026-11-12T17%3A22%3A05Z&se=2026-11-12T18%3A22%3A05Z&sr=c&sp=r&sig=G%2BUJWtKqL6TnGZ%2BGBpvu6mqBz8mb09qGzQwdp6txuPo%3D) 7. To have the Payment Event only run under specific conditions, toggle on **Run Conditionally** and [configure the conditional logic](/process-automation/docs/conditional-logic) for the event ![Payment events section with option for Run Conditionally toggled on.](https://cdn.us.document360.io/17dc564a-8310-4f61-b929-1bd73b36e158/Images/Documentation/Payment Event, Run Conditionally Toggle - PADS.png?sv=2026-02-06&spr=https&st=2026-11-12T17%3A22%3A05Z&se=2026-11-12T18%3A22%3A05Z&sr=c&sp=r&sig=G%2BUJWtKqL6TnGZ%2BGBpvu6mqBz8mb09qGzQwdp6txuPo%3D) 8. If needed, click **Add Payment Event** to add another event ![The Add Payment Event button on the workflow tab.](https://cdn.us.document360.io/17dc564a-8310-4f61-b929-1bd73b36e158/Images/Documentation/Add Payment Event - PADS.png?sv=2026-02-06&spr=https&st=2026-11-12T17%3A22%3A05Z&se=2026-11-12T18%3A22%3A05Z&sr=c&sp=r&sig=G%2BUJWtKqL6TnGZ%2BGBpvu6mqBz8mb09qGzQwdp6txuPo%3D) > [!WARNING] > **Note**: > > The user can only be directed to one payment gateway. If you add multiple payment events to a form, ensure that conditional logic is configured so that only one payment gateway will run for a submission. 9. Click **Save**![](https://cdn.us.document360.io/17dc564a-8310-4f61-b929-1bd73b36e158/Images/Documentation/Save Workflow - PADS.png?sv=2026-02-06&spr=https&st=2026-11-12T17%3A22%3A05Z&se=2026-11-12T18%3A22%3A05Z&sr=c&sp=r&sig=G%2BUJWtKqL6TnGZ%2BGBpvu6mqBz8mb09qGzQwdp6txuPo%3D) 10. Now, when a user submits the form and meets any set conditions, they will see a payment screen where they can process the transaction ![Payment form displaying credit card and billing address fields for user input.](https://cdn.us.document360.io/17dc564a-8310-4f61-b929-1bd73b36e158/Images/Documentation/Payment%20Form%20Details%20-%20PADS.png?sv=2026-02-06&spr=https&st=2026-11-12T17%3A22%3A05Z&se=2026-11-12T18%3A22%3A05Z&sr=c&sp=r&sig=G%2BUJWtKqL6TnGZ%2BGBpvu6mqBz8mb09qGzQwdp6txuPo%3D) > [!WARNING] > **Note**: > > This screen will differ depending on the [payment gateway](/process-automation/docs/payments-integration). 11. Once their payment information has been processed, they will be able to view their **Receipt** ![Payment receipt showing transaction details and a warning about browser navigation.](https://cdn.us.document360.io/17dc564a-8310-4f61-b929-1bd73b36e158/Images/Documentation/Payment Receipt - PADS.png?sv=2026-02-06&spr=https&st=2026-11-12T17%3A22%3A05Z&se=2026-11-12T18%3A22%3A05Z&sr=c&sp=r&sig=G%2BUJWtKqL6TnGZ%2BGBpvu6mqBz8mb09qGzQwdp6txuPo%3D) ## Related - [Payments Integration](/payments-integration.md) - [Build a Form that Accepts Payments](/build-a-form-that-accepts-payments.md) - [Embedded Forms with Payments](/embedded-forms-with-payments.md) - [Send a Confirmation Email to the Submitter of a Form](/send-a-confirmation-email-to-the-submitter-of-a-form.md) - [Conditional Logic](/conditional-logic.md)