Skip to main content
All CollectionsCustomer journey Custom design
[New Settings] How to design the registration & check-in experience
[New Settings] How to design the registration & check-in experience

How to make your Booking or Waitlist registration experience look and speak like your brand.

Lindsey Gagnon avatar
Written by Lindsey Gagnon
Updated over a month ago

Customizing your registration pages in Waitwhile ensures that your customers have a smooth, branded, and intuitive experience when signing up for services, joining a waitlist, or booking appointments. With various design options, you can gather the exact information you need while providing a seamless experience.

Styling changes will be applied to all public facing pages including:

  • Booking registration pages

  • Waitlist registration pages

  • Status/confirmation page

  • Waitlist display page

  • Check-in page (Arrivals)

Steps to designing your registration & check-in experience

1. Access the Custom design settings

  1. Log in to your Waitwhile account.

  2. Go to Settings > Customer Journey > Custom Design.

2. Select the theme

Choose between our default themes or create your own custom theme. Selecting the Custom theme will give you additional configuration options.

3. Choose your layout

The ability to set the overall layout of your guest-facing pages and where to show your content. Choose between:

  • Default (content in "box")

  • Two columns - content right

  • Two columns - content left

4. Add a background image

If you prefer to have an image rather than a color as your background, you can easily accomplish that. Simply upload an image and it will override the background color (but the content background color will remain intact).

  • Accepted file types:

  • Image dimensions:

  • file size limitations:

5. Personalize the colors

You can set the text and button colors to be whatever you like using hex codes.

  • Text color: All text (headings and body) except for links and button text.

  • Button and link color: Your buttons and links will have the same color.

  • Button text color: You can set a different color for button text.

6. Pick your fonts

You can change the font of your headings and body text, respectively. You can choose between a plethora of available fonts categorized by Serif, Sans serif, Display, and Handwriting.

7. Set the Button radius

You can also change the border radius of your buttons. You'll have the option to pick between the following border radius options.

Advanced Customization with Code editor:

The Code Editor in Waitwhile allows you to customize the design and appearance of your customer-facing pages, such as waitlists, booking pages, and registration forms. With the Code Editor, businesses can modify the layout, colors, fonts, and overall styling to align the digital experience with their brand identity. This feature gives advanced users more flexibility beyond basic settings by using markdown, HTML and CSS.

Key Features of the Code Editor in Waitwhile

1. Modify HTML Structure

  • You can tweak the HTML elements on your pages to adjust how different sections (like forms, buttons, or banners) appear and interact.

  • Example: Add custom headers, footers, or links for a more personalized customer experience.

2. Customize Styling with CSS

  • Use CSS to control the look and feel of your pages.

    • Adjust fonts, colors, margins, or backgrounds to match your brand’s theme.

    • Example: Change button colors to match your company’s primary brand color.

Warning: Access to CSS styling is only available for Enterprise subscription plans.

3. Preview Changes in Real Time

  • The Code Editor allows you to preview any changes you make in real-time to ensure everything looks and functions as expected

Important Considerations

  • Technical Knowledge: The Code Editor is designed for users with a basic understanding of HTML, CSS, or JavaScript. Incorrect code may result in broken designs or functionality.

  • Testing Required: Always preview and test your changes to ensure everything works correctly on both desktop and mobile devices.

  • Support and Resources: If you are not familiar with coding, consider consulting with a developer or using Waitwhile’s basic design tools.


Have additional questions or need assistance? Reach out to us via chat or at support@waitwhile.com.

Did this answer your question?