Skip to main content
The product page widget renders instalment messaging next to the price (e.g. “or as low as £200.00 over 3 months interest-free”), along with a built-in “How it works” explainer modal, all from a single script tag with no API call or signature required.
If your store runs WooCommerce, Shopify, or Magento with the official Float plugin, instalment messaging is already included, so you don’t need to add it yourself. This page is for custom API integrations.
The UK widget bundle is rolling out. Until the UK host is live, render instalment messaging yourself from your merchant config and link the explainer page as described in Accepting payments. Talk to your Float contact if you want to be an early adopter.

Add the widget

Place a script tag wherever the messaging should render, typically directly below the price:
The script injects its own markup (logo, instalment breakdown, and a “How it works” link) at its own position in the DOM. There’s no container element or JS SDK to set up.
Two product cards, each showing the Float logo and 'Or as low as £200.00 over 3 months interest-free' and '£325.00 over 4 months' respectively

Two widgets on one page, each calculating from its own price and term.

Parameters

Keep the price in sync

If the price can change without a page reload (a variant picker, a quantity stepper, a discount code), call floatUpdate on the rendered element:
With several widgets on the page, scope the lookup to the product you’re updating:
Re-inserting a fresh <script> element also works, but floatUpdate avoids the re-fetch. Changing the src attribute on an existing script tag does nothing.

Handle missing or zero price

Don’t render the widget with price=0 or blank. The script renders nothing at all in that case, rather than advertising £0.00. Suppress the widget for unpriced or out-of-stock items.

Multiple widgets on one page

Category, search, and “related products” pages can safely render as many widgets as they like. Each one is scoped to its own instance and calculates from its own price and instalments.

What’s included

The “How it works” link opens a modal that’s already wired up; you don’t need to link to the explainer page yourself or build a lightbox. The modal reflects the actual product price, so a £600 product shows a £600 worked example, and it uses the UK copy and card requirements.
The How it works modal with the Powered by Float badge, UK copy, and a worked example showing £200 paid today with £400 reserved, then £200 one and two months later

The explainer modal for a £600 product.

Everything is served as static files from a CDN, and the logo, styles, and fonts are inlined into the script, so rendering the widget is a single request. Nothing further is fetched until a shopper opens the modal. It only renders correctly from a real page served over HTTP(S); it won’t work from a local static file preview.
No, this widget is purely on-page merchandising. You still create a checkout and redirect the shopper as described in Accepting payments once they choose Float.
The first instalment is charged at the time of purchase and the remainder of the purchase amount is reserved on the card, with the remaining instalments charged on the same day each month. If your account is configured differently, render your own messaging from your merchant config instead.
The script is about 13 KB gzipped, served from a CDN with a long cache lifetime, and makes no API calls. The explainer modal is only fetched if a shopper actually opens it.