This article explains how you can embed the FRANK widget on your Wix website. This doesn't require any coding skills, it's just a matter of pasting a code onto your website.
Setting up your widget in FRANK
Before you embed the code onto your website, make sure the widget is set to your liking. First, make sure the widget buttons are set to the color of your brand:
In FRANK, go to Settings → Restaurant
At color, select the color you'd like for the widget's buttons
Next, make sure the widget is configured to your preference (e.g. do you want it to stay closed when someone enters your website or open right away?)
Configuring the widget to your preference
Go to Settings → Widget
On this page, you can configure the widget and generate the widget code that you need to add to your Wix website.
What things can you customize?
Underneath widget options, you can customize the following:
Choose whether the widget opens automatically when the page loads
Choose whether the widget opens automatically on mobile devices when the page loads
Choose whether you want to hide the widget toolbar on the page
Choose whether you want to hide the widget toolbar on mobile devices
Choose the widget language
Set the text that appears for unavailable time slots
Embed the FRANK widget code on your website
Once you have set the widget to your liking, your adjustments are automatically copied into the code on the widget page. Therefore it's important to first customize your widget and only once you've done that copy the code.
Click on copy code
Login into your Wix website
Select the website on which you want to place the widget
In Wix, go to Settings → Development & Integrations → Custom code
Click Add Custom Code at the top right
Now paste the code you from the FRANK widget page
Name your code so you can easily recognize it (we recommend just calling it FRANK like in the example above).
The code will automatically be added to all pages, adjust if necessary (for example, if you are a hotel and have one dedicated page on your website for your restaurant, you might not want to load it on all pages).
For the place code, leave it on Head
Click apply to save
Open your website to test if everything works properly and if yes, you're good to go!
Opening the FRANK widget via a button with anchor links
It is also possible to open the widget when a button is clicked on your website.
Besides embedding the FRANK widget on your website, you can also open the widget using buttons or links on your website. This is done using anchor links.
Anchor links allow you to trigger specific actions in the widget, such as opening the reservation screen or the gift voucher module.
Below you will find the available anchors and how to use them. You can also find this in FRANK → Widget → Widget anchors
Open the widget via a button
Use the following anchor to open the FRANK widget:
Close the widget via a button
Use the following anchor to close the FRANK widget:
Open the gift voucher shop via a button
Use the following code the open the FRANK gift voucher shop:
Open the widget for a specific restaurant by using the restaurant uuid.
This is especially handy if you have multiple locations.
Your restaurant's widget anchor is unique and needs to be copied directly from the FRANK widget paste, look for the code that looks like this:
Where to paste the widget anchors in Wix:
In Wix, go to Edit site
Select the button for which you want to enable any of the actions above
Click the 🔗 icon
At web address, paste any of the codes above that is applicable
Most of the time, you'll want to open it in the current window