Tandym Green logo

On site messaging widgets

Installing Tandym on site messaging widget creates better visibility of the program and leads to much higher conversion rates. Tandym on site messaging widgets are a great way to let the customers know before they decide to buy and drive better conversion.

Our Widget is dynamic and takes care of: Displaying the $ saving on First Purchase as well % earning on future purchases Displaying the {YOUR PAY} Information Modal when a customer clicks on the Learn more

Placement

We recommend adding Tandym MApps to your:

  • Product detail pages (PDPs)
  • Cart page
  • Checkout page

Loading the Library

Installing Tandym Mapps is a super simple 3 step process.

  1. Load the Tandym JS library (before the </body> tag)
  2. Add the Tandym widget to the div where you want that Mapps to show up
  3. Configure the price attribute inside the Tandym-MAppp widget.

Product page widget

Example Snippet

<!-- Tandym MApps Widget - add it in the div where you want the widget to show up  -->

<tandym-mapps data-tandym-widget=”PDP” data-tandym-product-price="product-price-to-be-setup-in-cents"></tandym-mapps>

Eg:
<tandym-mapps data-tandym-widget="PDP" data-tandym-product-price="5620"></tandym-mapps>

<!-- Add before the </body> tag  -->
<!-- Begin Tandym MApps JavaScript Library (v1.0.0) -->

<script type="text/javascript" src="https://assets.platform.bytandym.com/custom-mapps-assets/tandym-mapps-custom-v1.js?tandym_api_key={{YOUR_TANDYM_API_KEY}}"></script>

<!-- End Tandym MApps JavaScript Snippet (v1.0.0) -->

View cart page widget

Example Snippet

<!-- Tandym MApps Widget - add it in the div where you want the widget to show up  -->

<tandym-mapps data-tandym-widget=”CART” data-tandym-cart-total="cart-total-to-be-setup-in-cents"></tandym-mapps>

Eg:
<tandym-mapps data-tandym-widget="CART" data-tandym-cart-total="17000"></tandym-mapps>

<!-- Tandym MApps   →


<!-- Add before the </body> tag  -->
<!-- Begin Tandym MApps JavaScript Library (v1.0.0) -->

<script type="text/javascript" src="https://assets.platform.bytandym.com/custom-mapps-assets/tandym-mapps-custom-v1.js?tandym_api_key={{YOUR_TANDYM_API_KEY}}"></script>

<!-- End Tandym MApps JavaScript Snippet (v1.0.0) -->

Checkout page widget

Example Snippet

<!-- Tandym MApps Widget - add it in the div where you want the widget to show up  -->

<tandym-mapps data-tandym-widget=”CHEKOUT” data-tandym-checkout-total="checkout-amount-to-be-setup-in-cents"></tandym-mapps>

Eg:
<tandym-mapps data-tandym-widget="CHECKOUT" data-tandym-checkout-total="17000"></tandym-mapps>

<!-- Tandym MApps   -->

<!-- Add before the </body> tag  -->
<!-- Begin Tandym MApps JavaScript Library (v1.0.0) -->

<script type="text/javascript" src="https://assets.platform.bytandym.com/custom-mapps-assets/tandym-mapps-custom-v1.js?tandym_api_key={{YOUR_TANDYM_API_KEY}}"></script>

<!-- End Tandym MApps JavaScript Snippet (v1.0.0) -->