If you already use Booxi on your website, you may be wondering why you should integrate booking directly into your mobile app. The answer is simple: your app users expect a smooth, in-app experience without being redirected to a browser. By embedding booking inside your app, you ensure a consistent brand experience, faster performance, and stronger customer engagement.
You can integrate Booxi into your mobile app in any of the following ways: WebView, JavaScript, or API integration. Each option offers different levels of customization and effort, so you can choose the one that best fits your needs.
Integration Comparison at a Glance
Feature | Effort | Best For | UX Feel |
WebView | Low (Fastest) | Quickest setup | Web-in-app |
JavaScript Widget | Medium | Hybrid frameworks | Semi-native |
API Integration | High | Fully native control | Fully native |
Option 1: WebView
The fastest way to integrate Booxi into your app is by using a WebView. A WebView is like a mini browser inside your app that loads your Booxi booking page.
How to Implement:
Set the WebView's URL: Set the WebView's URL to a landing page where the user will interact with the booking widget. This can be done easily using Booxi's code generator; follow the steps outlined here.
Auto-Open the Widget (optional): For a smooth user experience, it is usually best to make sure the booking widget opens automatically upon page visit; see here for instructions.
Pass Parameters (optional): You can configure the widget by passing certain parameters in the URL (e.g. preselecting a service or specific locations); see here for instructions.
Pre-fill Client Info (optional): To make the experience even better, you can set up the widget so the client information step is skipped. This is done by pre-filling values from client information you already have in your app; see here for details.
To accomplish this, you must pass the client info in the landing page URL for it to be passed to the widget. You will need to encode the client object; Booxi recommends using base64 encoding and then decoding it in your landing page.
*Note: Make sure to be aware of the notes mentioned here.
Option 2: JavaScript Widget
If your mobile app is built with hybrid frameworks like React Native, Ionic, or Cordova, you can embed Booxi’s booking widget the same way you would on a website.
How it works: You insert the Booxi JavaScript widget into your app so customers can book directly inside the app. For more information, see here.
Option 3: API Integration
For the most advanced integration, you can use the Booxi API to build a fully customized booking experience inside your app.
How it works: You call the Booxi API to fetch services, staff availability, and booking details, then display that data using your app’s own native interface. For more information, see here.
Why choose this option: * You get complete control over the design and flow, so the booking process feels seamless and matches your brand perfectly.
What to keep in mind: This option requires more development effort and technical resources. You must also be on the Standard or Custom plan.
Choosing the Right Option
If you need something quick and easy, go with WebView.
If your app is built with hybrid technologies, use the JavaScript widget.
If you want a fully native experience with maximum control, use the API.