✏️ Meet the Content Editor

Search…
You have been briefly introduced to the Content Editor (see Product tour) and now is the time to learn all the ins and outs.
​
Remember that the Content Editor helps you focus solely on changing the content, not the design, of your project, meaning that:
You CAN
Add, remove, arrange, resize sections (based on a template)
Change copy (text), images, shapes, videos, links
Configure elements
You CANNOT
Add, remove, reposition, or resize elements
Change the style of elements, such as text font and color
With that all clear, we will start with a tour of the user interface.
But first, how do I access it?
The Content Editor can be accessed by:
Clicking “Open in Content Editor“ when hovering over the thumbnail of a project in the Dashboard.
Clicking “Content“ in the Top Bar while in the Design Editor.
Canvas
The Canvas is much like a boundless surface where you craft your content before it goes out in the world.
It is home to the Viewport, which is the rectangle through which you can see actual content. It represents the device screen of someone viewing your Vev content.
Since devices come in all sizes and shapes, the Viewport has different device modes to help you see how your content will look on each of them, e.g. desktop, tablet, mobile.
Page content, i.e. sections and elements, are highlighted with blue borders when you hover over them. Anything beyond the Viewport is invisible but will still be highlighted.
Lastly, the Canvas can be set in either of two modes:
Edit mode, where elements and sections are selectable and editable. They are not fully functional in this mode, e.g. clicking links doesn’t take you anywhere and videos don’t play.
Preview mode, where web content is rendered with full functionality as it would in real life.
And in case you’re wondering, behind the Viewport is a nameless, infinite dark space to help you zoom and pan around with ease!
Play Time!
Open a project in the Content Editor and try out the following:
Scroll up and down to view the whole length of the page.
Zoom in and out by holding CMD/CTRL and scrolling up and down.
Hover over content to identify the different sections and elements.
Press 1, 2, and 3 on your keyboard to switch between Desktop, Tablet, and Mobile.
Press TAB to switch between Edit and Preview mode.
Top Bar
Across the top of the Content Editor is a handy set of buttons. Here’s a quick walk-through from left to right:
(Our beloved) Vev logo
Takes you to the Dashboard.
Name of current page
Displays the name of the current page. Clicking it takes you to page settings. (See Managing pages)
Status of current page
Shows and changes the status of the page. (See Managing pages)
Back, Forward, Refresh, Home
Equivalent to standard navigation buttons in web browsers. They are especially useful in Preview mode.
Zoom controller
Shows full zoom controls.
Also remember you can always hold CMD/CTRL and scroll up and down.
Device mode
Shows and changes the active device mode.
You can easily switch between these device modes by pressing 1, 2, and 3 on your keyboard for Desktop, Tablet, and Mobile, in that order.
And gliding over to the right …
Preview
Toggles Preview mode on and off in the Canvas.
Pressing TAB has the same effect.
Design
Takes you to the Design Editor.
Publish
Takes you to Publish Settings. (See Hosting)
Toolbar
Along the far left edge are a few tools and shortcuts at your disposal:
Add sections
Layers Panel
Project Settings
We will go over these in due time.
Templates - Previous
Using Templates
Managing Pages
Last modified 1mo ago
Copy link
Contents
But first, how do I access it?
Canvas
Top Bar
Toolbar