The top bar of your editor is your command center for managing view settings, saving progress, and publishing your site. This guide breaks down each key feature to help you navigate and control your site-building experience effectively.
Page Selector
The page indicator on the far left of the top bar displays the name of the current page you're editing. Clicking the adjacent drop-down menu allows you to quickly navigate to other pages within your site.
Breakpoint Views 📱💻
Breakpoint icons represent different screen sizes, letting you switch views to see how your site appears on various devices. Understanding how changes cascade through these breakpoints is crucial for responsive design:
Breakpoint | Screen Size Range | Impact of Changes | Notes |
Desktop | Changes affect all breakpoints below it. | This is the primary screen size for design. | |
Tablet | Changes only affect tablet screens and the mobile view below it, but not desktop. | Use for mid-size screen adjustments. | |
Mobile | Changes are exclusive to mobile devices. | Use for compact screen optimization. |
Info and Tools Section
Clicking the information icon opens a panel that provides essential site details and administrative tools. This section typically includes:
-
Site name and current status.
-
Editor version information.
-
Preview links for quick sharing.
-
Site statistics and client information.
-
The option to change the editor language.
Save Indicator
The save indicator provides real-time updates on the status of your changes:
Status Icon | Meaning | Description |
Unsaved Changes | Indicates that recent changes have not yet been saved to the server. | |
Saving Changes | Shows that the editor is currently processing and saving your recent work. | |
Saved Successfully | Confirms that all your recent changes have been securely saved. |
Undo and Redo
The back and forward circle arrows offer essential undo and redo functionality. These tools allow you to quickly revert or reapply recent actions, helping you navigate and correct mistakes within your short editing history.
Preview Mode
The preview icon allows you to toggle between design mode (where you edit) and preview mode. This feature lets you see exactly how your site (including any unpublished changes) will look and function on different devices before you make it live.
Publishing Your Site
The publish button is what makes your hard work visible to the world.
-
It allows you to choose a published destination and update your live site.
-
If your site has been published before, the button will change to say "republish," simply updating the existing live version with your latest changes.
Return to Dashboard
The home button (represented by a home icon ) is your quick exit. Clicking it will return you to your main dashboard at any time.