Modulify
Dashboard

Use the preview

Read the live preview, move between pages, and change the viewport.

On this page

The Preview tab runs your working copy of the site in a real browser frame. It is the site itself, not a screenshot, so links work, forms render and scripts run. It updates as chat makes changes, and none of it is public until you publish.

Wait for the preview to start

The first time you open a project the preview has to boot. A status pill sits above the frame and names the current step: Resuming preview..., Provisioning preview..., Booting preview... and Syncing your files.... While AI is applying changes the same pill reads Applying changes..., and while your work is being saved it reads Saving your changes....

If a step fails the pill turns into Could not load your files with a Retry next to it.

The buttons on the address pill stay disabled until the preview is up. Refresh and full screen say The preview is still starting while you wait.

Move between pages

The address pill in the centre of the header shows the current path. Click it and a menu opens listing your pages in three groups:

  • Static Routes, which you can open
  • Dynamic Routes, which are listed for reference and cannot be opened directly
  • Utility Routes

Type into the pill to filter that list. If what you type is not one of your pages, a Go to row appears so you can open the path anyway. Press Enter to navigate, Escape to close.

Hover the page tab at the left of the pill and a card shows what that page reports about itself: favicon, title, meta description, tags, and the social preview image. When there is no image it reads No preview image.

Refresh, full screen and viewport

Three controls sit at the right of the address pill.

The circular arrow reloads the frame. Its tooltip is Refresh.

The expand arrows open Full screen. The site fills the window, the toolbars disappear, and an Exit button with the Esc shortcut appears in the top right. Full screen is disabled while an unfixed runtime error is showing, with the tooltip Fix the runtime error to open full screen.

The device icon switches the viewport. Desktop uses the full width, Tablet renders at 768px wide and Mobile at 375px. The choice is yours alone and does not change the site.

Switch language

If your site has more than one language, the two-letter code next to the device icon switches which one the preview renders, and the CMS tab follows the same choice. Pick a language from the menu, or click the small cross on the code to go back to the default. When there is only one language the menu reads No other languages and offers Ask AI to add a language, which drops that request into chat for you. Multiple languages covers how a site gains a second language in the first place.

When something breaks

If the page throws at runtime, the frame is replaced by a Runtime error panel that says Your site hit a runtime error. Use Fix with AI to repair it. The Fix with AI button attaches the error to chat and sends you to the conversation. The raw error text is shown underneath.

Some pages cannot host the editing tools. On those you get a small Editing tools unavailable here notice with a Retry, and selecting, inline editing and commenting are unavailable until the connection comes back.

Next