---
title: "Scheduling Pro scheduler installation guide"
slug: "scheduling-pro-scheduler-installation-guide"
updated: 2026-10-15T01:24:36Z
published: 2026-10-15T01:24:36Z
canonical: "help.servicetitan.com/scheduling-pro-scheduler-installation-guide"
---

> ## Documentation Index
> Fetch the complete documentation index at: https://help.servicetitan.com/llms.txt
> Use this file to discover all available pages before exploring further.

# Scheduling Pro scheduler installation guide

## Overview

Learn how to install the Scheduling Pro scheduler to your website with Wix or Duda.

## 

---

### 

#### Who uses this feature

- Administrators, office employees, marketing managers, accountants, and web developers
- Primarily benefits Residential Service

#### Feature configuration

- To get started with Scheduling Pro, request a demo on our [Pro Products page](https://www.servicetitan.com/features/pro), or reach out to your Customer Success Manager (CSM) or Pro Account Manager.

## Scheduling Pro website installation overview

After you complete Onboarding for Scheduling Pro, you receive your code and directions for how to install it on your website. You need to insert code into the code of your website for the scheduler to appear. You should send these instructions to your web team or whoever helped you set up your website. You also need access to make edits to your site in order to properly install.

To add the scheduler to your website:

1. Copy and paste the script given into your website <body />. This gives you access to the _scheduler object.
2. Activate your CTA (Call-to-Action).
3. You can use two different methods to call the scheduler on your website with a button. The positioning and styling of the button is up to you or your team. These instructions provide an example of a generic CTA and how to code it.
  1. Copy and paste the following <button> onto your page and position/style as needed. You can use an existing button as long as it has the onclick attribute below added to the code. <button onclick="_scheduler.show({ schedulerId: 'sched_"{PROVIDED TO YOU IN SELF-ONBOARDING})" type="button" > Book Now! </button>
  2. Apply the st-booking-show class to any HTML element on your web page and position/style as needed. You can use an existing button as long as it has the class attribute below added to the code. <button class="st-booking-show" type="button"> Book Now! </button>

> [!NOTE]
> **Note:** This method only calls the default scheduler on your account. If you are creating multiple schedulers for different pages or uses, we recommend using the first option to call a specific scheduler.
4. Publish your website. You should now be able to access Scheduling Pro from your page by clicking your CTA or accessing it with a direct link.

## Option 3: Install scheduler with Wix

1. Make sure your site is connected to an active domain (e.g. www.companyname.com).
2. In your Wix Dashboard, go to **Settings > Advanced > Custom Code. ![Settings menu showing options for custom code and communication preferences.](https://cdn.document360.io/961862ab-d0f2-4d91-bb62-a62ee8184eff/Images/Documentation/scheduling-pro-scheduler-installation-guide-image-n7fncafz.png?sv=2026-02-06&spr=https&st=2026-10-31T01%3A41%3A22Z&se=2026-10-31T02%3A41%3A22Z&sr=c&sp=r&sig=8%2F3xv7A%2F65m88HM24p2rnYTQUte%2F9XaaMb0ogFDvXiA%3D)**
3. Click **Add Custom Code**.
4. Copy and paste your scheduler code from self-onboarding into the *Paste the code snippet here* section. This code should look something like this: <script data-api-key="{PROVIDED TO YOU IN SELF-ONBOARDING}" data-schedulerid="{PROVIDED TO YOU IN SELF-ONBOARDING}" defer id="se-widget-embed" src="https://embed.scheduler.servicetitan.com/scheduler-v1.js" ></script>

> [!NOTE]
> **Note:** You can add `data-auto-open="true"` to this script to automatically open the scheduler on page load.
5. Select a name for this custom code that you can easily remember like *Scheduling Pro Main Script* or something similar.
6. In the *Add Code to Pages* section, we recommend selecting **All Pages** and **Load code on each new page**. This allows you to easily add the *Scheduling Pro* script to other areas of your website later.
7. In the *Place Code in* section, we recommend that you select **Body - end**.
8. When finished, click **Apply** to save your changes. ![Interface for adding custom code snippets to website pages with various settings options.](https://cdn.document360.io/961862ab-d0f2-4d91-bb62-a62ee8184eff/Images/Documentation/scheduling-pro-scheduler-installation-guide-image-mrhxnjba.png?sv=2026-02-06&spr=https&st=2026-10-31T01%3A41%3A22Z&se=2026-10-31T02%3A41%3A22Z&sr=c&sp=r&sig=8%2F3xv7A%2F65m88HM24p2rnYTQUte%2F9XaaMb0ogFDvXiA%3D)The *Custom Code* page opens.
9. Ensure the **Scheduling Pro Main Script** toggle is turned on.
10. Go to **Home > Edit Site**. The *Wix Website Editor* opens.
11. Click **Add Elements** and select any button.

> [!NOTE]
> **Note:** You can customize, resize, and place that button wherever you want on your site. You can also create multiple buttons on the page.
12. Take note of the ID for this button.
13. Save your changes and publish your website.
14. Visit your website, right-click the button you created, and click **Inspect**.
15. A few lines above the button’s code should read something similar to: <div id="unique-button-id" class="unique-button-id"
16. Copy the listed button ID.
17. From the *Custom Code* screen, click **Add Custom Code** again.
18. Copy and paste the following script into the *Paste the code snippet here* section, adding in the button ID you copied earlier:

> [!NOTE]
> **Note:** You can add multiple button IDs here where the unique-button-id is added by separating the button IDs with a comma:

[“unique-button-id-1”, “unique-button-id-2”]. <script> !(function (n) { function e() { document.addEventListener('click', function (e) { !!n.find(function (n) { return e.target.closest('#' + n); }) && _scheduler.show(); }); } document.body && 'loading' !== document.readyState ? e() : document.addEventListener('DOMContentLoaded', e); })( ["unique-button-id"], ); </script>
19. Select and enter a name for this piece of custom code like *Scheduling Pro Button Script*.
20. From *Add Code to Pages*, we recommend selecting **All Pages** and **Load code on each new page**. This allows you to easily add the Scheduling Pro script to other areas of your website later. This should match what you did for the main script.
21. From *Place Code in*, we recommend selecting **Body - end**. This should match what you did for the main script.
22. Click **Apply** to save your changes.

Ensure the toggle on this custom code is enabled and the scheduler should now open on your website.

If you are still having issues, make sure that both pieces of code are added correctly, they are both enabled, your button ID, scheduler ID and API key are correct, and make sure that your site is whitelisted in Scheduling Pro self-onboarding under *Scheduler Details*. We recommend including both example.com and www.example.com versions on your whitelisted websites. If your issue persists, please reach out to the Scheduling Pro support team at [schedulingpro@servicetitan.com](mailto:schedulingpro@servicetitan.com).

## Option 6: Install scheduler with Duda

1. Ensure your website is connected to an active domain like www.companyname.com.
2. In your Duda Dashboard on the *Sites* screen, find the website you would like to edit.
3. Click **Edit** to enter the Duda Site Editor. ![Site list interface showing published site and options for management and integration.](https://cdn.document360.io/961862ab-d0f2-4d91-bb62-a62ee8184eff/Images/Documentation/scheduling-pro-scheduler-installation-guide-image-r6ss7sfx.png?sv=2026-02-06&spr=https&st=2026-10-31T01%3A41%3A22Z&se=2026-10-31T02%3A41%3A22Z&sr=c&sp=r&sig=8%2F3xv7A%2F65m88HM24p2rnYTQUte%2F9XaaMb0ogFDvXiA%3D)
4. Identify the *body* section of your page, right-click it, and select **Edit HTML/CSS**.
5. Copy and paste your first snippet of scheduler code from self-onboarding anywhere into the body. This code should look something like this:
6. Create a button/CTA to launch your scheduler from **Widgets > Button** and place it on your website.
7. Right-click the button and select **Edit HTML/CSS.** ![HTML code snippet showing plumbing service information and scheduling options.](https://cdn.document360.io/961862ab-d0f2-4d91-bb62-a62ee8184eff/Images/Documentation/scheduling-pro-scheduler-installation-guide-image-m3m2sjof.png?sv=2026-02-06&spr=https&st=2026-10-31T01%3A41%3A22Z&se=2026-10-31T02%3A41%3A22Z&sr=c&sp=r&sig=8%2F3xv7A%2F65m88HM24p2rnYTQUte%2F9XaaMb0ogFDvXiA%3D)
8. Modify the button to include the appropriate onclick from the second snippet of scheduler code from self-onboarding, which should look something like this:
9. When you finish styling and positioning your button, click **Publish** or **Republish**.

> [!NOTE]
> **Note**: You can add `data-auto-open="true"` to this script to automatically open the scheduler on page load.

The scheduler should now open on your site.

If you are still having issues, make sure that both pieces of code are added correctly, your scheduler ID and API key are correct, and make sure that your site is whitelisted in Scheduling Pro self-onboarding under *Scheduler Details*. It’s recommended to include both example.com and www.example.com versions on your whitelisted websites. If your issue persists, please reach out to the Scheduling Pro support team at [schedulingpro@servicetitan.com](mailto:schedulingpro@servicetitan.com).