The Messenger Platform allows you to open a standard webview, where you can load webpages inside Messenger. This lets you offer experiences and features that might be difficult to offer with message bubbles, such as picking products to buy, seats to book, or dates to reserve.
Go to Messenger Bot > Webview menu and you will see all your existing webview form you built so far.
- icon refers webview preview to know how it will look like and to copy webview URL
- icon refers webview report to view form details and submitted form data
- icon refers webview edit
- icon refers webview delete
CREATE NEW WEBVIEW
To create a new webview form simply click Create a new form button. This is a drag and drop form builder. Choose from name, title, page. You choose an optional label and reply template. When people will submit the form they will be assigned to the selected labels and also they will receive the inbox reply.
Design your form easily by dragging the elements you want from the right sidebar. Your form must have a submit button.
HOW TO USE THE WEBVIEW
Click the icon and you can see your webview preview, copy the browser URL, this is the webview URL.
Now it’s time to use this webview in bot settings. Go to Messenger Bot > Bot Settings, create a new bot setting, or edit existing bot settings. Webview works with text with buttons, generic template, carousel & media. Choose button type and choose webview and put the copied URL.
This will how this will look like in bot live action :
When people will click the “Set Order” button the webview will be loaded inside Facebook and it will look like below. After they fill the form they will get the success message as you selected while creating webview.
Click the icon in webview manager and you can see your webview report grouped by the subscriber and clicking the eye icon inside here will pop up the submitted form data in detail.
EXAMPLE USE CASES
- A ticket-search bot can display an interactive stadium seat map for choosing a seat.
- A travel bot can provide travel preferences—aisle vs. window, inn vs. hotel, dietary needs—accessible from the persistent menu.
- A dental-appointment bot can display an interactive calendar for choosing an appointment slot.
- A news bot can provide a multi-select list of topics to subscribe to.
- A commerce or brand bot can offer personal preferences to customize offers and free gifts.