A Simple Guide to Designing Your Appointment Scheduling Website on Zoho Bookings

A Simple Guide to Designing Your Appointment Scheduling Website on Zoho Bookings

Hey everyone!

My name is Akarsh, an intern at Zoho and I hope that you are safe and sound during these testing times. I will regularly be posting about booking pages in this community page and I am looking forward to helping you out in creating some great booking pages that you can use to showcase your business. If you have any doubts or clarifications regarding this guide, feel free to comment below. So, let us get started!

If you are interested in reading more articles like these, click here.

Why do you need a good-looking scheduling website?



Your appointment scheduling page is a critical part of your organisation’s image. Most studies have shown that a great online experience instils a sense of trustworthiness and confidence in your customer’s decision of doing business with you. Hence, it is crucial that you offer a good-looking and convenient appointment booking experience to your clientele so that you can have more people wanting to do business with you from initial impressions alone. In this guide, we are going to show you how to do so effectively with minimal time and effort. So, put on your creative hats and let us begin!


Imagining your appointment scheduling page

When you started thinking about your appointment scheduling page, how did you imagine it in your mind? Getting at least a vague image of what your result should be the first step that you are going to take. If you have seen a appointment scheduling page anywhere in the past that impressed you, you may draw references to it while imagining your own page. In case you are finding it hard to do so, try looking around the internet to get inspiration from what others have done. Check out other appointment scheduling websites, landing pages, websites and other sources that give you some clarity and inspiration on what direction you should be heading in when you are designing your scheduling page. Try to carefully analyze the elements in these websites to look for signature characteristics that are used extensively in your industry. For example, you are far more likely to see colors like sky blue and grass green in the spa industry as compared to colors like black and red because the former ones are far more peaceful and calmer to human eyes. Once you have an idea on how your page should look like, from hereon, everything that you read should help you lead to that as a result.


Picking the right tool for the job

For this guide, we are going to use just the on-board customization options for designing the appointment scheduling page. This way, we can keep the whole process simple and quick with minimal effort. The customization options that are present in Zoho Bookings can transform the look of your appointment scheduling page if done right.
Now, where are these customization options that we are talking about? If you are on the home page of Zoho Bookings, navigate to the workspace settings page by clicking on the gear icon on the top right corner that says Manage Business. Click on the Workspaces option on the left pane after which, you should click on the workspace for which you want to design the appointment scheduling page. Scroll to the bottom of all options that are available and click on the Booking Page Settings to get started on our process.



On the right half of the page, you will see that the options given are divided into two sections: Header Options and Footer Options. Like the names infer, you will be able to edit the elements that are present in the header and footer of your appointment scheduling page. Here is what each of them mean:

Header Elements: Logo - This is the top left corner of the page where your company logo goes. Ensure that you upload a PNG version of your logo in which the background is transparent. This gives a professional look to the logo on your page.
Header Elements: Title - The text right next to the company logo is the title which can be edited to say either your company name or any other text of your liking.
Footer Elements: Contact Number – The contact number that you need your customers can use to contact you goes here, on the page footer.
Footer Elements: Email Address – Same as the contact number, give your email address to through which your customers can reach out to you.
Footer Elements: Facebook – Your Facebook tag goes in here. Your tag comes in after https://www.facebook.com/ on your Facebook URL.
Footer Elements: Twitter – Likewise with Twitter. Your tag comes in after https://twitter.com/ on your Twitter URL.
Footer Elements: Instagram – Just like Facebook and Twitter. Your tag comes in after https://twitter.com/ on your Instagram URL.
Let us go over the Booking Page Themes next.



You have 4 options to pick a theme for your page. The Default and Modern Web templates let you customize further than just picking the style from the theme with options to change the color scheme, which we will go over in a short while. The Classic and Fresh themes do not offer any options to customize their color schemes and are perfect for those who just want a simple theme for their appointment scheduling page without having to spend too much time tweaking it.
Like we had mentioned earlier, the Default and Modern Web offer customizability in terms of the color schemes that they can portray. While the Default option offers you 10 pre-set colors on your header that you can try, the Modern Web allows you to pick any color from 16 million colours to be set on the text, buttons and background according to your liking. In this way, the Modern Web is what we would recommend as it offers more granular controls over your appointment scheduling page theme when compared to the other options.
Under the color options in Modern Web you will be able to see 11 pre-set color schemes that you can check out on your appointment scheduling page. Try out the ones which you think may suit your appointment scheduling page well. If you need to apply something that is not offered in the pre-set schemes, click on the custom scheme at the very end (the one that looks like part of a rainbow in a box) to customize every part to your liking. It even offers a numerical hex value input so that you can precisely get the color that you need.
After that, you will see the Banner options where you can edit the Title, Description, Button Text and the Background Image that goes into your appointment scheduling page.



Custom Colors offer complete control over what you need in terms of the colors of your page.


Getting your resources that you need

For this specific guide, you will just need a place from where you can get your background image. If you have an image already that you want, go ahead and skip to the next part of the guide. If not, there are several websites on the internet where you will be able to purchase an image or get free royalty-free images. Please do note that sites that offer royalty-free images may not give you the same quality or specificity of paid ones. Some of the websites that we offer are:

Paid Sites:

Royalty free sites:
https://www.freepik.com/ (You can get paid ones here as well.)


Creating your background image

In this specific guide, we will not be editing any part of the image as we are going with just the image itself as the background. So, all you need to do is use your own image or go through the website of your preference and download one that you think is the right fit for your appointment scheduling website. Ensure that the image isn’t too cluttered and is visibly pleasing as it can portray a good and positive look to your page. Also, it will be much better if the majority of colors in the image match the color of your logo as it will make the design of your page look seamless and uniform although it is not mandatory to do so.


Picking out your color scheme in Zoho Bookings

For choosing the color scheme of your appointment scheduling page, the first step that you need to take is to observe your background image and your logo and answer the following questions with a color or two:
  1. Which colors stand out the most and catch your attention at first glance, positively?
  2. Which colors compliment your background image and your logo very well?
  3. Which color from them would look the best on buttons and text so that they contrast well with the background?
If you have a color or two that answers these questions for you, then that is probably what you are looking for. Don’t forget that you can always apply a certain combination of colors and try them out on the appointment scheduling page to see if it goes well. Also, ensure that you try all colors that you think may be good because sometimes, the colors that you think aren’t that great may be the best fit for your appointment scheduling page as a whole.
If you have a website for your organization which follows a certain style and color pattern, it may be better just to go with those specific colors and backgrounds that look just like it as it helps put both together as a visually whole and uniform package to your customer. This makes your website and bookings page look like a very professionally done experience.



Note: For every change or edit that you make to your appointment scheduling page, check out the page after doing so by clicking the Go To button at the very end of your workspace options so that you get an idea of how it looks on your appointment scheduling website.


Adding text to your page

Under the Banner section in Booking Page Themes, there are 3 places where you will have to give sentences or phrases on your appointment scheduling page: Title, Description and the Button Text. For the Title and Description, you can get creative and write anything that you think is appropriate and attractive for your business. As for the Button Text, you are pretty much limited to phrases that say that the final button on your appointment scheduling page confirms the details entered by the customer and confirms the booking. Here are some of our suggestions for each field:

Title
  1. Welcome to <your organization name>.
  2. Hi there! Let us get your slot booked with us.
  3. Let us get started with your appointment.
Description
  1. Book an appointment with us today and get started on an amazing experience.
  2. Your journey to an amazing experience starts in just a few clicks.
  3. Please enter the required details and confirm your booking according to your convenience.
Button Text
  1. Book Now
  2. Confirm My Booking
  3. Confirm
Feel free to try out your own suggestions and do not forget to check out your page with the changes done so that you get a feel on how it looks like to your customers.


The last thing to do after everything else

Get feedback! Work on your page until you have done the best you can and try to show it to some people (your colleagues, friends or family) that you are comfortable with seeing what they think of it. Who knows, perhaps they will point out a thing or two that can be improved which might have been missed by you because you were so focused on getting everything else right as well. This happens to the best of us and it is always a wise idea to get opinions from others and incorporate those into your design if you think that they make your page better. Ask for feedback from your customers as well after they start using it so that you can make the page easier for them to use to book appointments with you. If you have followed and implemented most of what we have said in this guide then congrats, you have designed an awesome appointment scheduling website all by yourself! Way to go!

I hope that you have found this guide to be helpful to you. Please share this with anyone who you know will benefit from this guide. Once again, let me know of any questions that you have via the comments sections down below.

Note: Some of features mentioned in this guide are only available on the premium subscription. 

We have more articles on appointment scheduling sites for you! Check some of them out below:

    • Sticky Posts

    • Announcing: custom color palette + free workshop

      Hello everyone, We're excited to share new feature in Zoho Bookings—a color palette within booking page themes. You'll find this option under Manage Bookings > Workspaces > Booking Page Themes. You can customize the color of every element in your booking page and even alter the transparency of your background image. Please note that this is a paid feature included in the Basic and Premium plans. At the moment, it's available only under the Modern Web theme. This means you can create billions (7,

    • Complete walk-through of Zoho Bookings (video)

      Save time for both you and your customers. Use Zoho Bookings, the appointment scheduling app from Zoho, to free yourself from email and paper-based scheduling. Zoho Bookings can give you a common calendar by syncing multiple calendars, including yours and your staff's. Your customers can book a time convenient for them, and pay for services, through your website or the customizable webpage features available in Zoho Bookings. They'll also get emails reminding them about their appointments and any

    • New Features: Service Availability and staff booking page themes!

      Dear All,  Want a dedicated schedule for your one-on-one services? How would it feel to have one-on-one services open for consultations only during certain times? You need a superpower to make that happen and we give it to you - Service Availability is

    • Zoho Bookings has a new pricing - Pay per user

      Dear customers, Businesses around the world use Zoho Bookings. Customers have booked 1.5 million appointments and over 200K online meetings using Bookings. We are only set to cross more milestones, thanks to your support. We are excited to introduce to

    • Zoho Bookings outage on 30th June in the US data center

      Dear customers, While we profusely thank you for your patience when we were busy identifying the issue that caused the outage in our US data center, we sincerely apologize for the trouble it has caused you. It was unfortunate but the events that triggered

    • Recent Topics

    • Update Zoho Flow on Sprint Work Item Status Change

      Hello, I've contacted Zoho One support but have been unable to help in a timely manner, so I'm asking the community. I want to start using sprints, but I'm having an issue. I need to post updates to Slack when a Work Item has a status change. My understanding

    • Call transcrition working for ringcentral?

      I don't see anything about what telephony providers can be used. The Zoho support person A said that RingCentral isn't supported. Zoho support person B said that it works, just make sure the call recording link works. Excellent instructions here: Call

    • What is syntax to call creator function (or trigger a creator workflow) from CRM deluge?

      What is syntax to call creator function (or trigger a creator workflow) from CRM deluge?

    • WhatsApp and Zoho Creator Integration

      How we have integrate WhatsApp App with Zoho Creator without using external application ?

    • Improve Creator Calendar Report

      Please can you improve the Creator Calendar Report General There is no way to highlight certain days, for example weekends or public holidays. There is no way to hide certain days, for example weekends. There is no way to modify the day header, it just

    • Important updates to Zoho CRM's email deliverability

      Last modified on: Jul 24, 2024 These enhancements are released for all users across all data centers. Modified on: Oct 30, 2023 Organisations that are in the Enterprise and above editions of Zoho CRM, and have not authenticated their email-sending domains

    • Custom modules not showing in developer console

      I'm trying to create a custom summing function for a custom module I made in my CRM. When I go to create the function, my module isnt showing up. Do I need to share the custom moldule with my developer console or something of the like?

    • Chart with Filtered Data vs Unfiltered Data

      I am looking to create a chart view that displays the full data set vs a subset of the data filtered by user filter. However I do not seem to find any method by which to exclude a plot from the applied filter or any other method by which to display the

    • Meetups Gratuitos Junio 2024 - Profundiza en las funcionalidades de tu Zoho CRM

      Este junio, aprende a sacar el máximo provecho de tu Zoho CRM en la segunda edición de los Zoho Meetups 2024. Los días 18 a 21 de junio, Zoho organiza los Meetups gratuitos para usuarios de Zoho CRM en Valencia, Barcelona, Madrid y Sevilla, donde expertos

    • How to get the Dashboard page to be the first page when you open the app

      So when it opens on a tablet or phone it opens on the welcome page, thanks.

    • Integration between Zoho CRM and Zoho WorkDrive

      I'd like to search Zoho for an invoice I've added as an attachment (pdf) to an account. The name of the invoice is 1388-advertiserx-July.pdf - but I can't find it using the search function for any of these terms: 1388 1388-advertiserx 1388-advertiserx-July.pdf

    • Tip #17: How to mandate partial payment for your appointments

      When you require partial payments during the booking process, customers can only schedule with you after paying a certain amount in advance. This deposit acts as a commitment between both parties. Apart from that, it has many more advantages. Benefits

    • Why option for 'include form submission in the body of the email' check box is missing

      Hi In all our forms we have configured an <Email Notification> (<Rules> <Form Rules>) In some forms, there is an option to <include form submission in the body of the email> in the <Additional Options> section, however, this option is not available in

    • Mozilla Vault extension will not Unlock even once.

      I have been using the Vault extension in Chrome based browsers for years, yet after installing the Mozilla Extension in Firefox, it will not unlock. Initially it did redirect me to log into my account, and then enter the master password. However, it did

    • Unable to Download CRM Contact Data: WorkDrive Integration Issues

      ## Problem Description We need to let users download contact information from CRM as CSV files to their local computers. Since we couldn't implement a direct download option, we're trying to use WorkDrive as a workaround - but we're encountering issues

    • Sort mail by name and subject

      I don't see sort function on columns FROM and Subject. I see only sort functio by date. Could add it ?

    • Zoho Creator monthly roundup - September 2024

      Hello all, We're back with an exciting set of new features and enhancements that will elevate your Creator experience even further. In case you missed it, we’ve recently revamped our Product Roadmap page, now with a refreshed design and showcasing all

    • Kiosk Studio Session #1: View paid customers in the same industry

      Update | 15 Oct 2024: Session #2 is now available here! Hello everyone! We're excited to launch our new series of posts on Kiosk Studio today. Called Kiosk Studio Sessions , these posts will be packed with actionable ideas to help you get the most out

    • Issues hosting Zoho Desk Web Form on SharePoint and/or Power BI

      Zoho Desk onboarding support has no experience with embedding their web form in either SharePoint or Power BI. Microsoft states that SharePoint and Power BI only support iframe HTML. And unfortunately, the web form embed code that Zoho generates is not

    • "Send with Zoho Sign" broken

      Our company uses hyphens in our file name conventions. Our users have been sending the files from other modules with the "Send with Zoho Sign" shortcut in the upper right buttons. Since around June 10, 2024, this stopped working. Our users can send the

    • Not able to change colors help center

      Hi. How can I change the orange color in the help center? You can change everything besides this font color And how can I remove the part on the bottom?

    • Transform Numeric Values using st, nd, rd, th or Convert Numerals to Ordinal Form - Deluge

      Please Use this sample Code This_Day_Date = zoho.currentdate.toString("dd"); value1 = "th"; if(This_Day_Date.right(1) ="1" && This_Day_Date != "11") { This_Day_Date = This_Day_Date+" "+"st"; } else if ( This_Day_Date.right(1) = "2" && This_Day_Date !=

    • Kaizen #166 - Handling Query Variables in Zoho CRM

      Hello, Code Enthusiasts! Welcome to another week of Kaizen! This week, we'll dive into handling variables in Zoho CRM Queries and see how they can be deployed in Kiosk to dynamically retrieve data. This technique is especially useful for integrating data

    • Automate User Invitations on Zoho Desk with API

      Automate User Invitations on Zoho Desk with API Hello Team, We are excited to announce that you can now automatically invite users to the Zoho Desk portal using the API! ### How It Works For example, when a contact is created in Zoho Desk and you enable

    • Is there a way to add clients who don't have organisation in Zoho Books/Payroll/Expense ?

      The Zoho Practice software is only allowing a total of 15 such clients who are not organisations in Zoho Books/Payroll/Expense. i.e. 5 organisation in each of the software by creating a new organization for them and adding the accountant as the admin

    • Email with attachments saving attachments into Zoho CRM from Zoho Mail

      Hi, I get a lot of emails from prospective clients asking if we would bid their project. Those projects usually have many documents associated with them that I link to.  I would like to have those documents be saved as an attachment in my Potential or Contact or Account. I don't see a way to do that that isn't multi-step. As of now I do the following: 1.) Open email 2.) If email sender isn't in my Zoho CRM database I enter them creating a Potential 3.) I download the attachment and save it to a different

    • Fixed assets recording

      Hello there, I recorded a bill for a vendor contain (Computer) so the PC is a fixed assets, do I need to do a manual journal to include this PC under the fixed assets category (furniture & equipment)? If yes, please take me through the manual journal

    • Multi-Select lookup field has reached its maximum??

      Hi there, I want to create a multi-select lookup field in a module but I can't select the model I want the relationship to be with from the list. From the help page on this I see that you can only create a max of 2 relationships per module? Is that true?

    • Zoho Sheet-Pulling in Data

      I have a module where we track POs, Bills etc (its easier for us this way). In this PO Module, we have a task related to a Job/Deal and various fields for costs. A Supplier on a Job might have several POs in this module for the job. I want to generate

    • Can't get ZFS file ID of a field via specific module record

      I have a `fileupload` field on a custom module that I need to replace the file for but I don't know how to get the ZFS ID from the module record. # Getting the current fileupload GET https://www.zohoapis.eu/crm/v7/<MODULE>/<ID> # Response { data: [{ //

    • Contemplating moving my site from WordPress to Zoho Sites

      Hi Everyone, We currently find ourselves in a situation where we ant to review and update our current sites content. We are small business owners, not developers. We currently use a wide range of Zoho products. We sometimes think about the possibility of either moving or just starting from scratch on Zoho Sites. I would like to know if anyone has done this and of course the things that need to be considered. We have spent quite a bit of time getting our current site positioned organically and I guess

    • Multiple Salesperson against an invoice

      Hello, Against a particular invoice, we have multiple sales people working. The reason we combine the invoice is becuase we are an exporter and often consolidate cargo for our customer to save them freight costs. How do I capture the contribution of each

    • Allow a brand to connect multiple facebook pages at the same time

      Our company have multiple facebook pages to represent, every branch, right now we can only link one facebook page, so we can only recive messages from one branch. It would be nice to be able to connect all pages.

    • 5名限定 課題解決型ワークショップイベント Zoho ワークアウト開催のお知らせ （12/19）

      ユーザーの皆さま、こんにちは。Zoho ユーザーコミュニティチームの藤澤です。 12月開催のZoho ワークアウトについてお知らせします。 ※定員に達したため、受付を終了しました。 ━━━━━━━━━━━━━━━━━━━━━━━━ Zoho ワークアウトとは？ Zoho ユーザー同士で交流しながら、サービスに関する疑問や不明点の解消を目的とした「Zoho ワークアウト」を開催します。 Zoho サービスで完了させたい設定やカスタマイズ、環境の整備など……各自で決めた目標達成に向け、 他の参加者と同じ空間で作業を行うイベントです。先輩ユーザーや他の参加者と意見交換をしながら集中して作業に取り組むことが可能です。

    • Whatsapp reply not reflected under Tickets for offline agent

      Hi, We are encountering a situation where WA response from customer is not reflected under tickets (if the agent handling the case previously is not active due to off day/ MC). The ticket will remain in the offline agent's queue until agent is back to

    • Missing Folders on iPhone Zoho Mail

      Under mailboxes on my iPhone, I don't have an inbox, sent folder, deleted photo, etc. See pics.

    • Select CRM Custom Module in Zoho Creator

      I have a custom module added in Zoho CRM that I would like to link in Zoho creator.  When I add the Zoho CRM field it does not show the new module.  Is this possible?  Do i need to change something in CRM to make it accesible in Creator?

    • Send Whatsapp with API including custom placeholders

      Is is possible to initiate a session on whatsapp IM channel with a template that includes params (placeholders) that are passed on the API call? This is very usefull to send a Utility message for a transactional notification including an order number

    • Increase Round Robin Scheduler Frequency in Zoho Desk

      Dear Zoho Desk Team, We hope this message finds you well. We would like to request an enhancement to the Round Robin Scheduler in Zoho Desk to better address ticket assignment efficiency. Current Behavior At present, the Round Robin Scheduler operates

    • I'm getting an "Invalid_scope" error, even though I used an access token generated with the correct scope.

      I'm getting an "Invalid_scope" error, even though I used an access token generated with the correct scope. Here’s what I did in Postman: Generated the code to create an access token using the following URL: https://accounts.zoho.eu/oauth/v2/auth?scope=ZohoCampaigns.contact.UPDATE&client_id=<client_id>&response_type=code&access_type=offline&redirect_uri=https://1882-2-26-193-161.ngrok-free.app

    • Next Page