Payflex Widgets

About Payflex Widgets

Payflex offers merchants a number of informative widgets for the merchants product and cart pages, these display more information about the Payflex payment plans to customers. The widgets are easy to add to the relevant pages, and can be done by most website owners.

If you are having any issues implementing these on your site, please contact integrations@payflex.co.za.

Simple Usage - Calculator / More Info

Simply insert a script tag, as defined below, onto the part of the page where you would like the widget to be displayed.

Base Url : https://widgets.payflex.co.za/your-merchant-name/payflex-widget-2.0.0.js?type=calculator

Parameters

Name Description
amount The order or cart amount
logo_type (optional) purple or navy
pay_type (optional) 3, 4
pay_type=3 means Pay In 3
pay_type=4 means Pay In 4
theme (optional) theme=dark
By default it will be light theme

Demo

Item / cart worth R300

Logo Type

Pay Type

Code Snippet 
<script async src="https://widgets.payflex.co.za/your-merchant-name/payflex-widget-2.0.0.js?type=calculator&amount=300" type="application/javascript"></script>

Update the Installment Amount Dynamically

To dynamically update the installment amount based on user input or other conditions, use the PayflexWidget.update method.

Method: PayflexWidget.update(amount, [type])

  • amount: The new purchase amount for which the installments need to be recalculated. This should be a numeric value.
  • type (optional): The installment type. Accepts 3 for a 3-installment plan or 4 for a 4-installment plan. If omitted, defaults to 4.

Example Usage

To update the widget to calculate installments for a new amount of 200 with the default 4-installment plan, use:

PayflexWidget.update(200);

To specify a 3-installment plan, use:

PayflexWidget.update(200, 3);

WooCommerce

When using this widget on WooCommerce, you can pass the following values for the amount parameters.

Parameters

WooCommerce Page Value
Cart WC()->cart->cart_contents_total;
Product WC()->product-> get_price();
Code Snippet 
<script async src="https://widgets.payflex.co.za/payflex-widget-2.0.0.js?type=calculator&amount=<?php echo $product->get_price(); ?>" type="application/javascript"></script>

Shopify

When using this widget on Shopify, you can pass the following values for the amount parameters.

Parameters

Code Snippet 
{%- if product.variants[0] -%} 
{%- assign priceforwidget = product.variants[0].price -%}
{%- else -%}
{%- assign priceforwidget = product.price -%}
{%- endif -%} 

<script async src="https://widgets.payflex.co.za/payflex-widget-2.0.0.js?type=calculator&amount={{ priceforwidget | money_without_currency | remove: ',' }}" type="application/javascript"></script>