“Appointment Scheduling” built for Webflow how-to

Published May 20th, 2021 by   Nicolas Zenker

Easily embed an appointment scheduling form (also known as an appointment booking form or a booking widget) on your Webflow website. This is a great way to let your users easily schedule an appointment or a meeting with you.

Highlighted features:

  • Your users can schedule a meeting with you without ever leaving your Webflow website
  • Letting users book directly can boost conversions for sales calls, demo calls, initial consultations and more – make sure every lead turns into a customer
  • By showing your live booking calendar directly on your website, you can let users find a time that works for them and you will eliminate endless email threads and phone calls trying to find a time that works for everyone
  • Customize the booking form to ask questions – this lets you collect the information you need so you can prepare in advance of your meetings
  • Automated reminders are a great way to ensure that users don’t forget about your scheduled appointment

Follow these 6 simple steps to embed an appointment scheduling widget on your Webflow website.

  1. Sign up for AppointmentThing.com
    Go to AppointmentThing.com and click “Sign up”. There’s a free two-week trial of the Pro Plan available when you sign up (with no credit card required), and when that’s over, you can keep using the free plan forever.
  2. Set up the Appointment Types you want to offer and the times you are available
    Within the scheduling app, you can set different appointment types for different services you offer or you could just offer customers a choice of meeting lengths. You can also offer just one appointment type if you want to keep it really simple.
    • Navigate to the ‘Appointment Types’ page on AppointmentThing.com

    • Create a new “Appointment Type” (or select one of your existing “Appointment Types”).
    • Enter your appointment details in the “About” tab, and set your appointment availability in the “Availability” tab.
    • When you’ve created the appointment type, navigate back to the “Appointment Types”.
  3. Copy the link or embed code to your booking page
    Copy your link or embed code to your general appointment booking page if you want to offer more than one appointment type, or to a specific appointment type otherwise.
    • Click the “Embed” icon as shown in the image below

    • You will now see a new window. Select the “Inline Embed” option. Select the Appointment Types you want to embed on your Wix website, and copy the widget code.

  4. Paste your code into the Webflow website editor.
    Log into your account on webflow.com (or click signup if you don’t already have a Webflow account). Open the Webflow site designer and click the “+” icon in the top left hand corner. Scroll down to the “Components” section and choose “Embed” from the options. Drag the embed block into the page and the element will appear on your website. You can drag the element to where it needs to go. Once you have the embed added, paste the code you copied earlier from AppointmentThing.

  5. Make sure it looks good
    The last thing to do is to preview the site to make sure it all looks good. If there are scroll bars showing, just resize the area of the embed to make sure it fits. Be sure to check the preview on mobile view also to make sure it still looks good!
  6. You’re good to go!
    Your embeddable appointment booking form is now set up and your users can start scheduling appointments with you right from your Webflow website!

Use a website builder other than Webflow where you want to offer online scheduling? AppointmentThing also integrates with most popular website builders like Leadpages, Squarespace, WordPress, Weebly, Jimdo, Wix and more.

Try our beautiful embeddable “Appointment Scheduling” form for Webflow

AppointmentThing makes it easy for your clients to schedule appointments with you whether you are scheduling appointments from your Webflow website, via email or your social media profiles. Save time for everyone and say goodbye to back-and-forth emails. Your clients and leads can easily view your real-time calendar availability and book appointments for themselves from your own unique appointment scheduling page.

Connect your calendar to sync your availability and ensure that you offer appointments only when you’re free (works with Google Calendar, Apple Calendar and Outlook calendar/Office 365). Add your appointment scheduling link to your email signature, your social media accounts like Facebook, Instagram, Twitter and LinkedIn and, most importantly, to your Webflow site.

AppointmentThing is the best free online appointment scheduling software available today. We offer a beautifully designed app and booking pages along with powerful online booking functionality that makes your life easier including meeting buffers that give you time to prepare and automated reminders (including both email and SMS reminders) that improve customer and client communication and ensure that missed appointments are a thing of the past. We offer unlimited appointments on our free plan and if you upgrade to you can unlock some great features like connecting multiple calendars and payment processing via Stripe or PayPal.