AhaPay integrates with WooCommerce to provide flexible payment options for your customers. The plugin allows shoppers to split their payments into 4 to 12 installments automatically, with no hidden fees.

Requirements

WordPress 5.4 or higher
WooCommerce 4.8 or higher
PHP 7.4 or higher
OpenSSL PHP extension
SSL certificate installed on your domain (for secure transactions)

Configuration

Basic Settings

Enable/Disable – Turn the payment method on or off
Title – The payment method title shown to customers
Description – The payment method description shown to customers
Environment – Choose between Sandbox (testing) and Production
API Key – Enter your AhaPay API key
External Merchant ID – Required only for Partner API keys; leave empty for Trade Outlet API keys

Note: AhaPay is offered only on orders at or above the minimum, which is 55 MYR by default and editable in the gateway settings (minimum_amount). A merchant may set it lower or higher — 20 and 50 are as valid as 100 — and only a negative figure is refused, since it says nothing; a blank field keeps the default. Below whatever is set, no checkout offers AhaPay and product pages show no instalment banner.

Display Settings

Product Label – Enable/disable BNPL information on product pages
Product Label Text – Customize the BNPL message
Product Label Color – Set the background color for labels
Product Label Text Color – Set the text color for labels

Features

Seamless integration with WooCommerce checkout
Automatic order status updates
Real-time payment verification
Custom product page badges and banners
Responsive payment modal
Support for both desktop and mobile devices
Order status checking in admin panel
Sandbox environment for testing
Detailed payment status tracking
Support for refunds

Payment Flow

Customer selects AhaPay at checkout
Order is created and customer is redirected to AhaPay
Customer completes payment setup with AhaPay
Order status is automatically updated
Customer is redirected back to your store

Order Statuses

PAYMENT_SUCCESSFUL – Payment completed
CANCELLED – Payment cancelled by customer
UNAVAILABLE – Payment failed
PAYMENT_IN_PROGRESS – Payment pending
REFUNDED – Payment refunded

Support

For support or questions, please contact AhaPay support team or visit your AhaPay merchant dashboard.

External services

This plugin connects to the AhaPay API to process Buy Now Pay Later payments and handle order status updates.

The plugin uses AhaPay External API V2:
– GET /v2/health to verify API key connectivity
– POST /v2/orders/default to create checkout orders
– GET /v2/orders/{online_order_id}/status to check order status
– POST /v2/orders/{online_order_id}/refund to process full refunds

For Partner API keys, configure External Merchant ID with the merchant identifier assigned by the partner platform. For Trade Outlet API keys, leave this field empty.

Amounts and order item prices are sent as decimal MYR values. V2 callbacks are expected with online_order_status; the plugin also accepts status for compatibility with older callback documentation.

It sends the following data when processing payments or checking status:
– Order ID and transaction details
– API key for authentication
– External Merchant ID when configured for Partner API key integrations
– Refund requests with order information

Data is sent securely via HTTPS to AhaPay’s servers only when necessary for payment processing or status verification.

This service is provided by AhaPay: Terms of Service, Privacy Policy.

Development

This plugin uses webpack to build JavaScript and CSS assets.

Build Process

Install the locked dependencies: npm ci
Build assets: npm run build (or npm run dev for development)

Source files are located in the blocks/ directory. Built files are in assets/blocks/.

The installable plugin ZIP includes the Checkout block source, webpack configuration,
and locked npm manifests needed to review, modify, and rebuild the distributed bundle.

License

This plugin is licensed under the terms of use provided by AhaPay.

Customize Payment Fields CSS

You can add custom CSS that will be applied specifically to AhaPay’s payment fields on the checkout page from the plugin settings in the WordPress admin.

How to update the CSS

In WordPress admin go to: WooCommerce Settings Payments.
Find “AhaPay Buy Now Pay Later” in the list and click Manage (or click the Settings link).
Scroll down to the setting named “Additional CSS for Payment Fields”.
Paste your CSS into the textarea and click Save changes.

How the plugin applies your CSS

The plugin stores the textarea content and adds it as inline CSS attached to the plugin stylesheet handle ahapaybuynowpaylater-block-style.
The payment fields output by the gateway are wrapped in a container with the class .ahapay-payment-fields, so we recommend scoping your rules under that selector to avoid affecting other parts of your site.
The plugin will strip surrounding <style> tags if you paste them by accident, and it sanitizes the textarea input on save. If you need to override existing rules, use specificity or !important as needed.

Quick verification example

Paste the following CSS into the “Additional CSS for Payment Fields” textarea and save. Then open your checkout page (or the block checkout) and you should see a green dashed border, a small badge that reads “ADDITIONAL CSS APPLIED”, and visible styling changes for the offer title, amount and feature list. This is a visual test to confirm the inline CSS is applied.

`css

/* Visual test for Additional CSS for Payment Fields */
.ahapay-payment-fields {
border: 3px dashed #27ae60 !important;
background: rgba(39, 174, 96, 0.04) !important;
padding: 12px !important;
position: relative !important;
border-radius: 6px !important;
}

/* Badge so you can clearly see the CSS is applied */
.ahapay-payment-fields::before {
content: “ADDITIONAL CSS APPLIED”;
position: absolute;
top: -12px;
right: 8px;
background: #27ae60;
color: #ffffff;
font-weight: 700;
font-size: 11px;
padding: 3px 8px;
border-radius: 3px;
box-shadow: 0 1px 2px rgba(0,0,0,0.15);
z-index: 9999;
}

.ahapay-payment-fields .ahapay-promo__offer-title {
color: #e91e63 !important;
font-size: 18px !important;
font-weight: 700 !important;
}

.ahapay-payment-fields .ahapay-promo__amount {
color: #555 !important;
font-style: italic !important;
}

.ahapay-payment-fields .ahapay-promo__feature {
display: inline-block !important;
background: #fff8e1 !important;
padding: 6px 8px !important;
margin-right: 6px !important;
border-radius: 4px !important;
font-weight: 600 !important;
}
`

Small examples

Change the title color only:

css .ahapay-payment-fields .ahapay-promo__offer-title { color: #0066cc !important; }
Hide the feature list if it conflicts with your theme:

css .ahapay-payment-fields .ahapay-promo__features { display: none !important; }

Troubleshooting

If you don’t see the changes after saving the CSS, try these steps:
- Ensure the AhaPay payment method is enabled (WooCommerce Settings Payments AhaPay).
- Clear any caching on your site (plugin cache, server cache, CDN) and your browser cache.
- Confirm you’re viewing a checkout page that loads the plugin styles (block checkout or classic checkout). If you use a custom checkout template, ensure the ahapay-payment-fields wrapper is present in the markup.
- Use !important or increase specificity if your theme’s CSS is overriding the rules.

Security and best practices

The textarea is intended for admin use only. Avoid pasting untrusted CSS/JS — the plugin strips <style> tags but does not execute arbitrary JS.
Keep rules scoped (start with .ahapay-payment-fields) to avoid unintentionally affecting other areas of your site.

AhaPay Buy Now Pay Later