Editor basics

Find your way around the editor and work faster.

Articles

How to zoom and move around the canvas

How to zoom and move around the canvas

In the TeleportHQ editor, use the − and + buttons at the top right of the canvas (or Ctrl/Cmd + and −) to zoom, click the percentage to go back to 100%, and hold Space and drag to move around the page.

How to undo and redo changes

How to undo and redo changes

In the TeleportHQ editor, click the Undo or Redo arrow above the canvas, or press Ctrl+Z and Ctrl+Shift+Z (Cmd on a Mac); undo history only covers your own changes since you opened the project.

How to use the command palette

How to use the command palette

In the TeleportHQ editor, press Ctrl+P (Cmd+P on a Mac) to open the command palette, type the name of a page, component, workflow, form, table or class to jump to it, or type > first to run a command such as Create new page or Publish project.

Keyboard shortcuts in the TeleportHQ editor

Keyboard shortcuts in the TeleportHQ editor

A complete list of the keyboard shortcuts that work in the TeleportHQ editor, for editing, selecting, adding elements, zooming, finding text and opening panels; open the in-app sheet with Ctrl+Shift+/ (Cmd+Shift+/ on a Mac).

How to preview your site before publishing

How to preview your site before publishing

In the TeleportHQ editor, click Preview in the toolbar at the bottom of the screen to open a working copy of your whole site in a new tab, where you can click links, try interactions and switch between desktop, tablet and mobile views.

How to see your page structure (Grayscale Structure Mode)

How to see your page structure (Grayscale Structure Mode)

In the TeleportHQ editor, click the Show layout structure button in the bottom toolbar (or press Ctrl+Shift+S, Cmd+Shift+S on a Mac) to turn the canvas grey and outline every element with a dashed line, so you can see how the page is built.

What do the warnings at the top of the editor mean?

What do the warnings at the top of the editor mean?

The colored chips at the top left of the TeleportHQ editor warn about missing settings and links that lead nowhere ("N issues"), unsafe workflow code ("N security issues"), an ended subscription ("Subscription ended") or a web app that needs its own subscription ("Subscription required"); click a chip to see details and fix it.

How to copy, paste and duplicate elements (and paste styles)

How to copy, paste and duplicate elements (and paste styles)

In the TeleportHQ editor, select an element and press Ctrl+C then Ctrl+V (Cmd on a Mac), or Ctrl+D to duplicate it in place; to copy only the look, copy the element, select another and press Ctrl+Alt+V (Paste Style).

How to copy elements and components to another project

How to copy elements and components to another project

In TeleportHQ, copy an element or section with Ctrl+C (or right-click a component in the Components list and choose Copy), open the other project, select where it should go and press Ctrl+V; its styles, fonts, images and components come along.

How to reorder the tabs in the left sidebar

How to reorder the tabs in the left sidebar

In the TeleportHQ editor, drag any icon in the left sidebar up or down to a new spot, or focus it and press Alt+↑ or Alt+↓; right-click the sidebar to hide a button, show hidden ones or reset the order, and your arrangement is saved to your account and used in every project.