Webflow sync, pageviews & more.
NEW

Has anyone successfully integrated Nowpayments into a Webflow E-commerce website and can provide guidance on how to do it?

TL;DR
  • Replace Webflow's native checkout with custom “Buy Now” buttons linking to Nowpayments' crypto checkout pages or widgets.
  • Set up products in Webflow CMS, generate payment links in Nowpayments, and embed them in buttons; optionally use custom scripting and automation (e.g., Zapier) for dynamic invoices and webhooks.

Integrating Nowpayments into a Webflow e-commerce site requires custom scripting, as Webflow's native checkout doesn't support external payment gateways like Nowpayments. However, a workaround is possible using third-party tools and manual setup.

1. Understand Nowpayments Capabilities

  • Nowpayments is a non-custodial crypto payment gateway that supports over 100 cryptocurrencies.
  • It allows website owners to accept crypto payments either through payment links, API integrations, or donation widgets.
  • Webflow does not natively allow external payment gateways on its checkout process, but you can build custom flows.

2. Choose Integration Method

  • Use STATIC or CMS pages to sell digital goods or services.
  • Instead of Webflow’s native E-commerce checkout, replace it with a “Buy Now” button that links to Nowpayments' crypto checkout.

Available Nowpayments options:

  • Invoice Creation API: Generates a payment page link via API.
  • Payment Link: A pre-generated URL that sends customers to a Nowpayments checkout screen.
  • Donation Widget: Embeddable widget (ideal for smaller operations or tipping options).

3. Set Up Products Manually

  • Use Webflow CMS: Create a “Products” collection with fields like Product Name, Description, Price, and a custom field for the Nowpayments Payment Link.
  • Alternatively, manually list products with buttons linking to individual Nowpayments checkout pages.
  • Log in to Nowpayments and create an invoice or payment link for each product.
  • Retrieve the payment URL (e.g., https://nowpayments.io/payment-link/abc123).
  • Store the URL in a Webflow CMS field or hardcode into buttons.

5. Embed/Create a Payment Button

  • Add a Button or Link Block in Webflow.
  • Set the link to the Payment URL (external link to Nowpayments).
  • Style the button to match your branding.

6. Optional: Use Custom Scripting (Advanced)

  • Use Webflow’s Embed element to write custom JavaScript if you’re dynamically generating invoice links via Nowpayments API.
  • You’ll need to use a third-party service like Zapier, Make (formerly Integromat), or Firebase Functions to perform backend API calls, since Webflow itself doesn’t support server-side logic.

7. Set Up Webhooks (Optional for Order Tracking)

  • Nowpayments provides webhook callbacks for payment confirmation.
  • You can set up a webhook to notify you when a payment is completed.
  • Use tools like Make, Zapier, or Pipedream to receive those callbacks and trigger confirmations or email flows.

Summary

You can integrate Nowpayments in a Webflow site, but not through native checkout. Instead, create product pages with external Nowpayments links or widgets, optionally powered by CMS collections. For a more dynamic experience, integrate Webhooks or APIs using external automation tools.

Rate this answer

Other Webflow Questions