Table of Contents
- Add Modules via Slider Revolution Blocks
- Editing Block Settings
- Add Modules to a Page via Shortcodes
- Publish Your Post or Page
Once you have a module [?]
A module in Slider Revolution acts as a container for slides, which in turn act as containers for layers. Modules are created and edited with the module editor.
A "module" is a single, self contained piece of content. You can think of this as being similar to the way a post or page in regular WordPress is a self contained piece of content.
A module can represent any kind of content Slider Revolution is capable of creating, such as a slider, carousel, hero unit, navigation menu, posts display and so on.
Multiple modules can be combined to form rich content such as complete sites and landing pages. designed and ready to publish you’ll need to add it into a regular piece of WordPress content, such as a post or page. Here you’ll learn how to do so via the special Slider Revolution block that comes with the plugin, or via shortcodes.
Note: This article assumes you are familiar with adding content to WordPress posts and pages via the Gutenberg block system. If you are new to Gutenberg blocks you can learn how to work with them at: https://wordpress.org/gutenberg/
Publishing Modules (Video Tutorial)
Everything covered in the ‘Publishing Modules’ section of the manual can be learned by watching the below ‘Module Editing Basics: Publishing Modules’ tutorial video:
If you watched the above video in full you can skip the remainder of the ‘Publishing Modules’ section of the manual and proceed to the next section of the manual: Intermediate Editing.
Or continue reading to learn how to add modules to your WordPress page or post using blocks or shortcodes.
Add Modules via Slider Revolution Blocks
In your WordPress page or post editor, add a new block of the type Slider Revolution.
Upon adding the block a gallery will automatically open showing all the modules you have created:
Hover over the module you want and click the “+” button to insert it.
Editing Block Settings
Once a block has been inserted you can modify its settings by clicking the button at the top right corner:
In the block settings dialog box you can control how your module interacts with the layout of the rest of your site:
Under Module Layout you can switch between Auto Width, Full Width and Full Screen. These are the module size settings we covered in our earlier guide on creating blank modules.
Under Block Offsets you can add empty space around each side of the module. The icon at the top of each column shows you the side of your module that the offset will apply to. The icon to the left of each row identifies the responsive display size that your offset will apply to.
Under Insert Module as Pop Up Module you can set your modules to display as pop ups. If you set Use Pop Up to On, your module will now display as a pop up. Additional options to control how your module pop up is displayed will appear on the right side of the block settings dialogue box:
The two main settings here are:
1) Pop Up After Time – Set this to On to delay the display of your module until the time in milliseconds set in the After (ms) field has passed.
2) Pop Up at Scroll Position – Set this to On to delay the display of your module until a user has scrolled down the number of pixels specified in the Offset field.
Back on the Slider Revolution block, you can also click the Select Module button to choose a different module:
And you can click the little pencil icon to go straight into the module editor [?]
The "Module Editor" is the tool used to create & modify modules.
Through this visual, drag & drop, no-code interface you can add various types of layers, animation and special FX to your modules, as well as managing slides and configuring options. to make modifications to the module:
Add Modules to a Page via Shortcodes
If you want to use a shortcode instead of a Slider Revolution block, locate the module you would like to use in the main Slider Revolution plugin area. Hover over the module, click the down arrow on the bottom right, then click Embed.
After clicking Embed, the Standard Module Embedding window will open. Copy the first shortcode listed by clicking the blue button to its right:
Paste the copied shortcode directly into your WordPress post or page editor. A Gutenberg shortcode block will be automatically created:
Publish Your Post or Page
Once you have used either a block or shortcode to add a module to your WordPress post or page you can publish it. Visit that post or page on the front end of your WordPress site to see the module(s) displayed.
Up Next: Using the Blank Page Template
Sometimes you might use Slider Revolution modules to create a design that needs to take up the full browser viewport, such as a landing page or complete website. If this is the case, you’ll need a way to hide theme elements such as menus, headers and so on.
In the next guide you’ll learn how to hide unwanted theme elements by using Slider Revolution’s in-built blank page template.