In this article you will find the unique information about Pricing shortcode. If you want to learn about some more general issues like using a shortcode etc. See the list bellow or browse the general section.
This shortcode is a container. In order to work properly, container shortcodes needs to be filled with items.
Examples Of Use:
You can see a beautiful use of Pricing on one of our pre-made templates: Babaco, Kiwi, Yew.
Detailed shortcode description
Bellow you will find a table with all of the shortcodes features and fields. On the right you will find a description for each field/section. All of this settings are available in shortcodes popup, it will be displayed once you create a new shortcode or hit the edit (pencil icon) button.
GeneralElementsButtonSliderNavigation
| 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 » |
| Columns Number | Select number of displayed columns. |
| 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 » |
| 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 » |
| 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 » |
| Enter Animation | Enter Animation allow to specify an appear effect for shortcode. Learn More » |
| Custom Class | Add your custom class to the element. Mostly used for custom CSS/JS. |
| Option | Description |
|---|---|
| Titles | Check to disable titles in pricing columns. |
| Title – Typography | Typography field gives you a control over almost all font settings. It also incorporate a Typography Preset functionality. Learn More » |
| Title – 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 » |
| Prices | Check to disable prices in pricing columns. |
| Price – Typography | Typography field gives you a control over almost all font settings. It also incorporate a Typography Preset functionality. Learn More » |
| Price – 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 » |
| Properties – Typography | Typography field gives you a control over almost all font settings. It also incorporate a Typography Preset functionality. Learn More » |
| Properties – 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 » |
| Option | Description |
|---|---|
| Button | Check to disable buttons in pricing columns. |
| 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 » |
| Typography | Typography field gives you a control over almost all font settings. It also incorporate a Typography Preset functionality. Learn More » |
| 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 » |
| Display Effect | Select icon display style: None: hide the icon; Stay: display icon on selected side; Slide In: slide icon in from selected side; Push Out: push out button text with icon from selected side. |
| Custom Gap | Define gap between icon and text. |
| 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 » |
| 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 » |
| Title Color | If you want to change the title color after hover choose a different one from the color picker below. |
| Icon Color | If you want to change the icon 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 | Select background hover animation style: Fade: simple fade in effect; Slide In: slide background in from selected side; Expand: expand background from selected position. |
| Custom Offset | Define custom offset for expanded background size. Offset might be different dependent on the button size. |
| Hover – 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 » |
| Custom Class | Add your custom class to the element. Mostly used for custom CSS/JS. |
| Option | Description |
|---|---|
| Slider | Check to disable slider. |
| Single Scroll | Check to enable single item scroll. Navigating through pricing box will jump by only one item at a time. Leave unchecked to scroll by all visible items. |
| Slide Show | Check to enable slide show. Pricing box will auto slide once the slide show delay pass. |
| Slide Show Delay | Specify delay between slides. |
| 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. |
This shortcode comes with a lots of features. Check the list below for more details (click on each feature to learn more):
