Customization & Branding

Make your booking pages match your brand with custom colors, logos, and messaging.

Branding Options

Company Logo

Display your logo on booking pages:

1. Go to Settings > Company or event settings

2. Upload your logo image

3. Recommended size: 200x50px or similar aspect ratio

4. Supported formats: PNG, JPG, SVG

Button Color

Customize the primary action button:

1. Go to event settings > Customization

2. Find Button Color

3. Enter a hex color code (e.g., #4F46E5)

4. Or use the color picker

This affects:

• Continue button

• Confirm booking button

• Primary action links

Button Text

Customize the main CTA button text:

1. Go to event settings > Customization

2. Find Button Text

3. Enter your custom text

Examples:

• "Continue" (default)

• "Check Availability"

• "Next Step"

• "See Available Times"

Form Customization

Form Style

Choose between form layouts:

Style

Description

Configure in event settings under Form Style.

Calendar Layout

Choose how the calendar displays:

Layout

Description

Configure in event settings under Calendar Layout.

Field Labels

Toggle field label visibility:

• Labels On: Clear labels above each field

• Labels Off: Clean look, relies on placeholders

Configure under Show Field Labels.

Messaging Customization

Step Labels

Customize the step indicator text:

Calendar Overlay Message

When the form isn't complete, an overlay covers the calendar. Customize this message:

Default: "Please fill out the form before choosing your time slot"

Custom examples:

• "Complete the form to see available times"

• "Answer a few questions to unlock scheduling"

Confirmation Page

Internal Confirmation

The default confirmation shows:

• Success message

• Meeting details

• Add-to-calendar buttons

• Optional video embed

Confirmation Video

Add a video to your confirmation page:

1. Go to event settings > Confirmation

2. Find Confirmation Video Embed

3. Paste your embed code (YouTube, Vimeo, Loom, Wistia)

Example use cases:

• Thank you message from you

• What to expect on the call

• Preparation instructions

Confetti Animation

Add celebration confetti when booking completes:

1. Go to event settings > Confirmation

2. Toggle Show Confetti on

Adds a fun visual celebration moment.

External Confirmation

Redirect to your own page after booking:

1. Enable External Confirmation

2. Enter your Redirect URL

3. Booking data is passed as URL parameters

See Booking Flow for parameter details.

Event Information Display

Show Event Info After Step 1

Toggle whether event details show on the calendar step:

• On: Sidebar shows event name, duration, description

• Off: Cleaner layout, more space for calendar

Show Event Info on Slides

For slide-style forms, show event details during form completion:

• On: Persistent event info sidebar

• Off: Full focus on form fields

Advanced Customization

Custom CSS (if supported)

Some implementations support custom CSS:

/* Example custom styles */
.booking-widget {
  font-family: 'Your Font', sans-serif;
}

.booking-button {
  border-radius: 8px;
}

Check your settings for custom CSS options.

URL Parameters for Pre-fill

Pass data to pre-populate fields:

/book/abc123/call?name=John&email=john@example.com

Useful for:

• Links from marketing emails

• CRM integration

• Personalized landing pages

Design Best Practices

Brand Consistency

• Use your exact brand colors

• Match fonts where possible

• Keep logo high-quality

Clear Communication

• Use descriptive step labels

• Make button text action-oriented

• Explain what happens next

Mobile Optimization

• Test on mobile devices

• Ensure tap targets are large enough

• Verify text is readable

Accessibility

• Ensure sufficient color contrast

• Don't rely only on color for information

• Keep forms simple and clear

Preview Changes

Before publishing:

1. Use the preview function in event settings

2. Test the booking flow end-to-end

3. View on different screen sizes

4. Verify all customizations appear correctly

Per-Event vs. Global Settings

Troubleshooting

Logo Not Showing

• Verify logo is uploaded

• Check Show Logo is enabled

• Ensure image format is supported

• Try re-uploading

Colors Not Applying

• Clear browser cache

• Verify hex code is valid

• Check preview vs. live

Custom Text Not Displaying

• Save changes and refresh

• Check for character limits

• Verify correct field is edited

Related Guides

• Booking Flow Overview - The complete prospect experience

• Embedding on Your Website - Add styled widget to your site

• Creating Events - Full event configuration