How to create a tshirt order form in WordPress

How to Create a T-Shirt Order Form in WordPress [Easy Steps]

Editorial Note: We may earn a commission when you visit links on our website.

Do you want to create a shirt order form for your site in a few easy steps?

A well-designed order streamlines the checkout process for your customers, making it more likely for them to convert.

Create Your T-Shirt Order Form Now

In this guide, we’ll show you how to create a custom t-shirt order to boost your online sales.

Why Use a Shirt Order Form in WordPress?

Efficiency is paramount when it comes to managing t-shirt orders. By utilizing a well-designed t-shirt order form on your WordPress site, you can:

  • Simplify the Order Process: A dedicated t-shirt order form eliminates the need for customers to navigate through multiple pages or contact you separately, streamlining the ordering process.
  • Capture Essential Customer Details: The form allows you to collect crucial customer information, such as name, email, and phone number, ensuring accurate order records and efficient communication.
  • Specify T-Shirt Preferences: With fields for size, color, and quantity, the form enables customers to specify their preferences accurately, minimizing errors and ensuring customer satisfaction.
  • Accommodate Customization Requests: Additional fields can be included to cater to customization options (e.g., logo placement) or special requests, providing a personalized experience for customers.
  • Facilitate Secure Payment Processing: Integration with payment gateways like Stripe ensures secure payment processing, enabling customers to complete their transactions seamlessly.

Now that you’re aware of the numerous benefits of creating a custom t-shirt order form, let’s dive into the steps of creating one for your online business.

How to Create a T-Shirt Order Form in WordPress

To create a t-shirt order form, you can rely on the premade templates and advanced features of WPForms. Follow the steps below to get started:

1. Installing and Activating WPForms

WPForms is a beginner-friendly form builder plugin for WordPress that lets you create order forms for any kind of business.

The best part is that you can use the free WPForms Lite plugin to integrate your order forms with Stripe, making it one of the only few order form plugins that are free.

However, credit card processing always attracts a small fee. You’ll be charged a 3% fee per transaction on top of Stripe’s regular fees.

Stripe fee per transaction message WPForms Lite

If you want to remove the additional fees, you can upgrade to WPForms Pro to save costs in the long run and access more advanced features.

For instance, WPForms Pro unlocks the ready-made t-shirt order form template to speed up your form creation process. Plus, it gives you access to the Stripe Pro addon with extra features like conditional logic.

We’re going to use WPForms Pro for this tutorial to build a custom t-shirt form in the fastest way possible.

The WPForms homepage

Once you’ve chosen your WPForms version and are ready to proceed, download and activate the plugin on your WordPress site!

After it’s activated, you can easily get started with creating a personalized and visually appealing t-shirt form by following the steps below.

2. Connect WPForms with Stripe

After installing WPForms, the next step is to install the Stripe Pro addon. Go to WPForms WPForms » Addons from the WordPress admin menu.

WPForms addons screen

Now, search for the Stripe Pro Addon by typing its name in the Search Addons field. Next, click on Install Addon.

Install the Stripe addon WPForms

After the addon has been installed, press the same button again to Activate it.

Now, navigate to WPForms » Settings and go to the Payments tab to configure your Stripe payment settings.

WPForms payment settings

If you want to change the currency used on your site, select the desired currency from the drop-down menu before proceeding.

Choose currency from payment settings

Once you’re ready to integrate Stripe payments into your platform, scroll down to the Stripe section and click the blue Connect with Stripe button.

Connect with Stripe

After that, you will need to enter your Stripe login details in order to connect your Stripe account with WPForms. If you don’t have a Stripe account, now might be a good time to create one.

Stripe Connect wizard

After following all the steps in the Stripe Connect wizard, you’ll be redirected back to your site’s admin area. Here, you should see a green checkmark next to Connection Status.

Stripe connection status live

If you’re using WPForms Lite, you won’t have access to the Stripe Pro addon. In this case, you can skip the addon installation step and directly go to the Payments tab to connect your Stripe account.

For new WPForms users, Stripe is set to the Payment Elements mode by default which gives customers multiple payment options including Apple Pay, Google Pay, and more. If you previously used the Card Elements mode and are updating to WPForms 1.8.2, you’ll have the option to switch to Payment Elements.

3. Utilizing the T-Shirt Order Form Template

It’s time to build your t-shirt order form! Navigate to the WPForms tab from your WordPress dashboard and click on the Add New button.

Add new form WPForms

Name your form and then use the search box to find the t-shirt order form template. Once it shows up, click on the Use Template button.

Use the tshirt order form template

You may notice that this template is built with fields that capture the customer’s t-shirt preferences, name, and contact details.

Tshirt order form template all fields

If required, you can use WPForms’ intuitive form builder to easily add, modify, and arrange fields to tailor the form to your liking.

4. Customizing Your Shirt Order Form Fields

The t-shirt order form includes all the essential fields you’ll need to sell your awesome t-shirts.

But in order to collect credit card payments directly via this form, you’ll need to ensure your form includes the appropriate payment fields as well.

For instance, we can add the Single Item payment field to display the t-shirt price to be charged when the customer completes the form.

Drag the Single Item payment field

Click on the Single Item field after inserting it into your form to open its Field Options on the left-hand pane.

Single item field options

Now, we can edit the name and the price of the Single Item field to match the product we’re selling.  Since our product is a t-shirt, we’ll enter the appropriate values in the Label and Item Price field options.

Label and item price

Excellent!

Now, we can go ahead and add the Stripe Credit Card field.

Add the Stripe Credit Card field to your form

This field will collect the credit card information from the customer and charge the exact price that you set above in the Single Item field.

But keep in mind, we still have to enable Stripe payments before this field can process payments (we’ll be doing this in the next step).

Additionally, you can use the Paragraph Text field to cater to special requests and offer a more comprehensive ordering experience.

Special requests field for tshirt order form

You can even offer t-shirt discounts using the Coupons field. So if you’re trying to boost orders for the upcoming sales in your promotional calendar, it may be a good idea to start thinking about creating special coupon codes for your customers.

Before moving on, make sure to hit the Save button to avoid losing any changes.

Save the Form

We’re almost there! In the next step, we’ll enable Stripe payments so that the Credit Card field can start processing transactions.

5. Configure Stripe Payments in Your Form

After adding all the required fields to your t-shirt order form, it’s time to enable your Stripe payments integration. You can easily do that by going to Payments » Stripe in your form builder.

Then, click on the Enable Stripe Payments toggle button on the right panel.

Enable Stripe payments

After you’ve enabled Stripe payments, you’ll see additional options appear.

Stripe payment options

Here’s what each of these options means:

  • Payment Description: The description you add here will appear in the customers’ credit card statements, so make sure to make this easily recognizable.
  • Stripe Payment Receipt: Select the Email field in your form to let Stripe send payment receipts to the customer’s email address.
  • Customer Email: Choose the Email field which contains the customer’s email address. This can be used to track payments from your Stripe account dashboard.

After you’re done with the settings, press Save again and proceed to the next step.

6. Enabling Notifications and Confirmations

To ensure you’re instantly aware of any new sales, it’s massively helpful to configure your notification settings. Navigate to Settings and click on Notifications.

Form notification settings

While admin notifications are enabled by default, you can edit the subject, message, and add or change recipient email addresses for these notifications.

Configure email notifications for tshirt form

Now, click on Confirmations in the Settings menu to configure the message customers receive upon successful submission of the t-shirt order form.

Form confirmation settings

WPForms offers different Confirmation Type options, such as a message, show page, or redirect. Select one that best suits your t-shirt business.

Configure confirmations for tshirt form

Once you have configured your email notification and confirmation settings, hit the save button again to save your current progress.

7. Embedding and Publishing the T-Shirt Order Form

Now that you’ve built your shirt order form using the template, you can add it to your WordPress website and further style it using the block editor.

Create a new page/post or simply update an existing one. After that, click on the Add Block button and select the WPForms icon.

Add form widget WPForms

Next, select your custom t-shirt order form from the dropdown menu in the WPForms widget to attach it to your page/post.

Selecting your t-shirt-order form in the WPForms block

If you’re satisfied with the way your form looks, hit the Update or Publish button, and your form will go live.

Publish the tshirt order form

Now all you need to do is test the embedded form after publishing to make sure it works as expected to avoid any problems.

t-shirt form published

Perfect! You’re all set to start selling your t-shirts and making good money.

But how are you going to track your payments? That’s easy to do with WPForms too!

8. Tracking Your T-Shirt Orders Payments Summary

Another feature available to both WPForms Lite and Pro users is the ability to track all payments for t-shirt orders using the new Payments screen.

You can view your entire payments summary for transactions made via WPForms by going to WPForms » Payments from your WordPress dashboard.

Track your tshirt sales with the WPForms Payment feature

If you scroll down further, you’ll see a table of all individual transactions that have been made.

WPForms payment table

You can also click any individual transaction to open further details of that specific entry.

This feature brings convenience and organization to your business by providing a summary of all the payments received through your t-shirt order forms.

And there you have it! You can now build a full-fledged custom t-shirt order from in WordPress and boost your online sales.

Next, Make a Custom WordPress Login Page

It’s good practice to use a custom login page in WordPress that has your company’s branding. The generic WordPress login form is used by tons of websites, so you need to customize it in order to stand out and elevate your branding.

Also, if you’d like to automate repetitive WordPress tasks, we recommend checking out our favorite ChatGPT plugins for WordPress. Using these tools, you can leverage ChatGPT to boost your productivity in running your WordPress site.

Create Your T-Shirt Order Form Now

Ready to build your t-shirt order form? Get started today with the easiest WordPress form builder plugin. WPForms Pro includes lots of free templates and offers a 14-day money-back guarantee.

If this article helped you out, please follow us on Facebook and Twitter for more free WordPress tutorials and guides.

Using WordPress and want to get WPForms for free?

Enter the URL to your WordPress website to install.

Add a Comment

We're glad you have chosen to leave a comment. Please keep in mind that all comments are moderated according to our privacy policy, and all links are nofollow. Do NOT use keywords in the name field. Let's have a personal and meaningful conversation.

This form is protected by reCAPTCHA and the Google Privacy Policy and Terms of Service apply.