How to Accept Credit Card Payments Online in WordPress

Do you want to accept credit card payments on your WordPress site?

Although digital wallets are now the leading e-commerce payment method among American consumers, credit cards and debit cards are still dominant payment methods. In fact, credit cards accounted for 31% of all online transactions in 2022.

Recent studies show that people who are planning to use a credit card for online purchases are willing to spend more and check out with higher-valued items.

In this article, we’ll explain how to easily accept credit card payments on your WordPress site.

Accepting Credit Card Payments in WordPress

Credit cards are issued by banks and allow customers to borrow money with a promise to pay it back within a grace period to avoid extra fees. Consumers can accrue a continuing balance of debt, which is subject to being charged interest.

By accepting credit card payments, you can expect an increase in your average order values.

The easiest and most secure way to begin accepting credit card payments on your site is to use WP Simple Pay, the #1 Stripe payments plugin for WordPress. It allows you to create payment forms for products, services, registrations, fundraisers, and more in minutes with zero coding. One of the best parts about the standalone plugin is that it doesn’t require you to set up a shopping cart on your site or install additional plugins.

Aside from credit card payments, you can also offer your customers their preferred payment methods, including Apple Pay / Google Pay / Microsoft Pay, Buy Now, Pay Later services, ACH Direct Debit, Alipay, Cash App Pay, and more.

How to Easily Accept Credit Card Payments

Let’s get started!

For the purpose of this tutorial, we’re going to create a credit card payment form like the one below. You’ll notice that we’re also going to show you how to recover the 3% Stripe credit card processing fee so that you can collect the full price amount.

Step 1: Install and Activate WP Simple Pay in WordPress

The very first thing you’ll need to do to begin accepting credit card payments on your site is install and activate the plugin in WordPress.

First, head over to the pricing page and select a plan that best suits your needs. Then, install and activate the WP Simple Pay plugin on your site.

First time installing a plugin in WordPress? Don’t worry! We’ve created a detailed guide on how to install WP Simple Pay.

Once you’ve finished activating the plugin, you’ll be directed to the setup wizard. The setup wizard allows you to set up a Stripe account if you don’t already have one and connect it to your site without having to enter your API keys manually.

In the setup wizard, go ahead and click on the Let’s Get Started button.

Step 2: Connect WordPress to Stripe  

To connect your WordPress site to Stripe, click Connect with Stripe.

Next up, enter the email address you use for your Stripe account and connect it with your site. If you don’t have a Stripe account, you can easily create one by entering your email address and completing registration.

Upon completing this process, you’ll be shown a success page that says Setup Complete. Next, to create a payment form, click on the Create a Payment Form button.

Step 3: Create a Credit Card Payment Form

So far, you’ve installed WP Simple Pay and connected your Stripe account to your site.

To start accepting credit card payments, let’s create a payment form.

You should have been automatically directed to the payment form templates page, where you can choose from tons of different options.

Let’s select the basic Payment Form template to proceed. If you’re not on this page yet, you can navigate to WP Simple Pay » Add New to start creating a payment form.

In the General tab of your payment form, go ahead and enter the Title and Description using the text fields provided.

By default, On-site payment form is chosen as your payment Type. You can configure your form to open in an overlay modal by checking the box. Alternatively, instead of displaying the form on your site, you have the option to host it on an Off-site Stripe Checkout page.

To ensure that your customers check out directly on your site, leave the Type set to On-site payment form.

Next, click on the Payment tab. Here is where you’ll need to enter your pricing options and pricing amount.

You’ll notice the list of available payment method options. This payment form template already has Card selected for you.

To remove the 3% Stripe credit card processing fee, simply click on the Configure icon and enter the percentage amount under Fee Recovery. Be sure to check the box next to Add an additional fee to payments made witih this payment method.

When you’ve finished, be sure to click on the Update button. Then, click on the Form Fields tab.

You’ll notice that most of the needed form fields have already been created for you. However, we’re going to add the following fields from the dropdown menu: Shipping Address, Amount Breakdown, and a Text field.

To ensure that you collect the correct shipping address, click on the Address field and select the Shipping option.

To add the Text Field, select Text from the dropdown menu. Then, click on the Add field button.

Next, click on Text from the list of form fields and enter your label. Be sure to check the boxes for Required and Multi-line.

Finally, it’s a great idea to add the Amount Breakdown field and place it just above the checkout button on your form to be transparent with your customers about what they’re being charged for.

Once you’ve finished adding the Amount Breakdown field and dragging it down the list, you’re ready to publish the form on your site. Be sure to click on Publish.

Your form fields should now look like this:

Step 4: Publish Your Form on a Page or Post

Now that your payment form is ready to accept credit card payments, it’s time to embed your form on your site.

To do this, simply go to the post or page that you want your form on. Then, click on the + icon to bring up the WP Simple Pay block.

Choose the form you just created from the dropdown menu and then click Publish or Update once your form has finished loading.

There you have it! We hope this article has helped you create a credit card payment form for your WordPress site.

If you liked this article, you might also want to check out our guide on how to accept ACH Direct Debit Payments in WordPress.

What are you waiting for? Get started with WP Simple Pay today!

To read more articles like this, follow us on Facebook and Twitter.