Pricing Tables
Pricing tables shortcode helps you to insert styled pricing tables in different styles in your content.
Style: Select one of eight pre-defined styles for your pricing table
Button Icon: Icon to display on the button in pricing table.
Click on “Save changes”. After that, click on “+” symbol in your added Pricing table element to start inserting pricing columns
Step 2. Inserting One Column
Select “Pricing table column” to insert a new column to your pricing table:
Top Choice: if you wish to set a marker label to your pricing column, you can write a short text here like “NEW!”
Highlighted: choose this option if you wish that this column will be highlighted / emphasized
Column width: here you can set the width of your column – should it be wider for 3 columns in the row or narrower for 4 columns in the row
Top Choice Color: set the font color for your „top choice“ text label
Top Choice Background: set the background color for your „top choice“ text label
Click on “Save changes” to insert your pricing column
Step 3. Inserting Column’s Content
Now you can start filling your pricing column with content. To do this click on “+” symbol in your added pricing column and select the content element you wish to add.
Column’s Header
With this element you can define content and its style for the header of the pricing column:
Column title: Type in the title of your pricing column
Column subtitle: Type in subtitle of your pricing column. Pls note: this subtitle works not for all styles; in few styles it is hidden
Price background color: Choose a background color for your price in header area
Price backgroun image: Or, alternatively, here you can choose a background image for your price in pricing column’s header area
Currency: Type in the currency symbol to be show
Price: Enter the price to be shownTime period: Enter the period of time for the price, i.e. “per month”
Styles: Here you can choose, if you wish to use default styles for title, subtitle, price and time period or if you wish to customize it’s colors:
Column’s Row
After adding a column’s header with title, price etc. you can additionally add different rows with descriptions
To add new row with column’s description, click on „+“ below tzhe header you have already added
and choose „Column’s Row“
After that you get a WYSIWYG editor, where you can start typing your decription. After saving, youcan clone this row several time in order to get additional rows with the same content – the easiest way to populate your column’s row:
Column’s Footer
And finally you would probably want to add a footer area to your pricing column with some button. In order to do this, choose following element:
You will get a settings dialog, where you can customize the look of your pricing column’s button (see description above in section „Button“ )
Column’s Extra Title
Sometimes it is useful to use some additional titles in your pricing row, for example:
To do this, use „Column’s extra title“ element,
fill it with content and move it on the position in your pricing column, where you wish to have it.