PIXLOVADocumentation

The editor

Get to know the areas of the creation editor, layers, groups, alignment and keyboard shortcuts.

The editor opens full screen when you open a creation. It has five areas:

  • the top bar: name, saving, undo, preview and publishing;
  • the left rail and its panel: Add, Media, Layers and Page;
  • the settings bar, above the page: it changes with what is selected;
  • the page itself, in the centre;
  • the bottom bar: grid, snapping, safe zone and zoom.

The top bar

  • Back to creations (arrow on the left): returns to the list after saving your latest changes.
  • Creation name: click the name to change it, then press Enter.
  • Save status and page dimensions (for example "1920×1080 px").
  • Undo and Redo.
  • Things to check: appears when the creation contains errors or warnings. See Preview and publish.
  • The publication state: Not published yet, Published or Unpublished changes.
  • Preview and Publish to screens.
  • More actions (three dots): Version history and Keyboard shortcuts.

Automatic saving

You do not need to save: the draft is saved automatically one to two seconds after your last change. The status next to the name tells you where things stand:

  • Saving…: saving is in progress;
  • Saved: everything is saved;
  • Unsaved changes · Save now: saving failed. Click the link (or press Ctrl+S) to try again;
  • Read only: your role does not allow you to edit the creation.

Saving the draft changes nothing on the screens: only publishing updates what they show.

Edited by someone else

If someone changed the same creation since you opened it, the editor shows "This composition was changed by someone else since you opened it. Your changes were not saved." Click Reload the latest version (your changes will be lost) to start again from the saved version.

The left panels

Click an icon in the rail to open its panel; click it again to close it and enlarge the page. On a narrow screen, the panels are closed when the editor opens.

Add

The Add panel holds everything you can place on the page: text, shapes, icons, emoji, live information (weather, RSS feed, data table), widgets and media. Click an element to add it to the centre of the page, or drag it onto the page where you want it. Each element is described in Elements.

Media

The Media panel shows the ready images and videos from your library.

  • Click an image or a video to add it to the page, at its own proportions.
  • Upload files sends new files to the library. "Being prepared" shows how many files are still being processed: they appear in the list as soon as they are ready.
  • Filter with All, Images or Videos, or search by name.
  • Manage media opens the library.

Layers

The Layers panel lists the elements of the page, from front to back.

  • Click a layer to select the element. Shift + click (or Ctrl + click) adds a layer to the selection or removes it.
  • Drag a layer up or down to move it in front of or behind the others.
  • The Hide / Show eye hides an element. A hidden element does not appear on the screens.
  • The Lock / Unlock padlock prevents moving, resizing or deleting the element by mistake. Locking has no effect on the screens.
  • A group is shown as a folder, with its number of elements. Click the arrow to collapse or expand it; the group's eye and padlock apply to all its elements.

Each layer has an automatic name (the start of the text, or the element type). To rename it, select the element, open More options in the settings bar and change the Layer name.

Page

The Page panel sets up the page itself:

  • Background colour: choose one of the suggested colours, or any colour with the Background field;
  • page Width (px) and Height (px);
  • Duration (s): how long the creation is displayed. With 0, the duration is the one set in the playlist;
  • Sound: Silent composition (default) or At most one video with sound.

The settings bar

The bar above the page adapts to the selection.

  • Nothing selected: the bar shows Page, the background colour and the duration (Automatic duration or "Duration: 10 s", for example). Click the duration to open the Page panel.
  • One element selected: the bar shows that element's main settings (font, size, colour…), then More options, which holds all its settings and the layer name.
  • Several elements selected: the bar shows how many and offers Group.

On the right, for any selection:

  • Animate: entrance and motion effects. See Animate an element;
  • Position: alignment to the page, stacking order and exact values (see below);
  • Lock / Unlock;
  • Duplicate: creates a slightly offset copy;
  • Delete: deletes the selected elements, except locked ones.

Select, move and resize

  • Click an element to select it. Shift + click adds an element to the selection. Click an empty area to deselect everything.
  • Drag an element to move it. The arrow keys move it by one pixel, by 10 pixels with Shift.
  • Drag one of the frame's handles to resize. Hold Shift while dragging a corner to keep the proportions.
  • Double-click a text to rewrite it directly on the page. Esc or a click elsewhere confirms.

Parts of an element that extend beyond the page remain visible, faded, around it in the editor. Screens do not show them.

Position, alignment and order

The Position button in the settings bar opens three settings:

  • Align to page: Left, Centre, Right, Top, Middle, Bottom. With several elements, the selection is aligned as a block;
  • Order (one element): Bring to front, Bring forward, Send backward, Send to back;
  • Exact values (one element): X (px), Y (px), Width, Height, Rotation (°) and Opacity (%). Positions and sizes are in page pixels; the matching percentage is shown under each field.

Rotation is set only with this exact value, in degrees clockwise.

Group elements

A group is selected and moved as a block.

  1. Select several elements (Shift + click on the page or in the layers).
  2. Click Group in the settings bar (or Ctrl+G).

The group gets a name ("Group 1", "Group 2"…) that you can change in the settings bar when it is selected. Clicking a grouped element selects its whole group. To undo the group, select it and click Ungroup (or Ctrl+Shift+G).

Grid, snapping and zoom

The bottom bar offers:

  • Grid: shows a grid on the page. With snapping on, moves follow the grid;
  • Snapping (on by default): while moving, the element lines up with the edges and centre of the page and of other elements; guides appear;
  • Safe zone: shows a frame 5% inside the page edges. Keep important information inside this frame;
  • Zoom out, Zoom in and Fit (the whole page in the window), with the zoom level as a percentage.

Keyboard shortcuts

The list is also available in the editor: More actions > Keyboard shortcuts. On a Mac, use Cmd instead of Ctrl.

KeysAction
Ctrl+ZUndo
Ctrl+Y (or Ctrl+Shift+Z)Redo
Ctrl+C · Ctrl+VCopy, paste
Ctrl+DDuplicate
Ctrl+GGroup the selection
Ctrl+Shift+GUngroup
Shift + clickAdd to the selection
Del (or Backspace)Delete
ArrowsMove (Shift: by 10 px)
Double-clickRewrite a text
EscDeselect
Ctrl+SSave right away

Shortcuts do not apply while you are typing in a field.

On this page