Previewing Specific Pages in the CSS Editor

When editing styles in the CSS live preview dialog, you can now preview how your CSS looks on pages beyond the main form — without having to submit test leads or trigger error conditions manually.

The Preview Page Selector

A Preview Page dropdown appears at the top of the CSS editor panel. It defaults to Main Form, which is the existing behavior.

Additional options include:

Option	Page shown
Follow-Up	The page displayed after a lead is submitted
Time Slots Not Found	The message shown when no appointment slots are available
Zip Code Not Supported	The message shown when a zip code is outside the service area

How to Use It

1. Open Edit Style for any form and click the CSS editor button.
   
2. Choose a page from the Preview Page dropdown.
3. Click Update Preview. If a preview is already loaded, changing the dropdown reloads it automatically.
4. The preview iframe will display that page with your current CSS applied.

You can switch between pages freely while editing. The selection resets to Main Form when you close the dialog.

Notes

• The custom text configured under Page Text — including the follow-up body, time slots message, and zip code message — will render in the preview, so you can check both layout and content at the same time.
• This only affects the preview. It has no impact on live forms or saved settings.