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.
Steps to designing your registration & check-in experience
1. Access the Custom design settings
Log in to your Waitwhile account.
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
4. Add a background image
Upload an image to appear behind or alongside of your content area of your welcome page
Accepted file types:
Image dimensions:
file size limitations:
5. Personalize the colors
Customize your registration pages with HEX colors. You can specify colors for the following areas:
Background
Content card
Text color
Primary button color
Primary button text color
Secondary button color
Secondary button text color
6. Pick your fonts
Select your Heading font & Body font from the list of pre-loaded fonts offered by Waitwhile.
7. Set the Button radius
Slightly change the roundness of your buttons
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.