<!-- canonical: https://docs.costplus.io/docs/plugins/woocommerce -->

> Integrate Cost+ with your WooCommerce store using the official WordPress plugin
<div style={{background: 'white', borderRadius: '8px', padding: '1rem', display: 'inline-block', marginBottom: '1rem'}}>
  <img src="/images/logos/woocommerce.png" alt="WooCommerce" style={{height: '48px', width: 'auto'}} />
</div>

Integrate Cost+ as a payment method in your WooCommerce store. The official **Cost+ Payments** WordPress plugin provides seamless integration with your existing WooCommerce checkout.

## Prerequisites

- Active Cost+ merchant account
- WordPress site with WooCommerce installed
- Admin access to your WordPress dashboard

## 1. Install the Cost+ Plugin

Log in to your WordPress admin panel, then navigate to **Plugins** > **Add New**.

In the search bar, type **"Cost+ Payments"** (or "NoPayn Payments"). Find the plugin in the search results, click **Install Now**, then click **Activate**.

![Search for Cost+ Payments in WordPress plugin directory](/images/plugins/woocommerce/step1.png)

> [!NOTE]
> Alternatively, you can download the plugin directly from the [WordPress Plugin Repository](https://wordpress.org/plugins/nopayn/) and upload it manually.

## 2. Configure Cost+ Settings

In your WordPress dashboard, go to **WooCommerce** > **Settings**.

![Navigate to WooCommerce Settings](/images/plugins/woocommerce/step2a.png)

Click on the **Payments** tab to view available payment methods.

![WooCommerce Payments tab](/images/plugins/woocommerce/step2b.png)

Locate **Cost+ - Settings** in the list, toggle the switch to enable it, and click the **Manage/Finish setup** button.

![Enable Cost+ Payments and click Manage](/images/plugins/woocommerce/step2c.png)

## 3. Enter API Credentials

Log into the [Merchant Portal](https://dashboard.costplus.io/) and navigate to **Websites**, then click on the website you want to connect. Click on **Integration** where you will find your API key.

![Cost+ Merchant Portal showing API key](/images/plugins/shared/merchant-portal-api-key.png)

In the Cost+ plugin settings, enter the API key in the **API key** field.

![Cost+ plugin settings with API key field](/images/plugins/woocommerce/step3.png)

## 4. Customize Payment Settings

By default, **all payment methods operate in Autocapture mode**, meaning payments are captured immediately after authorization.

For **Cost+ Credit/Debit Cards**, an additional setting -- **Capture on Complete** -- is available directly in its settings panel. Checking this box will delay capture until an order is marked as complete in WooCommerce.

![Capture on Complete checkbox in Credit/Debit Cards settings](/images/plugins/woocommerce/step4.png)

> [!TIP]
> This flexible option allows you to align payment flows with your fulfillment process. Use "Capture on Complete" if you want to only charge customers when their order ships.

## 5. Save Changes and Test

After configuring your preferences, click **Save changes**.

![Save changes button](/images/plugins/woocommerce/step5.png)

Run a few test payments to ensure everything works smoothly. We recommend testing both successful and failed transactions to confirm behavior across scenarios.

## Support

Need help? Reach out to our support team at **support@costplus.io**.