Payments

This guide is for taking payments through a Flow XO chatbot with Stripe. We also have a general Stripe service that you can use to connect your Stripe account to other services that Flow XO supports.

Introduction

The Flow XO payments service makes it easy to request one-off payments or sell products via messaging. Payments are supported through all of our platforms. Currently, we support accepting payments through Stripe, although we may introduce other payment providers in the future.

As long as Stripe is available in your country, you'll be able to accept payments from all over the world.

Getting a Stripe Account

It's easy to get a Stripe account, and there are no setup or subscription fees. You only pay a percentage of the transaction amount every time someone pays you.

Before you set up payments in Flow XO, head over to Stripe to sign up for an account. You also need to activate your account before you can connect it up to Flow XO. This involves filling out a form requesting some basic information about your product, your business, and your own personal relationship to your business.

How Flow XO Payments Work

You'll usually need to set up 2 flows to handle payments:

  1. A 'Request a Payment' or 'Sell a Product' action to prompt the user to begin the payment flow (when the user makes their choice or clicks the pay button, they'll be taken through the checkout).
  2. A 'Receive a Payment' trigger, which starts a flow every time you receive a payment. The trigger has details of the user and the payment, so it's easy to send a message back to the user to confirm the payment, or send yourself an email to fulfil the order.

The second flow is optional, as payments will still successfully complete without it. However, you'll need to find some other way to be alerted to new payments coming in.

Request a Payment (action)

Use 'Request a Payment' where you have a single item to sell, or where you want to request a payment for something other than goods. For example, you may have a flow where you ask some questions and then collect a booking fee to complete the user's application. Or you may ask for a donation if you're a charity.

To add a 'Request a Payment' action to a flow, find the point in the flow where you want to request a payment, and click the '+' button to add an action. You'll see 'Request a Payment' in the list of popular actions under the 'Payments' header.

Here are the options you'll be able to use:

  • Description: This will be shown on the checkout page to describe what the user is paying for (e.g. Booking Fee).
  • Message: This is the message that the user will see above the button/link to make the payment.
  • Currency
  • Price: Use the format 10 or 10.00 (use a period as a decimal place). We will try and coerce any currency format into a price that we can use for the payment. Bear in mind some currencies are non-decimal. 
  • Additional Charges: Use additional charges to add taxes, fees, etc. to the payment. Your user will be presented with a full breakdown when they reach the checkout.
  • (Advanced) Pay Button Text: You can change the default verb that is shown on the pay button in some platforms.
  • (Advanced) Collect Billing Address?: If you select this option, the checkout will collect the user's billing address.
  • (Advanced) Collect Shipping Address?: Optionally collects the user's shipping address.
  • (Advanced) Metadata: Use metadata to pass data through your payment request. It will be saved against the transaction at your payment provider, and will also be sent back to you through the 'Receive a Payment' trigger.
  • Response Path: Used to route the payment request to your user. Normally, you don't need to worry about this, as if your flow starts off with a bot trigger (such as receiving a message), the payment request will automatically be sent to that same user. You can manually specify the response path if you know who you want the request to go to.

Sell a Product (action)

Where you have physical products you want to sell (with images and descriptions), or a small set of products where you need the user to make a choice before making a payment, then 'Sell a Product' is the way to go.

To add a 'Sell a Product' action to a flow, find the point in the flow where you want to offer a set of products, and click the '+' button to add an action. You'll see 'Sell a Product' in the list of popular actions under the 'Payments' header.

Here are the options you'll have:

  • (Product) Product Name: This is used on both the card set of products sent to the user, and on the checkout.
  • (Product) Product Description: The description that is shown against the product on the card set.
  • (Product) Product Image: The image used on the card set of products.
  • (Product) Price: Use the format 10 or 10.00 (use a period as a decimal place). We will try and coerce any currency format into a price that we can use for the payment. Bear in mind some currencies are non-decimal. 
  • (Product) Additional Charges: Use additional charges to add taxes, fees, etc. to the payment. Your user will be presented with a full breakdown when they reach the checkout.
  • (Product) Shortcuts: Add extra shortcuts to each product card. For example, you could have a button that triggers a flow to give the user more information about the product.
  • Currency
  • (Advanced) Buy Button Text: You can change the default verb that is shown on the buy button in some platforms.
  • (Advanced) Collect Billing Address?: If you select this option, the checkout will collect the user's billing address.
  • (Advanced) Collect Shipping Address?: Optionally collects the user's shipping address.
  • (Advanced) Metadata: Use metadata to pass data through your payment request. It will be saved against the transaction at your payment provider, and will also be sent back to you through the 'Receive a Payment' trigger.
  • Response Path: Used to route the payment request to your user. Normally, you don't need to worry about this, as if your flow starts off with a bot trigger (such as receiving a message), the payment request will automatically be sent to that same user. You can manually specify the response path if you know who you want the request to go to.

Receive a Payment (trigger)

It's important to be able to react to a payment. Either to simply thank the user for paying you (a message), add the details of the payment to a spreadsheet or fulfilment system, or even just to send yourself an email so you know you have some work to do.

You can use the 'Receive a Payment' trigger for this. It simply triggers every time a payment is made through either 'Request a Payment' or 'Sell a Product'.

There are many outputs, but they fall broadly into these categories:

  • Bot and user details: Just like when you receive a message through a bot, you'll get all the details you need to identify the user and bot. That way, you can easily send messages or ask questions in the flow.
  • Payment details: You'll also get outputs that tell you what the user paid for, how much they paid, the transaction ID from your payment provider, etc. If you provided metadata on the 'Request a Payment' or 'Sell a Product' actions, you'll get that too.

Obtaining Permission from Facebook

Facebook do allow global payments through Stripe in their 'webview' (a checkout that opens up within the messaging flow, rather than a separate browser window), however you will need to apply for permission to use this feature, before you start taking live payments.

This is usually quite quick and only requires some minimal information. To apply now, complete Facebook's approval form.

The form will ask for a 'URL that redirects to your payment flow'. To get this, create your payment flow in Flow XO (hide it for now!), and run it for yourself. Click on any of your payment buttons/links, and give the URL of the checkout page to Facebook. You'll need to leave this flow switched on, but keep it hidden until you get approval.

If you have any problems obtaining permission, please contact the support team.

Platform Support

Payments work across all the platforms we support. However, there are some differences that you should bear in mind:

  • Payment requests and product card sets look slightly different in each channel. For example, as Twilio SMS is text only, links are shown in place of buttons.
  • The checkout will either open up in a 'webview' (a browser view within the messaging app), or as a new browser window, depending on the platform and device. For example, payment requests within Facebook Messenger on mobile open in a webview, whereas a new browser tab opens when using Messenger on desktop.
  • Regardless of the platform, the look and feel of the checkout itself is exactly the same.

Still need help? Contact Us Contact Us