JS Element 03

Shopping cart

Reinforce the Fundiin option in the cart with an affordability message based on the complete order value.

Start implementation

Before coding

Use these values for this surface.

PlacementCart summary

InputCart total

Scriptcartjs.js

Container#script-general-container

Configuration: fundiinCartConfig

Implementation

Add the snippets in this order.

Replace template values with current page data and replace merchantId with the MID from your Fundiin profile. The snippets use the sandbox host.

Mount the UI container

Place the container near the cart total or checkout call to action.

<div id="script-general-container"></div>

Provide cart amount

Set amount to the current cart total and optionally configure styles.

<script>
  var fundiinCartConfig = {
    data: {
      amount: {{cart_total}}
    },
    style: {}
  };
</script>

Load the JS Element

Load the cart script after the container and configuration.

<script
  type="application/javascript"
  crossorigin="anonymous"
  src="https://gateway-sandbox.fundiin.vn/merchants/cartjs/(merchantId).js">
</script>

Complete example

Copy the full sandbox structure.

This example uses a sample MID. Replace it with the merchantId issued to your business.

Load each hosted script only once per page.

<div id="script-general-container"></div>
<script>
  var fundiinCartConfig = {
    data: {
      // Cart total = 300,000 VND
      amount: 300000
    },
    style: {}
  };
</script>
<script
  type="application/javascript"
  crossorigin="anonymous"
  src="https://gateway-sandbox.fundiin.vn/merchants/cartjs/FD200000165745.js">
</script>