Embedding on Wix

This is a guide on how to embed your AppointmentThing booking calendar into a Wix site. Clients can then easily make appointments with you from the comfort of their browser.

Copying the page link from AppointmentThing

Log in to AppointmentThing and click on the "My Appointments" link in the header.

On the next screen, click on "Appointment Types" in the left-hand sidebar:

On one of the listed appointment types, click the Copy Link icon:

Log in to your Wix site. From the Dashboard, under "Site Actions", choose "Edit Site".

(Note: For those using Firefox, Wix has been reporting errors with accessing the editor. If you encounter these errors we suggest that you use another browser such as Chrome or Safari.)

Your website editor will then launch in a new tab. On the next page, move your mouse to the area you wish to place your AppointmentThing page, and click the "plus" button.

In the "Add Section" sidebar, choose "HTML Embed"

Next, you will be given several layout choices for your new section. Click and drag the layout of your choice to the section in the main window labeled "DRAG HERE". (Note: we recommend a layout that allows the full width of the section for the embed, such as the one pictured below.)

Now, in the sidebar you will see settings for your HTML block. Input values for the display name in your site's menu, the title and subtitle for your embed, and the descriptive text. Below those fields you will see an "HTML settings" button. Click this to continue to the next step.

Under "Embed Type", choose "Website".

In the input labeled "PASTE WEBSITE ADDRESS", paste in the URL that you copied from AppointmentThing. You will see the appointment booking interface load in the preview on the right. Use the width and height sliders in the sidebar to adjust the size of the embed until it fits in the new section.

Now we're going to adjust the site for mobile views. At the top of the window, hover over the monitor icon, and in the menu that appears, choose "Mobile".

In the mobile preview, scroll down until you see your AppointmentThing embed. Click on it and choose "Edit".

In the sidebar, click on "Settings". (Note: you will not be able to edit the Title, Subtitle, and Paragraph at this point, but you may change them in the Desktop editor.)

Using the height slider in the sidebar, adjust the height of the embedded page until there is no longer a vertical scrollbar visible next to it. (Don't worry about any horizontal scrollbar you may see - Wix's mobile "preview" does not reflect the width that you will see on your mobile device.)

Click the "Preview" button in the top menu in order to preview your site in mobile and in desktop (use the icon in the top bar to change between the views.) If you need to make any adjustments, click "Edit Site" in the top bar. Once you are satisfied with the appearance of your embed, click "Publish" and your new AppointmentThing booking embed will be LIVE!