The screen appears when you edit a page is called Editor.

Zeno Editor

Sidebar

The sidebar is located in the left of the Editor, and contains 3 tabs: Element, Outline and Settings.

Element tab

Element tab contains all elements that you can drag & drop into the page.

Element list

Elements are splitted into groups based on their role in building a page. They are:

  • Layout: for grouping elements and laying out the page structure.

  • Content: for information elements.

  • Booster: for sale-boosting and customer-growing elements.

  • Social: for social related elements.

  • Product: for all product related elements.

  • Blog: for all blog post related elements.

You can move your mouse over an element, hold down and drag into the page, release the mouse and the element will be inserted into the place you drop it. Please notice that only the places being highlighted can be dropped into.

Drag and drop

Outline tab

You can view your page layout and quickly navigate between elements in this tab.

Page outline

Setting tab

You can find page global settings in this tab.

Page settings

"Notch"

We called it "notch" because it reminds us about a similar design on some iPhone models.

Zeno notch

You can click on the "notch" to toggle visibility of the Sidebar.

Topbar

The Topbar is located at the top of the Editor, containing the following:

Library

You can click open Library button on the Topbar to open the Library.

Zeno Library

The library contains many pre-made sections you can insert quickly into the page.

Built in sections

It also contains custom sections you saved for later usage.

Saved sections

Undo / Redo

You can click Undo / Redo buttons to undo / redo the change you just made with the page.

Undo / Redo

Screen switcher

The Screen switcher consists of 3 buttons: Desktop, Tablet, Mobile. It allows you to change between different screen mode to edit the page for each screen.

Screen switcher

Revisions

Each time you publish the page, Zeno will save a revision for the page so you can revert it back later. You can view all page revision by clicking the Revisions button.

History revisions

View live

You can click the View live button to view the current page in live. If the page is saved but not published, the live page will not be the same as in the Editor.

View live page

Save & Publish

After making change to the page, you can click Save to save it. The page is not visible in live yet, you must then click the button again, now has changed to Publish, for it to go live.

Save page

Viewport

The main editing area is called Viewport.

Zeno viewport

The Viewport contains all elements in the page.

You can click on an element to show it settings in Sidebar.

Zeno Editor

From there you can make change to the element.

Each element has a Toolbar attached to quickly save section, duplicate and remove the element from the page.

Toolbar

You can move an element around by holding down on its name in the Toolbar, drag and drop. Easy it is, huh?

You can also right click an element to open its context menu for even more quick options.

Context menu

And that wraps up an overview of the Zeno Editor.

Did this answer your question?