WIDGET TUTORIAL

Make scheduling even easier
β€” from your website.

Add your Schedulicity booking page into your website for faster scheduling your clients will love.

Let’s get started.

1. Pick what you’d like on your website.

You can choose from two types of widgets (or use both!). If you want to see what they look like live, we have an example for you!

  • Schedule Now button: This button will bring your clients from your site, to your booking page on Schedulicity.

  • Scheduling widget: Put your booking process directly into your website.

2. Once you’ve picked which widget you’d like to use, you’ll need to grab the code for your website.

  1. Navigate to the Marketing section of your account and click on the Widgets tile.
  2. Pick from the two types of widgets:
    1. Schedule Now button: Choose the size and color of the button you’d like to use.
    2. Scheduling widget: Choose between the Embedded widget to add a section built right into the page, or the Overlay widget that hovers on the right edge of the page and triggers a pop-up booking screen.
  3. After picking the widget you want to use, copy the code generated below, and paste it into the body section of your website (with the help we provide below!)

3. To put the code into your site, tell us which web host you use.

We have tailored instructions for each site for the best help possible.

WordPress  Squarespace  Wix

 

WordPress Widgets

Schedule Now Button

1

In your WordPress editor, navigate to the page you want to add your Schedule Now button. Click on the “+” button on the upper left.

2

Find and click on “Custom HTML” to input an HTML field on your page.

3

Paste your button code (found in your Schedulicity account, instructions above) and click “Publish” or “Update” to save your changes.

4

Voila! When you view your page, you’ll see your new, working Schedule Now button!

Scheduling Widget

1

In your WordPress editor, navigate to the page you want to add your booking window. Click on the “+” button on the upper left.

2

Find and click on “Custom HTML” to input an HTML field on your page.

3

Paste your booking window code (found in your Schedulicity account, instructions above) and click “Publish” or “Update” to save your changes.

4

Voila! Your clients can now book with you without leaving your website.

 

Squarespace Widgets

Schedule Now Button

1

In your Squarespace editor, navigate to “Pages” in your left menu.

2

Click on the page you’d like to place your booking button. Click “Edit”.

3

Find the space you want to add your button and click on the black marker.

4

Scroll to “More” and click on “Code” to add your button code.

5

Paste your booking widget code from your account (see above how to snag this code), and hit “Apply”. Don’t forget to save your page changes – then your Schedule Now button will be live!

Scheduling Widget

1

 

In your Squarespace editor, navigate to “Pages” in your left menu.

2

Click on the page you’d like to place your booking window. Click “Edit”.

3

Find the space you want to add your booking window and click on the black marker.

4

Scroll to “More” and click on “Code” to add your booking widget.

5

Paste your booking widget code from your account (see above how to snag this code), and hit “Apply”.

6

Once you have your code added to your page, be sure to save your changes. (You won’t see the booking widget active in the edit mode).

7

Voila! Your booking widget is now live on your Squarespace site!

 

Wix Widgets

Schedule Now Button

1

In your Wix editor, navigate to the page and section you want to add the Schedule Now button and click the “+” button.

2

Navigate to “More” and click on “HTML iframe”.

3

Click “Enter Code” and paste the button code from your Schedulicity account (instructions at the top of this page). Click “Apply”.

4

Be sure to click “Publish” to make your new button live!

Scheduling Widget

1

Navigate to the page and section you want to add your booking window and click the “+” button.

2

Navigate to “More” and click on “HTML iframe”.

3

Click “Enter Code” and paste the button code from your Schedulicity account (instructions at the top of this page). Click “Apply”.

4

Be sure to “Publish” your page changes. Your new booking window will be live on your site!