<h2>Optimize your checkout experience</h2>
<ul class="wccom-tick-list-primary">
<li><b>Boost conversion:</b> Provide an optimal experience across mobile, tablet, and desktop with a responsive checkout, and offer <a href="https://stripe.com/payments/link" target="_blank" rel="noopener">Link</a>, <a href="https://woocommerce.com/apple-pay/">Apple Pay</a>, and <a href="https://www.google.com/payments/solutions/" target="_blank" rel="noopener">Google Pay</a> out of the box.</li>
<li><b>Expand your customer base:</b> Convert customers who would usually abandon their cart and increase average order value with buy now, pay later options like Klarna, Afterpay, and Affirm. Accept credit and debit card payments from Visa, Mastercard, American Express, Discover, and Diners.</li>
<li><b>Meet existing customer demand and localize the experience:</b> Offer <a href="https://stripe.com/guides/payment-methods-guide" target="_blank" rel="noopener">local payment methods</a> such as Bancontact, Boleto, Cash App Pay, EPS, giropay, iDEAL, Multibanco, OXXO, Przelewy 24, and SEPA Direct Debit.</li>
<li><b>Fight fraud:</b> Detect and prevent fraud with <a href="https://stripe.com/radar" target="_blank" rel="noopener">Stripe Radar</a>, which offers seamlessly integrated, powerful fraud-detection tools that use machine learning to detect and flag potentially fraudulent transactions.</li>
<li><b>Accept in-person payments for products and services:</b> Use the Stripe Terminal M2 card reader or get started with no additional hardware using Tap to Pay on iPhone, or Tap to Pay on Android.</li>
<li><b>Support subscriptions:</b> Support recurring payments with various payment methods via <a href="https://woocommerce.com/products/woocommerce-subscriptions/">WooCommerce Subscriptions</a>.</li>
<li><b>Manage cash flow:</b> Get paid within minutes with Stripe Instant Payouts, if eligible.</li>
<li>Achieve <a href="https://docs.stripe.com/security" target="_blank" rel="noopener">PCI-DSS compliance</a> with <a href="https://stripe.com/payments/elements" target="_blank" rel="noopener">Stripe Elements</a> hosted input fields.</li>
<li>Support Strong Customer Authentication (SCA).</li>
</ul>
<hr class="wccom-product-heading__hr" />
<div style="background-color: #674399;border-radius: 10px;padding: 20px;margin-bottom: 20px;color: #fff">
<h3 style="margin-bottom: 0;color: #fff"><a style="color: #fff" href="https://woocommerce.com/document/stripe/">Update or install</a> the new checkout experience from Stripe.</h3>
</div>
<h2>Drive 11.9% in revenue with an optimized checkout experience from Stripe</h2>
<p>Changing consumer behavior has resulted in an explosion of payment methods and experiences, which are great for increasing conversion and lowering costs—but can be difficult for businesses to maintain. Give customers a best-in-class checkout experience while you remain focused on your core business.</p>
<p>Businesses using the new checkout experience from Stripe saw 11.9% more revenue on average. The new checkout experience can help customers:</p>
<ul>
<li>Increase conversion by providing a great shopper experience that helps convert buyers.</li>
<li>Expand your customer base by offering more payment methods including popular buy now pay later methods to appeal to more audiences.</li>
<li>Reduce time and effort by saving administration time and streamlining operations.</li>
</ul>
<h2>Features and benefits</h2>
<h3>Increase conversion</h3>
<p>With the new checkout from Stripe, you can surface 23 payment methods including buy now, pay later methods, and Link, an accelerated checkout experience.</p>
<p><img class="alignnone size-medium wp-image-18734004114012" src="https://woocommerce.com/wp-content/uploads/2024/08/Payment-Methods-at-checkout_d95dff.gif?w=896" alt="" width="896" height="550" /></p>
<p><img class="alignnone size-medium wp-image-18734004113864" src="https://woocommerce.com/wp-content/uploads/2024/08/Checkout.png?w=896" alt="" width="896" height="550" /></p>
<h3>Expand your customer base</h3>
<p>Convert customers who might otherwise abandon their cart with buy now, pay later methods like Klarna, Affirm, and Afterpay/Clearpay, wallets like Apple Pay, Google Pay, Alipay, and WeChatpay, and local payment methods such as Bancontact in Europe and Alipay in Asia Pacific. Deliver a localized payment experience with out-of-the-box support for localized error messages, right-to-left languages, and automatic adjustment of input fields based on payment method and country.</p>
<p><img class="alignnone size-medium wp-image-18734004113873" src="https://woocommerce.com/wp-content/uploads/2024/08/Link.gif?w=896" alt="" width="896" height="550" /></p>
<h3>Fight fraud</h3>
<p>Stripe Radar offers seamlessly integrated, powerful fraud-detection tools that use machine learning to detect and flag potentially fraudulent transactions.</p>
<p><img class="alignnone size-medium wp-image-18734004113870" src="https://woocommerce.com/wp-content/uploads/2024/08/Radar-dashboard.png?w=896" alt="" width="896" height="550" /></p>
<h3>Accept in-person payments</h3>
<p>Accept in-person payments for products and services using the Stripe Terminal M2 card reader or get started with no additional hardware using Tap to Pay on iPhone or Android.</p>
<p><img class="alignnone size-medium wp-image-18734004113868" src="https://woocommerce.com/wp-content/uploads/2024/08/M2-card-reader.png?w=896" alt="" width="896" height="550" /></p>
<p><img class="alignnone size-medium wp-image-18734004113872" src="https://woocommerce.com/wp-content/uploads/2024/08/Tap-to-Pay-on-Android.gif?w=896" alt="" width="896" height="550" /></p>
<h2>Get started with Stripe</h2>
<ul>
<li><a href="https://woocommerce.com/document/stripe/">Install Stripe for WooCommerce</a>.</li>
<li><a href="https://woocommerce.com/document/stripe/admin-experience/in-person-payments/">Learn more</a> about Stripe for WooCommerce.</li>
</ul>
<h2>About Stripe</h2>
<h3>Building financial infrastructure for the internet economy.</h3>
<p>Stripe is a financial infrastructure platform for businesses. Millions of companies—from the world’s largest enterprises to the most ambitious startups—use Stripe to accept payments, grow their revenue, and accelerate new business opportunities. Headquartered in San Francisco and Dublin, the company aims to increase the GDP of the internet.</p>

Stripe

<p>Maximize revenue with the new checkout from Stripe.</p>

AhaPay - Buy Now Pay Later

<p>AhaPay integrates with WooCommerce to provide flexible payment options for your customers. The plugin allows shoppers to split their payments into 4 or 7 installments automatically, with no hidden fees and 0% interest on 4-payment plans.</p>
<h3>Requirements</h3>
<ul>
<li>WordPress 5.4 or higher</li>
<li>WooCommerce 4.8 or higher</li>
<li>PHP 7.4 or higher</li>
<li>OpenSSL PHP extension</li>
<li>SSL certificate installed on your domain (for secure transactions)</li>
</ul>
<h3>Configuration</h3>
<h3>Basic Settings</h3>
<ol>
<li>Enable/Disable – Turn the payment method on or off</li>
<li>Title – The payment method title shown to customers</li>
<li>Description – The payment method description shown to customers</li>
<li>Environment – Choose between Sandbox (testing) and Production</li>
<li>API Key – Enter your AhaPay API key</li>
<li>Minimum Amount – Set the minimum order amount for AhaPay availability</li>
</ol>
<h3>Display Settings</h3>
<ul>
<li>Product Label – Enable/disable BNPL information on product pages</li>
<li>Product Label Text – Customize the BNPL message</li>
<li>Product Label Color – Set the background color for labels</li>
<li>Product Label Text Color – Set the text color for labels</li>
</ul>
<h3>Features</h3>
<ul>
<li>Seamless integration with WooCommerce checkout</li>
<li>Automatic order status updates</li>
<li>Real-time payment verification</li>
<li>Custom product page badges and banners</li>
<li>Responsive payment modal</li>
<li>Support for both desktop and mobile devices</li>
<li>Order status checking in admin panel</li>
<li>Sandbox environment for testing</li>
<li>Detailed payment status tracking</li>
<li>Support for refunds</li>
</ul>
<h3>Payment Flow</h3>
<ol>
<li>Customer selects AhaPay at checkout</li>
<li>Order is created and customer is redirected to AhaPay</li>
<li>Customer completes payment setup with AhaPay</li>
<li>Order status is automatically updated</li>
<li>Customer is redirected back to your store</li>
</ol>
<h3>Order Statuses</h3>
<ul>
<li>PAYMENT_SUCCESSFUL – Payment completed</li>
<li>CANCELLED – Payment cancelled by customer</li>
<li>UNAVAILABLE – Payment failed</li>
<li>PAYMENT_IN_PROGRESS – Payment pending</li>
<li>REFUNDED – Payment refunded</li>
</ul>
<h3>Support</h3>
<p>For support or questions, please contact AhaPay support team or visit your AhaPay merchant dashboard.</p>
<h3>External services</h3>
<p>This plugin connects to the AhaPay API to process Buy Now Pay Later payments and handle order status updates.</p>
<p>It sends the following data when processing payments or checking status:<br />
– Order ID and transaction details<br />
– API key for authentication<br />
– Refund requests with order information</p>
<p>Data is sent securely via HTTPS to AhaPay’s servers only when necessary for payment processing or status verification.</p>
<p>This service is provided by AhaPay: <a href="https://merchant-help.ahapay.my/hc/en-my" rel="nofollow ugc">Terms of Service</a>, <a href="https://ahapay.my/privacy-policy" rel="nofollow ugc">Privacy Policy</a>.</p>
<h3>Development</h3>
<p>This plugin uses webpack to build JavaScript and CSS assets.</p>
<h3>Build Process</h3>
<ol>
<li>Install dependencies: <code>npm install</code></li>
<li>Build assets: <code>npm run build</code> (or <code>npm run dev</code> for development)</li>
</ol>
<p>Source files are located in the <code>blocks/</code> directory. Built files are in <code>assets/blocks/</code>.</p>
<p>The source code is publicly available in this repository for review and modification.</p>
<h3>1.0.0</h3>
<ul>
<li>Initial release</li>
<li>Basic payment integration</li>
<li>Order status management</li>
<li>Product page integration</li>
<li>Admin interface</li>
<li>Sandbox/Production environments</li>
</ul>
<h3>License</h3>
<p>This plugin is licensed under the terms of use provided by AhaPay.</p>
<h3>Customize Payment Fields CSS</h3>
<p>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.</p>
<p>How to update the CSS</p>
<ol>
<li>In WordPress admin go to: WooCommerce <span aria-hidden="true" class="wp-exclude-emoji">→</span> Settings <span aria-hidden="true" class="wp-exclude-emoji">→</span> Payments.</li>
<li>Find “AhaPay Buy Now Pay Later” in the list and click Manage (or click the Settings link).</li>
<li>Scroll down to the setting named “Additional CSS for Payment Fields”.</li>
<li>Paste your CSS into the textarea and click Save changes.</li>
</ol>
<p>How the plugin applies your CSS</p>
<ul>
<li>The plugin stores the textarea content and adds it as inline CSS attached to the plugin stylesheet handle <code>ahapaybuynowpaylater-block-style</code>.</li>
<li>The payment fields output by the gateway are wrapped in a container with the class <code>.ahapay-payment-fields</code>, so we recommend scoping your rules under that selector to avoid affecting other parts of your site.</li>
<li>The plugin will strip surrounding <code><style></code> 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 <code>!important</code> as needed.</li>
</ul>
<p>Quick verification example</p>
<p>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 title, subtitle and progress bar. This is a visual test to confirm the inline CSS is applied.</p>
<pre><code>`css
</code></pre>
<p>/* Visual test for Additional CSS for Payment Fields */<br />
.ahapay-payment-fields {<br />
  border: 3px dashed #27ae60 !important;<br />
  background: rgba(39, 174, 96, 0.04) !important;<br />
  padding: 12px !important;<br />
  position: relative !important;<br />
  border-radius: 6px !important;<br />
}</p>
<p>/* Badge so you can clearly see the CSS is applied */<br />
.ahapay-payment-fields::before {<br />
  content: “ADDITIONAL CSS APPLIED”;<br />
  position: absolute;<br />
  top: -12px;<br />
  right: 8px;<br />
  background: #27ae60;<br />
  color: #ffffff;<br />
  font-weight: 700;<br />
  font-size: 11px;<br />
  padding: 3px 8px;<br />
  border-radius: 3px;<br />
  box-shadow: 0 1px 2px rgba(0,0,0,0.15);<br />
  z-index: 9999;<br />
}</p>
<p>.ahapay-payment-fields .ahapay-title {<br />
  color: #e91e63 !important;<br />
  font-size: 18px !important;<br />
  font-weight: 700 !important;<br />
}</p>
<p>.ahapay-payment-fields .ahapay-subtitle {<br />
  color: #555 !important;<br />
  font-style: italic !important;<br />
}</p>
<p>.ahapay-payment-fields .ahapay-progress-bar {<br />
  background: #eee !important;<br />
  height: 12px !important;<br />
  border-radius: 12px !important;<br />
  margin: 10px 0 !important;<br />
}</p>
<p>.ahapay-payment-fields .ahapay-progress {<br />
  width: 75% !important;<br />
  height: 100% !important;<br />
  background: linear-gradient(90deg,#e91e63,#ff8a80) !important;<br />
  border-radius: 12px !important;<br />
}</p>
<p>.ahapay-payment-fields .ahapay-timeline div {<br />
  display: inline-block !important;<br />
  background: #fff8e1 !important;<br />
  padding: 6px 8px !important;<br />
  margin-right: 6px !important;<br />
  border-radius: 4px !important;<br />
  font-weight: 600 !important;<br />
}<br />
    `</p>
<p>Small examples</p>
<ul>
<li>
<p>Change the title color only:</p>
<p><code>css<br />
.ahapay-payment-fields .ahapay-title { color: #0066cc !important; }</code></p>
</li>
<li>
<p>Hide the timeline if it conflicts with your theme:</p>
<p><code>css<br />
.ahapay-payment-fields .ahapay-timeline { display: none !important; }</code></p>
</li>
</ul>
<p>Troubleshooting</p>
<ul>
<li>If you don’t see the changes after saving the CSS, try these steps:
<ul>
<li>Ensure the AhaPay payment method is enabled (WooCommerce <span aria-hidden="true" class="wp-exclude-emoji">→</span> Settings <span aria-hidden="true" class="wp-exclude-emoji">→</span> Payments <span aria-hidden="true" class="wp-exclude-emoji">→</span> AhaPay).</li>
<li>Clear any caching on your site (plugin cache, server cache, CDN) and your browser cache.</li>
<li>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 <code>ahapay-payment-fields</code> wrapper is present in the markup.</li>
<li>Use <code>!important</code> or increase specificity if your theme’s CSS is overriding the rules.</li>
</ul>
</li>
</ul>
<p>Security and best practices</p>
<ul>
<li>The textarea is intended for admin use only. Avoid pasting untrusted CSS/JS — the plugin strips <code><style></code> tags but does not execute arbitrary JS.</li>
<li>Keep rules scoped (start with <code>.ahapay-payment-fields</code>) to avoid unintentionally affecting other areas of your site.</li>
</ul>


AhaPay Buy Now Pay Later

AhaPay Buy Now Pay Later AhaPay is a Buy Now Pay Later (BNPL) payment solution that enables customers to split their purchases into installments with  …

Stripe vs AhaPay Buy Now Pay Later