Blog / Guides / Easily collect payments using 123FormBuilder and Stripe

Easily collect payments using 123FormBuilder and Stripe

Need to collect payments online? This guide will show you how to use 123FormBuilder and Stripe to simplify the process. 123FormBuilder lets you create customized payment forms, and integrating it with Stripe allows secure and reliable transactions.

We’ll walk you through setting up payment forms, integrating Stripe, and managing transactions. Follow this guide to simplify your payment process with 123FormBuilder and Stripe. Get started today!

Setting up an account with 123FormBuilder and Stripe

To start collecting payments with 123FormBuilder and Stripe, follow these steps:

  1. Create Accounts: First, visit the 123FormBuilder website and sign up for a free account. Then, go to the Stripe website and create an account for online payments.
  2. Integrate Stripe with 123FormBuilder: After creating your accounts, link Stripe to 123FormBuilder to accept payments directly through your forms. This integration allows a smooth checkout experience for your customers.
  3. Review Pricing: Check the pricing and fees for both platforms. To create payment forms in 123FormBuilder, you need the Platinum Plan. Stripe charges a small transaction fee for each payment processed. Understanding these costs upfront will help you budget effectively.

Integrating 123FormBuilder with Stripe

  1. Log In: Access your 123FormBuilder account and go to the form builder dashboard.
  2. Select a template or Create an Order Form from scratch: Choose an existing order form template or create a new one.
  3. Customize Fields: Add fields to capture customer information like contact details, shipping addresses, and payment preferences.
  4. Add Stripe Payment processor: Navigate to the Payments section and add Stripe to the form.
  5. Click on Connect: Follow the instructions to link your Stripe account. If you don’t have one, you can create a new account. Creating a free account on Stripe allows you to get started with payment processing, and you will only pay a fee per transaction.
  6. Enable Integration: Once connected, click “Enable” to activate the Stripe integration. Your form will visibly show that the Stripe payment processor is enabled.
  7. Customize Order Summary: An order summary will appear on your form, displaying selected products, prices, quantities, and totals. You can customize it as needed by adjusting the settings in the right side panel.
  8. Update Submit Button: The Submit button changes to “Continue to payment” after enabling Stripe, with a disclaimer and Stripe logo informing respondents about proceeding to payment.
  9. Customize Action Bar: Click on the relevant area to modify the action bar, including the submit button and disclaimer. You can also adjust the settings for displaying accepted cards and payment processor logos.
  10. Configure Payment Information: You can customize the integration further by adding your store name, a brief description, and uploading a custom image URL with your company logo.
  11. Finalize Configuration: Once settings are adjusted, the “Continue to payment” button directs users to Stripe’s pop-up window, which displays payment details and confirms the transaction.

Following these steps, you can integrate Stripe or Stripe Checkout with your 123FormBuilder form, enabling secure and efficient payment collection directly on your website or landing page.

Customizing Payment Forms to Reflect Your Brand

To make your payment forms resonate with your target audience and reflect your brand’s personality and values, follow these steps:

Incorporate Brand Elements:

  • Colors and Logo: Use your brand colors and logo in the form design.
  • Imagery: Include relevant brand imagery to maintain visual consistency.

Using a Custom Thank You Page

  • Create custom thank you pages tailored to different needs. For instance, after a successful payment, you can redirect customers to a thank you page that provides further instructions, offers additional products, or shares a special discount code. This approach not only acknowledges their purchase but also enhances the overall customer experience and encourages repeat business.
Order Form Template with Product Field

Offer Multiple Payment Options:

  • Credit and Debit Cards: Ensure these standard options are available.
  • Alternative Methods: Integrate digital wallets, bank transfers, or buy now, pay later options.

Providing flexibility in payment choices caters to diverse customer preferences and can increase conversion rates.

Setting Up Pricing and Product Options in 123FormBuilder

To set up pricing and product options in 123FormBuilder, follow these steps:

  1. Create a Detailed Product Catalog:
    • Item Descriptions: Clearly outline the items or services you offer.
    • Pricing Information: Include prices and descriptions to help customers make informed purchase decisions and reduce checkout confusion.
  1. Use product field options: The product field allows for detailed customization of product offerings, including variations in size, color, and pricing tiers. Additionally, it simplifies the checkout process by providing clear and structured choices, thereby reducing confusion and potential errors during the purchasing journey. Moreover, the product field functions as a shopping cart, allowing users to add multiple items and review their selections before proceeding to payment, further streamlining the shopping experience.
    • Pricing Details: Add specific pricing information.
    • Quantities and Variations: Include options for different sizes, colors, or service packages with tiered pricing.
  2. Implement Promotional Offers:
    • Discounts and Deals: Showcase limited-time offers, coupon codes, or special bundles.
    • Incentivize Purchases: Create a sense of urgency and exclusivity to motivate customers to buy.

These marketing tactics can increase sales and build customer loyalty over time.

Testing, Launching, and Tracking Your Payment Forms

After launching your payment forms, monitoring transactions and tracking payments is crucial. With 123FormBuilder and Stripe, you can use robust reporting tools to watch real-time payment activity. Focus on key metrics like conversion rates, average order value, and revenue trends to assess the effectiveness of your payment forms.

123FormBuilder lets you set up email notifications for failed payments. When a payment fails, a dedicated email template can be triggered, allowing users to retry seamlessly. This helps retain customers and ensures smooth transactions. Additionally, automated notifications should be set up to stay informed about new payments or pending transactions.

Use Stripe’s reporting and analytics tools to gain insights into your payment data and customer behavior. Analyze transaction volumes, payment methods, and customer demographics to find growth opportunities and optimize your processes. 

Conclusion and Further Resources

With tools like 123FormBuilder and Stripe, simplifying online payment collection is straightforward. Following this guide’s steps, you can set up payment forms, integrate Stripe, customize checkouts, and effectively track payments. Explore additional features such as managing subscriptions and implementing recurring billing for enhanced capabilities. Staying updated on online payment best practices will help you stay competitive.

Explore Platinum Plan
Load more...