Module Editor Tour

• Main Module Editor Areas
  • Top Bar
  • Stage
  • Timeline
  • Left Sidebar
    • Settings Sidebar
    • Slides Sidebar
    • Layers Sidebar
    • Add Sidebar
  • Right Sidebar
    • Design Mode
    • Animation Mode
    • Action Mode

Main Module Editor Areas

The Module Editor is the tool used to create & modify modules in Slider Revolution, whether they be sliders, carousels or hero units.

Through this visual, drag & drop interface you can add various types of layers, animations and special FX to your modules, as well as managing slides and configuring settings.

The editor is organized into five main areas:

• Top Bar ¹
• Stage ²
• Timeline ³
• Left Sidebar ⁴
• Right Sidebar ⁵

Let’s take a look at what each of these five areas does.

Top Bar

The Top Bar lets you access editing panels, manage responsive design, and perform key workflow actions.

It is comprised of three sections:

• Main Toolbar ¹
• Device Selector ²
• Preview Toolbar ³

The Main Toolbar contains buttons for opening panels.

The Device Selector includes tools for managing responsive sizes.

The Preview Toolbar provides workflow controls.

Learn more in our Top Bar Tour ->.

Stage

The Stage is the central workspace of the Module Editor, where you visually design and arrange your content.

It forms the largest area of the editor and allows you to select, transform and style layers, as well as preview animations in real time.

You can freely drag and drop elements for pixel-perfect control or use rows, columns, and auto-flowing layouts, all of which adapt responsively across devices.

Learn more in our Stage Tour ->.

Timeline

The Timeline is the section of the Module Editor dedicated to creating and managing animations for your layers.

The Timeline works in much the same way as you may have experienced in a video editor or motion graphics application.

Here you can view animation tracks, adjust animation timing, and play back animations to preview them.

You can also manage sub-animations called Scenes, and directly access layer animations that have been split into sub-timelines.

Learn more in our Timeline Tour ->.

Left Sidebar

The Left Sidebar is a dynamic space. Depending on what you are doing in the Module Editor, it may display one of these four sidebars:

• Settings Sidebar
• Slides Sidebar
• Layers Sidebar
• Add Sidebar

Settings Sidebar

The Settings Sidebar allows you to configure several module level settings.

Learn more in our Settings Sidebar -> tour.

Slides Sidebar

The Slides Sidebar is where you can manage the Slides that make up a Module.

Here you can add, delete and sort slides. You can also access and configure per-slide settings.

Learn more in our Slides Sidebar Tour ->.

Layers Sidebar

The Layers Sidebar is a dedicated area for managing the Layers that make up a Slide.

Here you can select, sort, rename and delete layers. You can also lock and hide layers, filter which layers appear, and perform bulk editing.

Learn more in our Layers Sidebar Tour ->.

Add Sidebar

The Add Sidebar is used to add Layers onto the Stage.

At the top of the panel is a Quick Add section with one click buttons to add common layer types.

Right Sidebar

In the Right Sidebar you can switch between three dedicated Editor Modes by selecting one of the three tabs at the top of the sidebar:

• Design Mode ¹
• Animation Mode ²
• Action Mode ³

The currently active mode is displayed directly above the stage area.

Design Mode

In Design Mode you gain access to eight different settings panel, through which you can control the design of your layers.

Learn more in our Design Mode Tour ->.

Animation Mode

In Animation Mode you can add and edit animations for your layers.

By default animations are targeted at the layer as a whole, but you can also separately animate attributes of the layer such as its mask or wrapper.

Learn more in our Animation Mode Tour ->.

Action Mode

In Action Mode you can add interactive triggers to your modules such as links, media controls and scene triggers.

Learn more in our Action Mode Tour ->.