Implementing Xola buttons in Wix is quite simple. Here, you'll find step-by-step instructions on how to integrate Xola on your Wix website.
-
In your Wix account, the first thing you will have to do is install the Xola checkout javascript code into the header of your site. You can do this by navigating to Settings > Custom Code > Add New Custom Code.
- Locate the Xola Checkout Javascript in your Xola account by navigating to Settings > Button Code and copying the code found in Step 1.
-
Installing this code into your site's header will ensure that the button functions correctly when you load the site and that it doesn't redirect to a different tab/window. Please reference the following screenshots to properly add Xola Checkout Javascript into the Wix Custom Code settings.
-
From the Wix Dashboard, Click ‘Site & App’. This will take you to the page where you can launch another window to edit the site by clicking 'Edit Site' in the top right corner.
-
Navigate to the page you would like to edit, click the plus sign in the toolbar to the left, and select ‘Button’ as the element type among the list that populates. Drag the element to the desired area on the page.
- Retrieve the booking URL from your Xola account. To do this, navigate to Settings > Button Code. Under Step 2, select 'URL' as the checkout type. Under Step 3, find the button you would like to link to and click the copy button as shown in the image below.
- In Wix, click on the button you added to the page in Step 5 of this article and click on the link icon that populates among the options shown. Ensure to select 'Web address' on the left, paste the URL (this URL should begin with 'https://checkout.xola.com...') in the empty field shown, and ensure to select 'Current window' under the 'How does it open? section.
- You have now added a Xola checkout button to your Wix webpage! More information about Wix buttons can be found here.