Adding content to Beaver Builder pricing tables
Styling Beaver Builder pricing tables
Beaver Builder Pricing Tables are only available in the premium version of Beaver Builder
There are two levels of editing for the Pricing Table module…
- Pricing Table (Group Settings)
- Pricing Box (Individual Settings)
Pricing Table (Group Settings)
When you customize any element using the pricing table setting, you automatically customize every pricing box inside that pricing table.
For instance, moving the highlight row from the price row to the title row is a Pricing Table setting. And so it affects all pricing boxes in that Pricing Table.
Pricing Box (Individual Settings)
To customize one individual pricing box, use the pricing box setting.
You can easily see if you’re editing the whole pricing table or just one of the pricing boxes by looking at the label at the top of the dialogue box when you make your changes.
To edit an individual pricing box…
- Select a pricing row. This opens the first dialogue box: Pricing Table.
- In the Pricing Table dialogue box, after adding pricing boxes, select one of the blue text links. This opens the editing dialogue box for that specific Pricing Box.
When you click any Pricing Table row, this dialogue box opens…
First add some pricing boxes, then click the blue links to edit any individual pricing box.
Look carefully at the label at the top of each dialogue box.
- Pricing Table: edits the row, or block of pricing boxes.
- Pricing Box: edits one specific pricing box at a time.
Some things you can edit when using the Beaver Builder pricing tables module…
- Border colour and thickness.
- Choose rounded or square borders.
- Butt the pricing tables tight against each other or have a margin between them.
- Highlight the title row or highlight the price row.
- Change the font size for the price and title.
- Equalize column heights.
- Customize the button style and add an icon to the button.
- Add a different background colour inside each individual column.
- Add a top margin to push the first and third columns down to make a stepped layout.
- Style the colours used in each column independently.
- Add text after the price via the “Duration” dialogue box.
- Change the button text and open a new window on click.
- Choose from flat, gradient or transparent buttons.
- Add an icon before or after the button.
The amount of customization you can do to the styling of the pricing table module is fairly limited, but once you understand how to use it, it’s easy.
And with a bit of imagination, you can make pricing tables that are more than adequate for needs of most small business.
And don’t forget, these pricing tables are only available in the premium version of Beaver builder.
That’s all for this tutorial, thanks for reading and bye for now 🙂