Add Sidebar

• Add Sidebar
  • Quick Add Section
  • All Layer Types Section
  • Layer Placement
  • Adding Layers by Dropping Files

Add Sidebar

The Add Sidebar is accessed by going to the Module Editor, then the Top Bar, then clicking the Add button ¹.

In the Add Sidebar you add new layers to the current slide. Every layer type Slider Revolution offers is listed here, from text and images through to navigation controls and imported layers, and a row of Quick Add buttons covers the most common ones with a single click. Choosing an entry adds the layer to the slide straight away, or opens the window it needs first, such as the WordPress media library or the Elements library.

Quick Add Section

Quick Add Buttons (Button Group)

Adds one of the five most common layer types with a single click, without opening the All Layer Types menus. The buttons carry no labels, only icons: Headline ¹, Paragraph ², Button ³, Image Placeholder ⁴ and Video Placeholder ⁵.

Options:

• _Headline: Adds a headline text layer containing the text Headline.
• _Paragraph: Adds a paragraph text layer containing sample text, using the HTML p tag.
• _Button: Adds a button layer labeled Button.
• _{Image Placeholder}: Adds an image layer showing a placeholder graphic, ready for an image to be chosen in the layer's Image Content settings.
• _{Video Placeholder}: Adds a video layer showing a placeholder graphic, ready for a video source to be set in the layer's Video Content settings.

All Layer Types Section

In the All Layer Types section every layer type is listed. Entries marked with a chevron open a menu of variations to the right, and entries without one act immediately.

Effects (Button)

Opens the Effects Library window, where animated effect layers such as particles, distortions and lighting are browsed by category, previewed and added to the slide. Effects supplied by addons appear in the library's Quick Add section when the addon is enabled for the module.

Text (Action Menu)

Opens a menu of the text layer types.

Options:

• _Headline: Opens the Headline menu, where the heading level is chosen.
• _Content: Opens the Content menu, where a paragraph, a link or a counter is chosen.
• _Button: Adds a button layer labeled Button.

Headline (Action Menu)

Adds a headline text layer using the chosen HTML heading tag. The layer's text is the option name, for example H2 Headline.

Options:

• _{H1 Headline}: Adds a headline layer using the h1 tag.
• _{H2 Headline}: Adds a headline layer using the h2 tag.
• _{H3 Headline}: Adds a headline layer using the h3 tag.
• _{H4 Headline}: Adds a headline layer using the h4 tag.
• _{H5 Headline}: Adds a headline layer using the h5 tag.
• _{H6 Headline}: Adds a headline layer using the h6 tag.

Content (Action Menu)

Adds a body text layer, or a text layer that counts.

Options:

• _Paragraph: Adds a paragraph text layer containing sample text.
• _Link: Adds a text layer containing sample link text, underlined on hover, with a Link action already attached that opens http://yourdomain.com in a new tab. Change the address in Action Mode.
• _Counter: Adds a text layer whose number counts up to the value it shows, 12,500 by default, in the layer's own font and color. Any words around the number are kept. The count starts when the layer animates in, on hover, on click, or from the Start Counter action, and the digits can roll like an odometer. The starting value, timing, and number format are set in the layer's Counter settings.

Image (Action Menu)

Opens a menu of the sources an image layer can be created from.

Options:

• _{WordPress Library}: Opens the WordPress Select Image window to choose or upload an image from the media library, then adds it as an image layer at its own size.
• _{Slider Revolution Elements}: Opens the Elements library on its Images category, then adds the chosen stock image as an image layer.
• _{Slide Background}: Opens the WordPress Select Image window, then adds the chosen image as a layer named Slide Background that fills the whole slide, for use as a backdrop behind the other layers.
• _Placeholder: Adds an image layer showing a placeholder graphic, ready for an image to be chosen in the layer's Image Content settings.
• _{AI Generation}: Adds an image layer showing a placeholder graphic and opens the AI Image Generation panel in place of the sidebar, where a text prompt generates the image. Each generated image costs one AI credit.

Shape (Action Menu)

Opens a menu of shape layers. Shapes are colored blocks with no content of their own, used for backgrounds, tints, dividers and decoration.

Options:

• _Circle: Adds a 150px circle filled with semi-transparent black.
• _Square: Adds a 150px square filled with semi-transparent black.
• _{Custom Shape}: Adds a 300px transparent layer holding an editable star shape. The shape's points and curves are changed in the shape builder at the top of the layer's Layer panel.
• _Line: Opens the Line menu, where a horizontal or vertical line is chosen.
• _Cover: Adds a shape that fills the whole slide, filled with semi-transparent black, for tinting everything beneath it.
• _{Slide Background}: Adds a shape named Slide Background that fills the whole slide, with a purple gradient fill, for use as a backdrop behind the other layers.

Line (Action Menu)

Adds a thin shape layer to use as a divider.

Options:

• _Horizontal: Adds a line spanning the full width of the slide.
• _Vertical: Adds a line spanning the full height of the slide.

Video (Action Menu)

Opens a menu of the sources a video layer can be created from.

Options:

• _{Local Video File}: Opens the WordPress Select Video window to choose or upload a video file from the media library, then adds it as a video layer with a poster frame captured from the video.
• _YouTube: Adds a video layer set to play a sample YouTube video. Replace the YouTube ID in the layer's Video Content settings.
• _Vimeo: Adds a video layer set to play a sample Vimeo video. Replace the Vimeo ID in the layer's Video Content settings.
• _{Slider Revolution Elements}: Opens the Elements library on its Videos category, then adds the chosen stock video as a video layer.
• _{Slide Background}: Opens the WordPress Select Video window, then adds the chosen video as a layer named Slide Background that fills the whole slide, for use as a backdrop behind the other layers.
• _Placeholder: Adds a video layer showing a placeholder graphic, ready for a video source to be set in the layer's Video Content settings.

Audio (Action Menu)

Opens a menu of the sources an audio layer can be created from. Audio layers are added at 300px by 50px to hold their player controls.

Options:

• _{Local Audio File}: Opens the WordPress Select Audio window to choose or upload an audio file from the media library, then adds it as an audio layer.
• _{Slider Revolution Elements}: Opens the Elements library filtered to audio, then adds the chosen track as an audio layer.
• _Placeholder: Adds an audio layer with no file set, ready for a source to be chosen in the layer's settings.

Icon/SVG (Button)

Opens the Elements library on its Font Icons category, with SVG Icons alongside. A font icon is added as a text layer holding the icon, sized and colored like text, and an SVG icon is added as an SVG Icon layer at 150px by 150px.

To use an SVG file of your own, add any SVG icon first, then replace it with your file from the WordPress media library. The library opens from the layer's SVG Source button on the stage, and from the thumbnail in the Layer panel's SVG Content section.

Container (Action Menu)

Opens a menu of container layers, which hold other layers.

Options:

• _Group: Adds an empty group layer. Layers placed inside it move, animate and show or hide together.
• _{2 Columns}: Adds a row layer divided into two equal columns.
• _{3 Columns}: Adds a row layer divided into three equal columns.
• _{4 Columns}: Adds a row layer divided into four equal columns.

Navigation (Action Menu)

Opens a menu of ready-made navigation controls. Each is built from ordinary layers with the relevant actions attached, so it can be restyled like any other layer and is an alternative to the module-wide navigation configured in the Navigation Panel of the Settings Sidebar.

Options:

• _{Next Slide Button}: Adds a button with a right arrow icon and a Next Slide action.
• _{Previous Slide Button}: Adds a button with a left arrow icon and a Previous Slide action.
• _{Slideshow Play/Pause Toggle Button}: Adds a toggle button showing a pause icon, and a play icon in its toggled state, that pauses and resumes the slideshow.
• _Bullets: Adds a bullet navigation group, one bullet per slide, with a Selected Bullet carrying a progress indicator and an Idle Bullet for every other slide.
• _{Tabs with Thumbs}: Adds a tab navigation group, one tab per slide, each showing the slide's thumbnail and title, with the selected tab carrying a progress bar.
• _Tabs: Adds a tab navigation group, one tab per slide, each showing the slide's title, with the selected tab carrying a progress bar.
• _Thumbnails: Adds a thumbnail navigation group, one thumbnail per slide, with the selected thumbnail carrying a progress bar.

Import Layer (Button)

Opens the Select Module window listing every module on the site. Choose a module, then one of its slides, including its Static Slide, and the Layer Import dialog lists that slide's layers as a tree with a switch beside each. Switch on the layers wanted and click Import Selected Layers to copy them into the current slide.

Layer Placement

While the Add Sidebar is open, a dashed marker on the stage shows where the next layer will be placed, and its icon changes to match the entry under the pointer. With no layer selected, the new layer goes first in the slide's content flow. With a layer selected, the new layer is inserted before it, or inside it when the selected layer is a group or a column. Once added, the new layer is selected and its settings open in the Layer panel of the Design Mode sidebar.

Adding Layers by Dropping Files

Image and video files can also be dragged from the desktop straight onto the stage. A drop zone appears reading Drop Image to Add Layer or Drop Video to Add Layer, the file is uploaded to the WordPress media library, and it is added as a layer of the matching type. With the DepthForge addon enabled, .glb 3D model files are accepted the same way.