Integrate payments with plug&paid

We don’t support direct payments yet, but here are the steps to integrate the external solution directly into your bot, without the user having to redirect to another URL.

We’ll use plug&paid service: https://www.plugnpaid.com.

Step 1. Create a bot step where you’ll have a prompt for the payment, it can be, for example, a button step.

The button will have a text like ‘Paid’.

Step 2. From your plug&paid dashboard, get the payment button code:

Click on Copy to Clipboard

Step 3. In the bot messages section of this step, add an HTML chat text (developer mode needs to be switched on)

Paste the previously copied HTML code:

The code needs to be slightly modified.

Given the plug&paid provided code is:

<div>
<a class="plugnpaid--kmq4f9hl"></a>
<script src="https://plu.ug/n/-kmq4f9hl"></script>
</div>

Modify it to add some styling and the rendering handler:

<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.6.0/jquery.min.js" onload="$.noConflict()"></script>
<div style="text-align: center">
<a class="plugnpaid--kmq4f9hl"></a>
<script src="https://plu.ug/n/-kmq4f9hl" onload="inIframe = function(){return
false}; pnp_render_plug()"></script>
</div>

Note that we’ve added:

  • style=“text-align: center”
  • onload=“inIframe = function(){return false}; pnp_render_plug()”.

It will render like:

Clicking on the button, the user will trigger the payment flow modal form.

Once done with the payment, the user can continue with the bot flow by clicking the button:

Edit this page