# How to Integrate Retool with WooCommerce

- Tool: Retool
- Difficulty: Intermediate
- Time required: 20 minutes
- Last updated: April 2026

## TL;DR

Connect Retool to WooCommerce using a REST API Resource with your WooCommerce consumer key and consumer secret for Basic Auth. Query the WooCommerce REST API v3 to manage orders, products, customers, and inventory, building order fulfillment dashboards that are significantly faster than WooCommerce's native admin interface.

## Build a WooCommerce Order Management Panel in Retool

WooCommerce's built-in admin interface becomes a bottleneck as order volume grows. Filtering orders, updating statuses, and processing refunds requires multiple page loads and clicks. Retool solves this by connecting directly to WooCommerce's REST API, letting operations teams view and act on orders from a single, fast, customizable dashboard.

WooCommerce's REST API v3 provides comprehensive endpoints for every store entity: orders, products, customers, coupons, inventory, reports, and settings. Authentication uses consumer keys — a pair of key and secret credentials generated per WordPress user in WooCommerce's API settings. These credentials are sent as Basic Auth with every request. Because Retool proxies all requests through its server-side layer, consumer secrets are never exposed to end users.

Typical Retool apps built on WooCommerce include: order management panels where warehouse teams can bulk-update fulfillment statuses, inventory dashboards showing low-stock products with one-click reorder workflows, customer lookup tools for support teams that show order history and lifetime value, and refund processing panels that reduce the steps required to issue a partial or full refund.

## Before you start

- A WordPress site with WooCommerce installed and active
- WooCommerce REST API enabled (WooCommerce → Settings → Advanced → REST API)
- A Retool account with permission to create Resources
- A WooCommerce consumer key and secret with Read/Write permissions
- Your WooCommerce store URL (must be HTTPS for production API access)

## Step-by-step guide

### 1. Generate WooCommerce REST API consumer keys

In your WordPress admin panel, navigate to WooCommerce → Settings → Advanced → REST API. This tab lists all existing API keys and the button to create new ones. Click 'Add key'. Fill in the Description field (e.g., 'Retool Integration'), select the User account the key should be associated with (use a dedicated admin account for production integrations), and set Permissions to 'Read/Write' — Read-only is sufficient if you only need to view data, but Read/Write is required for updating orders or processing refunds. Click 'Generate API key'. WooCommerce displays the Consumer Key (starting with 'ck_') and Consumer Secret (starting with 'cs_') exactly once. Copy both values immediately and store them securely — the Consumer Secret will not be shown again. Treat these credentials like a username and password combination.

**Expected result:** You have a WooCommerce Consumer Key (ck_...) and Consumer Secret (cs_...) copied and ready to configure in Retool.

### 2. Create a REST API Resource in Retool

In Retool, go to Resources → Create New → REST API. Set the Base URL to your WooCommerce store URL followed by '/wp-json/wc/v3' — for example, 'https://yourstore.com/wp-json/wc/v3'. This path prefix is the WooCommerce REST API v3 root; all endpoints will be appended to this base. Under the Authentication section, select 'Basic Auth' from the dropdown. Enter the Consumer Key in the Username field and the Consumer Secret in the Password field. Do not add the credentials as URL parameters — Basic Auth headers are more secure and less likely to appear in server logs. Add a default header 'Content-Type' with value 'application/json'. Click 'Test connection' — Retool will attempt to fetch the API root. If your store requires HTTPS (most production WooCommerce stores do), ensure the Base URL uses https://. Name the resource 'WooCommerce' and save it.

```
{
  "Base URL": "https://yourstore.com/wp-json/wc/v3",
  "Authentication": "Basic Auth",
  "Username": "{{ retoolContext.configVars.WC_CONSUMER_KEY }}",
  "Password": "{{ retoolContext.configVars.WC_CONSUMER_SECRET }}",
  "Headers": {
    "Content-Type": "application/json"
  }
}
```

**Expected result:** The WooCommerce REST API Resource is saved and the test connection returns a 200 OK response with the API root schema.

### 3. Query orders with filtering and pagination

Create a new query in your Retool app using the WooCommerce resource. Set the HTTP method to GET and the path to '/orders'. WooCommerce's orders endpoint supports extensive query parameters for filtering: 'status' filters by order status (processing, completed, on-hold, pending, cancelled, refunded), 'after' and 'before' accept ISO 8601 date strings for date filtering, 'search' searches customer name and email, 'per_page' sets page size (max 100), and 'page' handles pagination. Add query parameters by clicking 'Add query param' in the query editor. Bind the status parameter to a Select component value for dynamic filtering. The response is a JSON array of order objects — each order includes id, status, date_created, total, billing (customer info), line_items (products ordered), and shipping details. Run the query and verify the response structure before building the UI.

```
// Query configuration
GET /orders

// Query parameters:
// status: {{ statusFilter.value || 'processing' }}
// per_page: {{ pagination.pageSize || 50 }}
// page: {{ pagination.page || 1 }}
// after: {{ dateRange.start ? new Date(dateRange.start).toISOString() : '' }}
// before: {{ dateRange.end ? new Date(dateRange.end).toISOString() : '' }}
// search: {{ searchInput.value || '' }}
```

**Expected result:** The query returns an array of order objects. The first order in the array is visible in Retool's query output panel, showing order ID, status, customer billing info, and line items.

### 4. Transform order data for the Table component

WooCommerce orders return nested objects — billing address, shipping address, and line_items are all arrays or objects within each order. To display cleanly in a Retool Table, add a transformer to the query. The transformer should map over orders and extract the key fields into a flat object. The 'line_items' array contains an item name, quantity, and total for each product in the order. Use Array.join to concatenate multiple product names into a single column value. The billing object contains first_name, last_name, email, and phone. Format the total as a currency string and parse the date to a readable format. This transformer runs on every query execution and makes the Table component binding trivial.

```
// Transformer: flatten WooCommerce order response
const orders = data || [];

return orders.map(order => {
  const itemNames = (order.line_items || []).map(item =>
    `${item.name} x${item.quantity}`
  ).join(', ');

  return {
    id: order.id,
    order_number: `#${order.number || order.id}`,
    status: order.status,
    customer_name: `${order.billing.first_name} ${order.billing.last_name}`,
    customer_email: order.billing.email,
    items: itemNames,
    item_count: order.line_items?.length || 0,
    total: `$${parseFloat(order.total).toFixed(2)}`,
    payment_method: order.payment_method_title || '',
    date: new Date(order.date_created).toLocaleDateString(),
    shipping_address: `${order.shipping.address_1}, ${order.shipping.city}, ${order.shipping.state}`
  };
});
```

**Expected result:** The transformer output is a flat array where each order is a single object with readable columns. The Table component bound to {{ getOrders.data }} displays all orders clearly.

### 5. Update order statuses and build action buttons

Create a second query for updating order status. Use the WooCommerce resource with HTTP method PUT and path '/orders/{{ table1.selectedRow.id }}'. Set the request body type to JSON and include only the fields you want to update — in this case, an object with a 'status' key set to the new status value. Create a Select component with options for 'processing', 'completed', 'on-hold', and 'cancelled'. Bind the update query's status parameter to this select component's value. Add a Button component labeled 'Update Status'. Set the button's onClick event handler to run the update query, then on success, trigger the getOrders query to refresh the table and show a success notification. Disable the button when no row is selected by setting its Disabled property to {{ !table1.selectedRow }}.

```
// PUT /orders/{{ table1.selectedRow.id }}
// Request body:
{
  "status": "{{ statusSelect.value }}"
}
```

**Expected result:** Selecting an order in the table, choosing a new status from the dropdown, and clicking 'Update Status' successfully updates the order in WooCommerce and refreshes the table with the new status.

### 6. Add product inventory management

Create a third query to manage product inventory. Use GET method with path '/products' and query parameters for filtering: 'stock_status' can be 'instock', 'outofstock', or 'onbackorder'; 'type' filters to simple vs variable products. For inventory updates, create a PUT query targeting '/products/{{ productTable.selectedRow.id }}' with a JSON body containing 'stock_quantity' bound to an input field. Build a second tab or section in your Retool app for inventory management. The products endpoint returns SKU, name, stock_quantity, stock_status, and price fields. Add a Number Input component for direct quantity editing. For complex integrations involving product variations, custom order workflows, or multi-warehouse inventory syncing across Retool and WooCommerce, RapidDev's team can help architect a comprehensive solution.

```
// GET /products with low stock filter
// Query parameters:
// per_page: 100
// stock_status: instock
// orderby: stock_quantity
// order: asc

// Transformer: format product data
const products = data || [];
return products.map(product => ({
  id: product.id,
  sku: product.sku || 'N/A',
  name: product.name,
  stock_quantity: product.stock_quantity,
  stock_status: product.stock_status,
  price: `$${product.price}`,
  low_stock: product.stock_quantity !== null && product.stock_quantity < 10
}));
```

**Expected result:** The inventory tab shows all products sorted by stock quantity ascending, with low-stock items visually highlighted, and an editable quantity field that saves changes back to WooCommerce.

## Best practices

- Store WooCommerce consumer key and secret in Retool configuration variables marked as secrets — never paste them directly into query code
- Create a dedicated WordPress user for the Retool integration with the minimum role required (Shop Manager or a custom role) rather than using a full Administrator account
- Use HTTPS exclusively for your WooCommerce store URL in the Retool resource — HTTP does not reliably support REST API authentication and exposes credentials in transit
- Implement server-side pagination using WooCommerce's 'page' and 'per_page' parameters rather than loading all orders at once — large stores may have tens of thousands of orders
- Add confirmation dialogs before running order status updates or refund mutations, since WooCommerce may trigger customer email notifications on certain status transitions
- Filter orders by specific statuses in your queries rather than fetching all orders and filtering client-side — WooCommerce query filtering is much faster than loading all records
- Use WooCommerce order notes (POST /orders/{id}/notes) to log when and why a status change was made from Retool, creating an audit trail visible in WooCommerce admin

## Use cases

### Build an order fulfillment and status management dashboard

Display all WooCommerce orders filtered by status (processing, on-hold, pending) in a Retool Table. Let warehouse staff update order statuses to 'completed' or 'shipped' with a single button click. Add filters for date range, customer name, and shipping method to quickly find specific orders.

Prompt example:

```
Build a Retool order dashboard that shows all WooCommerce orders with status 'processing', sorted by date, with columns for order ID, customer name, total, items, and shipping address. Include a button to mark selected orders as 'completed'.
```

### Create an inventory and low-stock management panel

Query WooCommerce products filtered by stock status to identify low-stock and out-of-stock items. Build a Retool app where product managers can update stock quantities, set backorder policies, and view stock movement reports without accessing WordPress admin.

Prompt example:

```
Create a Retool inventory dashboard showing all WooCommerce products with stock_status of 'outofstock' or stock_quantity below 10, with an editable quantity field and a save button that updates the product stock via the API.
```

### Build a customer support and refund processing tool

Build a customer lookup panel where support agents can search by email or order ID to view a customer's complete order history, lifetime value, and recent activity. Include a refund panel that lets agents issue partial or full refunds directly from Retool, reducing the need to navigate WooCommerce admin for every refund request.

Prompt example:

```
Build a Retool customer support panel with a search box that queries WooCommerce customers by email, shows their order history table, total spend, and a refund form for the selected order with amount and reason fields.
```

## Troubleshooting

### API returns 401 Unauthorized error even with correct consumer key and secret

Cause: WooCommerce requires HTTPS for REST API authentication using Basic Auth. On HTTP sites, authentication may fail or consumer keys may be rejected. Also check that the WordPress user associated with the key is still active and has not been deleted.

Solution: Ensure your WooCommerce store Base URL uses https:// in the Retool resource. If your site is not on HTTPS, WooCommerce REST API will reject Basic Auth. Check in WooCommerce → Settings → Advanced → REST API that the consumer key status shows 'Read/Write' and was not revoked. Regenerate the key if necessary.

### Query returns a 404 Not Found for valid WooCommerce endpoints

Cause: WordPress permalink settings must be set to 'Post name' or any custom structure (not 'Plain') for the WooCommerce REST API to work. Plain permalinks break the /wp-json/ routing.

Solution: In WordPress admin, go to Settings → Permalinks. If set to 'Plain', change to 'Post name' or any non-plain option and save. This updates .htaccess rewrites and enables the REST API routing. Also verify the REST API is not disabled by a security plugin like Wordfence or iThemes Security.

### Order update (PUT) returns 200 but order status does not change in WooCommerce

Cause: The status value passed in the request body may not match a valid WooCommerce status string, or the status transition is blocked by WooCommerce business logic (e.g., you cannot change a 'completed' order back to 'pending' without custom code).

Solution: Valid WooCommerce order statuses are: pending, processing, on-hold, completed, cancelled, refunded, failed, trash. Ensure the value passed exactly matches one of these strings. Check WooCommerce order notes in WordPress admin to see if any hooks or plugins blocked the status change.

### Response headers do not include X-WP-Total or X-WP-TotalPages for pagination

Cause: Some WordPress caching plugins or CDNs (Cloudflare page caching, WP Rocket) strip custom response headers, removing the WooCommerce pagination headers that Retool needs to implement page navigation.

Solution: Disable page caching for the /wp-json/ path in your caching plugin or CDN configuration. In Cloudflare, create a Page Rule for yourdomain.com/wp-json/* with Cache Level set to 'Bypass'. After bypassing cache, the pagination headers will appear in query responses.

## Frequently asked questions

### Does Retool have a native WooCommerce connector?

No, Retool does not have a dedicated WooCommerce connector. You connect using a REST API Resource with Basic Auth. WooCommerce's REST API v3 is comprehensive and well-documented, so the REST API Resource approach gives you full access to all endpoints including orders, products, customers, coupons, and reports.

### Can I process WooCommerce refunds from Retool?

Yes. Use a POST request to /orders/{order_id}/refunds with a JSON body containing the amount, reason, and line_items array specifying which items to refund and by how much. The refund creates a WooCommerce order refund record and can optionally trigger a payment gateway refund if the payment method supports API-based refunds.

### How do I handle WooCommerce variable products with multiple variations?

Variable products have a separate endpoint at /products/{product_id}/variations. Each variation has its own stock_quantity, price, and attribute values (like size or color). Query the parent product first to get the product ID, then query the variations endpoint to get individual stock levels. Update stock on variations using PUT /products/{id}/variations/{variation_id}.

### What is the maximum number of WooCommerce records I can fetch per request?

WooCommerce's REST API has a maximum per_page limit of 100 records per request. For stores with more records, implement pagination using the 'page' parameter and check the X-WP-TotalPages header to determine how many pages exist. Build a Retool pagination component connected to the page query parameter.

### Is WooCommerce REST API access affected by caching plugins?

Yes, WordPress caching plugins like W3 Total Cache, WP Rocket, or Cloudflare page caching can interfere with WooCommerce REST API responses by serving cached responses or stripping custom headers. Configure your caching plugin to exclude the /wp-json/ path from caching rules to ensure fresh data and correct pagination headers.

---

Source: https://www.rapidevelopers.com/retool-integrations/woocommerce
© RapidDev — https://www.rapidevelopers.com/retool-integrations/woocommerce