Customize the editor view
This topic explains how to customize the editor view in the Page builder.
Open a page in the editor
To open a page in the editor:
-
Click the Editor tab on the top toolbar to view sitemap in the left-hand pane.
-
In the sitemap, click the page or item you want to edit.
-
The page opens in the editor area in the middle of the screen.
-
To open the settings of the page in the editor, in the site tree, click
> Settings.
If you know the item ID of the page that you want to open, you can edit the URL in the address field of your browser to navigate to it.
Make more room for the editor
You can make more room for the editor by collapsing the side panes.
To collapse or expand the right or left pane:
-
At the bottom of the editor view, click the corresponding Collapse/Expand icon
.
You can also dock and undock the right-hand side panel, creating a Page builder view that suits your preferences and screen requirements:
-
The right-hand panel is docked by default, but when you click Undock
, the canvas expands fully to the right, while the right-hand panel detaches and floats over the canvas. -
If the panel is undocked, you can click Dock
to return the panel to its default, docked position on the right-hand side of the page. Docking the panel returns the canvas to its original size.
Select a site or language
The name of the project and environment, the current site, and the language version of the site are displayed on the top toolbar.
To select a different environment, site, or language:
-
On the top toolbar, click the relevant selector and select an option from the drop-down menu.
Change the device view
The Page builder applies responsive design to the pages on your site, so pages adjust to the size of the device they are displayed on. The page editor can display the current page as it appears on different devices.
To view the current page with a different device layout:
-
On the page top toolbar, click the device icon you want to use for the current page.
-
Some types of devices might not be visible. To make them appear, open the list of devices and select the type of device you want to display.
Open a preview of the page
To open a preview of the current page in a different browser tab:
-
In the top toolbar, click Preview
.
The new browser displays the page that is currently opened in the editor. You can navigate to other pages in the same way as on the live website by clicking links and menus on the page. Previewing is available to all users, even those without read access rights to the pages of the site.
When opening the preview in a new tab of a Chrome browser, you also have the option to use the Inspect Elements tool to see the page in different viewport sizes.