--- title: Weebly description: Integrate Xola's booking buttons into your Weebly site for seamless reservations. Follow simple steps to add the button code and enable customers to book directly from your website, enhancing user experience and boosting conversions. --- [Skip to content](https://support.xola.com/weebly#main-content) English Show submenu for translations [![Xola](https://support.xola.com/hubfs/logo.svg)](https://www.xola.com/) - [Home](https://support.xola.com/) - [24/7 Live Support](https://www.xola.com/support/) Open main navigation Close main navigation - [Home](https://support.xola.com/) - [24/7 Live Support](https://www.xola.com/support/) - English Show submenu for translations - [Login](https://xola.com/_public/login.html) [Login](https://xola.com/_public/login.html) How can we help you? - There are no suggestions because the search field is empty. 1. [Help Center](https://support.xola.com/?hsLang=en) 2. [Getting Started](https://support.xola.com/getting-started?hsLang=en) 3. [Website Integration & Installation](https://support.xola.com/getting-started?hsLang=en#website-integration-installation) # Weebly ## Easily add booking buttons to your Weebly site Adding **Xola “Book Now” buttons** to your **Weebly site** is **quick and easy**, providing a great way to allow your visitors to **reserve experiences directly** from your website. This guide walks you through each step—from **installing the necessary JavaScript** to **placing buttons** on your desired pages—ensuring a seamless booking experience that keeps customers engaged and ready to book. **User Access:** **Administrator** or **Marketer** roles have access to set up and manage Buttons in Xola. To **grant access** to users, [click here](https://seller.xola.app/settings/users). --- **What's covered in this article:** - [Step 1: Add Xola’s Global JavaScript to Your Site](https://support.xola.com/weebly#step-1) - [Step 2: Copy Your Xola Checkout Button Code](https://support.xola.com/weebly#step-2) - [Step 3: Add the Button Code to a Weebly Page](https://support.xola.com/weebly#step-3) --- ### Step 1: Add Xola’s Global JavaScript to Your Site To make sure your buttons function properly, you’ll first need to install Xola’s JavaScript snippet in your Weebly site’s header. - Log into your **Weebly account**. - From the top navigation, click **Settings**. ![26323130965147](https://support.xola.com/hs-fs/hubfs/Knowledge%20Base%20Import/26323130965147.jpg?width=670&height=340&name=26323130965147.jpg) - In the left-hand menu, select **SEO**. ![2](https://support.xola.com/hs-fs/hubfs/Imported%20sitepage%20images/2.png?width=566&height=463&name=2.png) - Log into your Xola account. - Go to **[Settings \> Button Code](https://seller.xola.app/settings/buttons).** - Under **Step 1**, use the  ![37502050859163](https://support.xola.com/hs-fs/hubfs/Imported%20sitepage%20images/37502050859163.png?width=29&height=22&name=37502050859163.png) icon to copy the JavaScript code.  ![37504281283739](https://support.xola.com/hs-fs/hubfs/Imported%20sitepage%20images/37504281283739.png?width=670&height=455&name=37504281283739.png) - Return to Weebly, and paste this code into the **Header Code** box. - Click **Save** in the lower right corner. ![4](https://support.xola.com/hs-fs/hubfs/Imported%20sitepage%20images/4.png?width=670&height=206&name=4.png) --- ### Step 2: Copy Your Xola Checkout Button Code Next, let’s grab the button HTML you’ll be embedding on your page: - Back in your Xola account, navigate to **[Settings \> Button Code](https://seller.xola.app/settings/buttons)**. - In **Step 2**, choose the checkout type that works best for you. - Scroll to **Step 4**, and find the experience you want to link. - Click the  ![37502050859163](https://support.xola.com/hs-fs/hubfs/Imported%20sitepage%20images/37502050859163.png?width=29&height=22&name=37502050859163.png) icon to copy the button HTML code to add to your site. ![28277824483739](https://support.xola.com/hs-fs/hubfs/Knowledge%20Base%20Import/28277824483739.png?width=670&height=690&name=28277824483739.png) **Need help picking the right checkout type? **Check out our [Xola Checkout Types](https://support.xola.com/button-installation?hsLang=en) guide to see which option fits your business best. --- ### Step 3: Add the Button Code to a Weebly Page With your JavaScript in place and button code copied, you’re ready to add a button to your site: - Go back to your **Weebly Dashboard**. - Click **Edit Site** to launch the site editor. - Navigate to the page where you want the Xola button to appear. - From the left-hand toolbar, select **Embed Code** and drag it to the spot where you'd like the button to go. ![26323030374811](https://support.xola.com/hs-fs/hubfs/Knowledge%20Base%20Import/26323030374811.jpg?width=670&height=340&name=26323030374811.jpg) - Once the module is on the page, click the text that says **Click to set custom HTML**. - Then click **Edit Custom HTML**. - Paste your Xola button HTML into the box. - Click **Publish** in the top right-hand corner of the Weebly editor. **Note:** The button may appear blank in the editor, but don’t worry, it will display correctly once the page is published. - [Getting Started](https://support.xola.com/getting-started?hsLang=en#main-content) - [Account Setup & Configuration](https://support.xola.com/getting-started?hsLang=en#account-setup-configuration) - [Website Integration & Installation](https://support.xola.com/getting-started?hsLang=en#website-integration-installation) - [Flex Plans](https://support.xola.com/getting-started?hsLang=en#flex-plans) - [Managing Purchases & Customers](https://support.xola.com/managing-purchases-customers?hsLang=en#main-content) - [Purchases Management](https://support.xola.com/managing-purchases-customers?hsLang=en#purchases-management) - [Reservation Management](https://support.xola.com/managing-purchases-customers?hsLang=en#reservation-management) - [Customer Management](https://support.xola.com/managing-purchases-customers?hsLang=en#customer-management) - [Customer Data & Engagement](https://support.xola.com/managing-purchases-customers?hsLang=en#customer-data-engagement) - [Reporting](https://support.xola.com/reporting?hsLang=en) - [Integrations & Advanced Tools](https://support.xola.com/integrations-advanced-tools?hsLang=en#main-content) - [Xola App Store Integrations](https://support.xola.com/integrations-advanced-tools?hsLang=en#xola-app-store-integrations) - [Partner & Agent Management](https://support.xola.com/integrations-advanced-tools?hsLang=en#partner-agent-management) - [Marketing & Tracking Integrations](https://support.xola.com/integrations-advanced-tools?hsLang=en#marketing-tracking-integrations) - [Mobile and Hardware](https://support.xola.com/mobile-and-hardware?hsLang=en#main-content) - [Mobile Tools and Apps](https://support.xola.com/mobile-and-hardware?hsLang=en#mobile-tools-and-apps) - [Hardware Setup & Devices](https://support.xola.com/mobile-and-hardware?hsLang=en#hardware-setup-devices) - Company - [About Us](https://www.xola.com/about) - [Careers](https://www.xola.com/team) - [Press](https://www.xola.com/press) - [Support](https://www.xola.com/support) - [Security Policy](https://www.xola.com/security-policy/) - Resources - [Articles](https://www.xola.com/articles/) - [Help Center](https://support.xola.com/) - [Success Stories](https://www.xola.com/success-stories/) - [App Store](https://www.xola.com/app-store) - [Demo](https://www.xola.com/demo) - [Xola Universe](https://www.xola.com/universe/) - Documentation - [API Documentation](https://developers.xola.com/) - [Payment Services Agreement](https://www.xola.com/payment-services-agreement/) - [Terms](https://www.xola.com/terms/) [![logo](https://support.xola.com/hubfs/logo.svg "logo")](https://www.xola.com/) © 2026 Xola Inc. All rights reserved. [Privacy Policy](https://www.xola.com/privacy-policy)     [Terms of Service](https://www.xola.com/terms)