What is Navigation Preset?
Navigation Preset allows you to prepare a navigation style for carousels and use it across whole website. This type of preset is slightly different than standard presets for shortcodes. Once created preset can be used inside multiple different shortcodes with Navigation support.
How to install Navigation Presets?
In order to get Navigation Presets installed, please navigate to Massive Panel and scroll down for Presets section. Then choose Navigation from Select Shortcode dropdown. After a while, all predefined presets will be installed in your website. All of them can be edited, renamed or deleted.
List of available options in Navigation Preset
Below, we present all of the Navigation Preset options.
| Option | Description |
|---|---|
| Main Preset | Presets are used to easily configure your shortcode. You can choose one of the premade presets or create your own. You can preview the available presets with Preview & Load Preset button. Learn More » |
| Layout Select | Layout styles let you choose the target layout after you define the shortcode options. |
| Show on Hover | Enable to show navigation after user hovers over the slider. |
| Overlay Color | Choose overlay color. |
| Buttons Position | Choose buttons position. |
| Overlay – Padding | It is one of most common field across our shortcodes. The simple mode, contain options for padding size (for all edges) and unit (px, em or %). Advanced Settings give an additional control for width of each edge (top, bottom, left and right). Learn More » |
| Previous – Icon | Icon field from Massive Addons allow you to choose from 8 different icons fonts like: Font Awesome, Elegant Icons, Elegant Line Icons, Elusive Icons, Material Icons, Massive Icons, TypeIcons, Dashicons. What’s more, our Icon Field provide a possibility to use a character or image instead of icon from icons fonts. Learn More » |
| Previous – Margin | It is one of most common field across our shortcodes. The simple mode, contain options for margin size (for all edges) and unit (px, em or %). Advanced Settings give an additional control for width of each edge (top, bottom, left and right). Learn More » |
| Next – Icon | Icon field from Massive Addons allow you to choose from 8 different icons fonts like: Font Awesome, Elegant Icons, Elegant Line Icons, Elusive Icons, Material Icons, Massive Icons, TypeIcons, Dashicons. What’s more, our Icon Field provide a possibility to use a character or image instead of icon from icons fonts. Learn More » |
| Next – Margin | It is one of most common field across our shortcodes. The simple mode, contain options for margin size (for all edges) and unit (px, em or %). Advanced Settings give an additional control for width of each edge (top, bottom, left and right). Learn More » |
| Background | Background field contains options needed to create an awesome background inside our shortcodes. You can choose from color (with opacity/alpha channel), radial and linear gradient or custom image. Each background type have some additional options for best outcome control. Learn More » |
| Border | In simple mode, this field offer a settings for width (for all edges), style, color and radius. Advanced Settings give an additional control for width of each edge (top, bottom, left and right) Learn More » |
| Padding | It is one of most common field across our shortcodes. The simple mode, contain options for padding size (for all edges) and unit (px, em or %). Advanced Settings give an additional control for width of each edge (top, bottom, left and right). Learn More » |
| Icon Color | If you want to change the icon color after hover choose a different one from the color picker below. |
| Border Color | If you want to change the border color after hover choose a different one from the color picker below. |
| Hover – Background | Background field contains options needed to create an awesome background inside our shortcodes. You can choose from color (with opacity/alpha channel), radial and linear gradient or custom image. Each background type have some additional options for best outcome control. Learn More » |
| Hover Effect | Choose background hover animation style. |
| Custom Offset | |
| Custom Class | Add your custom class to the element. Mostly used for custom CSS/JS. |
How to use a created or installed Navigation Preset?
Installed and created presets are available for later usage inside all shortcodes with Navigation support (mostly Carousels). To load a navigation preset to shortcode, please create or edit a shortcode (Carousel Image in our example) then select preset which should be loaded at Navigation tab(1) from preset field(2) .
If you made a changes to preset fields, you would need to click at Save Navigation Preset(3) button before closing the edit popup.
How to create a new Navigation Preset?
To create a new preset, add a corresponding shortcode or edit an existing one. In popup, find a Navigation Preset field and click at New(1) button.
An empty Navigation Preset form will appear. All properties have been described in a options table above.
When you finish with settings, please take a look at preview field. If the end effect satisfy you, click Save Changes button and start using your new Navigation Preset.
How to modify or rename a Navigation Preset?
Navigation Preset can be modified only from shortcode edit popup. To make changes to existing preset please select a preset from dropdown list which you want to update (if different from already selected) and click ‘Pencil’ icon. The same actions are needed to modify preset name.
There are few things that you should remember:
- Navigation Preset changes will affect all elements using the modified preset
- instead of editing a predefined presets (our presets) we recommend to create a new one which will contain your settings
How to delete a Navigation Preset?
Each Navigation Preset can be deleted from the shortcode popup by selecting it from dropdown list and clicking ‘Trash‘ icon. The same mechanism is used for Typography Presets.