The short version
Your booking page is a template (the layout) and a colour scheme (the colours). Set both once under Events, then Design, and every event follows. Give one event its own look in its Design section.
Choosing a template
The template decides how your booking page is laid out. Timelydo has ten. The picker shows each one as a small picture with a short description, and the preview beside it shows your event with sample times, so you can compare before you save.
Classic: a banner and details on the left, the calendar and times beside them. Lumen: quiet and plain, details on the left, no banner. Stride: a week of times in seven columns, no month calendar. Ledger: a list of the coming days, each with its times, no calendar. Voyage: one thing at a time, day, then time, then details. Ribbon: a strip of days to scroll with big time buttons below. Pocket: one small card, month on top and times under it, good for embeds. Aurora: a coloured side with the details and a clean side to book. Horizon: a small month and the day laid out by the hour. Atrium: a wide colour banner, then the month and times side by side.
On a phone every template fills the screen. On a computer the page sits in a card, and each template has its own card width. In an embedded booking page the card fills the frame it is placed in.
Colour scheme
The colour scheme sets the colours, the roundness of the corners and the shadows. There are five ready made schemes. Classic is the standard look, clean and familiar. Soft is lavender with large rounded corners and light shadows. Bold is a strong colour with sharp corners and firm borders. Minimal is flat and quiet, graphite with no shadows. Ocean is a cool teal with balanced rounded corners.
A scheme works with any template. If you only change the colours, the layout stays as it was.
Your own colour
Choose Custom to use a colour of your own, such as your brand colour. Click the colour box to pick one, or type it into the field next to it as a hex code, for example #4f46e5. A code with three digits such as #f80 also works. If the code is not valid you see an error and the page keeps the last good colour. Reset colour goes back to the starting colour.
From your one colour, Timelydo makes the lighter and darker shades the page needs for buttons, borders, hover states and the day a booker picks. Text stays readable. If your colour is too light for white text on a button, Timelydo makes it a little darker and shows the note that it did. The shades also adjust for dark mode.
Account default or one event
Your account default is the design every event follows. Open Events, then Design, and stay on the Booking pages tab. Choose a template and colours, check the preview (you can switch it between Choose a time and Your details), then select Save design. Reset throws away changes you have not saved. The other tab, Profile page, is for the banner of your page of events and is a separate setting.
To give one event its own look, open the event, select Edit and open the Design section. Each choice, the layout and the colours, has an Account default option that shows what your account uses. Pick something else only where you want a difference. An event can keep your account template and change only the colours, or the other way round. If you later change the account default, every choice an event left on Account default follows it. The link Change the design for all events in that section takes you to the account page.
You can also try a design on a live page without saving it. Add ?template= and a template name, or ?theme= and a scheme name, to the address of your booking page, for example ?template=ribbon&theme=ocean. Nobody else sees the change.
After the booking
The page a booker sees after booking uses the same template and colours as the booking page, in all ten templates. It shows the status of the booking and its details: date and time, location, time zone and duration, plus the deposit and the balance when the event takes a deposit.
Below the details are the actions that are still allowed: reschedule, cancel the booking (or withdraw a request that waits for approval) and make a new booking. There are also links to add the booking to Google Calendar, Outlook or Apple Calendar.
A small Powered by line with the Timelydo logo sits in the foot of the card on a computer, on the left. Pocket is the exception: there it sits under the card. The foot also holds Message, Report a bug, the language and the light and dark switch. It only shows while the branding setting of your profile is on. If you turned branding off, nothing of ours appears on your page. In an embedded page the card already carries the logo, so the line is left out.
Dark mode
Every colour scheme, the custom one too, has a dark version. The booking page follows the booker, not you. It turns dark when the booker's own theme is dark, or when it is set to follow the device and the device is in dark mode. You do not need to set anything for it.
Bookers can also switch between light and dark themselves with the small moon or sun button in the foot of the card. The choice is kept in their browser.
FAQ
Can I use a different design for one event?
Does the design change what bookers can do?
My custom colour looks darker than the one I typed. Why?
Was this article helpful?
Let us know so we can keep improving our documentation.