Why is it worth it?
Embedding the Zencal calendar on your website allows customers to schedule an appointment directly on your site. This makes the booking process faster and more convenient, and increases the likelihood of a successful booking. It’s a simple way to improve the user experience and increase the number of bookings.
If you want customers to be able to schedule appointments directly from your website, you can easily embed the Zencal calendar on it.
Step-by-step guide to embedding the calendar: 1. Go to the “Appointment Topics” panel
Next to each appointment, you’ll find an “Embed Code” button—click this button
- First, configure the calendar display settings—you have two options to choose from:
- Calendar — a standard widget where the client immediately sees your calendar and can select available dates.
- Step-by-Step Path—visitors first select the topic, location, and person in separate steps, and only then are they directed to the calendar.
💡 Good to know: A preview appears on the right side for each setting, allowing you to see how the calendar will look on your website. Additionally, you can configure the following here:
- time format (12-hour or 24-hour),
- the default calendar language,
- calendar view (monthly or weekly),
- enforce a specific time zone,
- whether a single link should provide access to one, several, or all meeting topics.
- Set Colors – In this section, you can customize the calendar’s appearance to match your brand’s visual identity. Here, you can change the calendar’s primary color as well as secondary colors, including those for icons, text, descriptions, and the backgrounds of selected elements.
- Add a logo – upload your company or brand logo, which will be displayed next to the calendar. This will make the booking process more consistent with your website’s visual identity.
- Download the embed code – Finally, copy the generated embed code and paste it into your website’s code where you want the calendar to appear.
💡 Good to know: You can further customize the appearance of the embedded calendar using your own CSS styles, allowing you to match it even better to the look of your website.