# How to Add Payment Item Fields in WordPress with Paymattic? > Paymattic comes with a wide range of Donation & Product Fields. You can create donation forms with Paymattic including multiple Payment Item options. Use the Payment Item field in Paymattic if you want your users to select a single item from a list of multiple items. Follow this step-by-step guide to know about Payment Item configuration in Paymattic. - URL: https://paymattic.com/docs/how-to-add-payment-item-fields-in-wordpress-with-paymattic/ - Markdown: https://paymattic.com/docs/how-to-add-payment-item-fields-in-wordpress-with-paymattic/index.md - Modified: 2024-10-16 --- # How can we help you? Popular Search subscriptionstriperecurringtheuser View Categories In [Paymattic](/), the **Payment Item** field allows you to showcase single or multiple Items (Products) options in your form, allowing users to select and buy their desired Item/s that exist in the form. This article will guide you on how to embed the Payment Item field to the WordPress Site through Paymattic. ## Adding Payment Item Field # To learn how to add the Payment Item to the Paymattic 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://docs.google.com/document/d/1tg7v6UFVUGX1UNwyztziuV4Al9srPSOnjO2aSiq0BDI/edit) or [Create a Form using Templates](/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/1.-Open-desired-form-scaled.webp) Once you open the **Editor** page, add the Payment Item field by typing the**“ / ”**or clicking the **Plus Icon** placed at the bottom. We always suggest you keep the [**Name**](/docs/how-to-use-general-form-input-fields-in-wordpress-with-paymattic/#5-toc-title) and [**Email**](/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/2.-Type-or-click-icon.webp) For example, I choose the **Pluc Icon**option to select the **Payment Item** field under the **Donation & Product Fields** section from the**Choose Form Field**page. Also, don’t forget to add a **Payment Method** field for collecting payments. To learn how to add a payment method field, [click here](/docs/how-to-use-the-payment-method-fields-section/). ![](https://paymattic.com/wp-content/uploads/2022/06/3.-Adding-the-Payment-Item-field.webp) ## Editing/Customizing the Field # You can see the **Payment Item** field is added to the form. You can edit their field name and settings. To learn more about form editing, read this [Documentation](https://docs.google.com/document/d/1F_2BO_9SBL_sfEkgdle8psLyALeRU80qynEFqcuDCRg/edit#heading=h.x6au2mtvg965)*.* Specifically, to edit the **Payment Item**field according to your needs, click the**Settings Icon** from the right-side corner. ![](https://paymattic.com/wp-content/uploads/2022/06/4.-Settings-Icon.webp) Now, a pop-up page will appear with various settings options for customizing the field. ### General Settings # Under this tab, you will find all the General settings for customizing the field according to your needs. ![](https://paymattic.com/wp-content/uploads/2022/06/5.-General-Settings.webp) **All the Settings under the General tab mentioned above are briefly explained below –** #### A. Required # Enable this option to make this field mandatory for users to fill in for a successful submission. #### B. 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**. #### C. Horizontal Items # Enable this option if you want to showcase your Product/s Horizontally in one line. Otherwise, your Products will be shown vertically one after one. #### D. Payment Selection Option # Here, you will get **three different options**to add item/s and collect payments through the added item/s. These are: 1. Single Item 2. Choose one from Multiple Item 3. Choose Multiple Items ##### 1. Single Item # Select this payment option if you want to offer one Item/Product to your user for collecting payments. - **One Time Payment Amount**: You can set the amount of one-time payment according to your needs. - **Show Item Title and Price**: If you want to add an item title & price, you can enable this option. Once you are done, click the **Update** button to save all your settings and changes. ![](https://paymattic.com/wp-content/uploads/2022/06/6.-General-Settings-of-Single-Item.webp) ##### 2. Choose One from Multiple Item # Select this payment option if you want to offer multiple items to your users for choosing one item when making a payment. - **Pricing Details:** Here, you can create a list of items with fixed prices and add product images using the **Plus Icon**. You can also rearrange the product rows with the **Drag-and-drop** feature. To add more items, click the **+Add More** button and to delete any item, click the **Trash** icon. - **Display Type**: With this option, you can set whether you want to set the item selection type as a **Radio** button or **Select** (dropdown list). - **Paymattic Template**: With this option, you can choose the template for showcasing your product in your form. Once you are done, click the **Update** button to save all your settings and changes. ![](https://paymattic.com/wp-content/uploads/2022/06/7.-Choose-One-from-Multiple-Item.webp) ##### 3. Choose Multiple Items # Select this payment option if you want to offer multiple items to your users. - **Pricing Details:** Here, you can create a list of items with fixed prices and add product images using the **Plus Icon**. You can also rearrange the product rows with the **Drag-and-drop** feature. To add more items, click the **+Add More** button and to delete any item, click the **Trash** icon. - **Paymattic Template**: With this option, you can choose the template for showcasing your product in your form. Once you are done, click the **Update** button to save all your settings and changes. ![](https://paymattic.com/wp-content/uploads/2022/06/8.-Choose-Multiple-Forms.webp) ### Advanced Settings # Once you complete the General settings, go to the **Advanced** tab, and you will find some advanced settings for your Payment Item field. These are: - **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](/docs/how-to-use-conditional-logic-in-form-fields-with-paymattic/). - **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](/docs/how-to-create-custom-css-js-in-wordpress-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/9.-Advanced-Settings.webp) ## Embedding Form into Frontend # Here, you can see the **Payment Item** field and other necessaryfields are added to the form. 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/10.-Save-Preview-and-Shortcode.webp) ## Preview of Payment Item field # Here is the preview of the **Payment Item**fields in a Form. ![](https://paymattic.com/wp-content/uploads/2022/06/11.-Preview-of-Payment-Item-field.webp) This way you can easily add the **Payment 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. ##### What are your Feelings #### Share This Article : - [![Facebook](https://paymattic.com/wp-content/plugins/betterdocs/assets/static/images/social/facebook.svg?v=4.8.1)](https://www.facebook.com/sharer/sharer.php?u=https://paymattic.com/docs/how-to-add-payment-item-fields-in-wordpress-with-paymattic/) - [![X](https://paymattic.com/wp-content/plugins/betterdocs/assets/static/images/social/twitter.svg?v=4.8.1)](https://twitter.com/intent/tweet?url=https://paymattic.com/docs/how-to-add-payment-item-fields-in-wordpress-with-paymattic/) - [![LinkedIn](https://paymattic.com/wp-content/plugins/betterdocs/assets/static/images/social/linkedin.svg?v=4.8.1)](https://www.linkedin.com/shareArticle?mini=true&url=https://paymattic.com/docs/how-to-add-payment-item-fields-in-wordpress-with-paymattic/) - [![Pinterest](https://paymattic.com/wp-content/plugins/betterdocs/assets/static/images/social/pinterest.svg?v=4.8.1)](https://pinterest.com/pin/create/button/?url=https://paymattic.com/docs/how-to-add-payment-item-fields-in-wordpress-with-paymattic/) Still stuck? How can we help? ## How can we help? Updated on October 16, 2024 [How to Add Currency Switcher in WordPress Form?](/docs/add-currency-switcher-in-wordpress-form/)[How to Add Subscription Payment Item Fields in Paymattic?](/docs/how-to-add-susbcription-payment-item-fields-in-paymattic/) Powered by [BetterDocs](https://betterdocs.co)