🎨Custom Payment Form

Don't have an Elementor Pro license? No problem. Our free form builder provides similar functionality to Elementor Pro's forms, enabling you to create professional payment forms with 10+ essential form fields and specialized payment elements.

Creating Your Payment Form

1. Create a new post using the Elementor builder

2. Navigate to the Pay Addon category in the Elements panel

3. Locate the Payment Form element

4. Drag and drop it into your canvas

Adding Form Fields

Customize your form by adding fields that suit your needs. We currently support the following field types:

• Basic Fields: Text, Email, Textarea, URL, Password, Hidden, HTML

• Numeric Fields: Decimal, Number

• Selection Fields: Radio, Select, Checkbox

• Date & Time Fields: Date, Time

Styling Your Form

Our form builder offers complete customization control. You can adjust field sizes, button dimensions, and apply your own styling to match your brand identity perfectly.

Configuring Payment Actions

Once your form structure is complete, configure how payments are processed when customers click the submit button.

Available submission methods:

• Free Plan: Checkout Redirection

• Pro Plan: Credit Card Submission, Payment Element Submission

Each submission method has its own configuration options.

Stripe Checkout Redirect Configuration

In the Payment Action, we choose 'Checkout Redirect'. Once it's been selected, the two new sections will show up: Stripe Checkout Redirect and Stripe Checkout Redirect Fields.

Setting Up Checkout Redirect

Select 'Checkout Redirect' in the Payment Action settings. This will reveal two new configuration sections:

1. Stripe Checkout Redirect

2. Stripe Checkout Redirect Fields

Stripe Checkout Redirect section

• Payment Methods: Specify which payment methods your customers can use. Select "Automatic" to inherit the payment methods activated in your Stripe Dashboard.

• Success Redirect URL: Define where customers are sent after completing their payment (your "Thank You" page). You can create a custom confirmation page using our Confirmation shortcode.

• Cancel Redirect URL: Specify the page customers see when they cancel the payment process on the Stripe checkout page.

• Billing Address: Enable this option for payment scenarios that require billing address collection on the Stripe checkout page.

• Promotion Codes: Allow customers to apply coupon codes created in your Stripe Dashboard during checkout.

• Automatic Taxes:

  Tax calculation can be complex, but it's essential for accurate payments. When enabled, taxes are calculated dynamically based on the customer's billing or shipping address. You'll need to specify the tax behavior:

  • Exclusive: Tax is added to the base amount (e.g., $10 item + tax = $10.XX total)

  • Inclusive: Tax is already included in the price (e.g., $10 item = $10 total)

• Phone number: Collect the customer's phone number as a required field on the Stripe checkout page.

• Terms of service: Display a terms of service link on the Stripe checkout page. Ensure you've created your Terms of Service content in the Stripe Dashboard beforehand.

• Shipping Address Countries: Leave empty to allow all countries, or specify which countries customers can select for shipping addresses.

• Metadata: Attach additional payment information (such as order IDs) that won't be visible to customers but can be used for internal tracking and reference.

Stripe Checkout Redirect Field Section

This section handles payment configuration by mapping pricing, customer, and product-related fields.

• Customer email field: Enter the form field shortcode. When specified, this email will be pre-filled on the Stripe checkout page.

• Payment Type: Choose from three options:

  • One-time: For standalone purchases

  • Subscription: For recurring subscriptions

  • Flex: Dynamically collects either one-time or subscription payments based on conditional logic

  When using Flex payment type, you can set conditions (for example, if a checkbox with ID "sub-checked" is selected, the payment will be processed as a subscription using your subscription settings).

One-time payment setting

Same as https://docs.payaddons.com/elements/checkout-credit-card-form-pro#one-time-payment-settings

Subscription payment setting

Same as https://docs.payaddons.com/elements/checkout-credit-card-form-pro#subscription-payment-settings

Testing Your Form

After configuring your form and submission settings, test the complete payment flow. When everything is set up correctly, customers will be redirected to the Stripe Checkout page displaying all the features you've configured:

• Payment methods

• Tax calculations

• Promotion code field

• Shipping address or phone number fields

• Terms of service link

• etc.

Monitoring Transactions

After completing transactions, view all form submissions in the transaction list page. This gives you a comprehensive overview of all payment activities.