Widget Guidelines

How To Use & Customize Pricing Table Widget

Estimated reading: 2 minutes 38 views

Pricing Table Widget can be used to create pricing tables for your website the easy way.

Follow the step-by-step instructions:

1. Go to Menu Romethemekit.

2. And you will be able to see the Pricing Table.

3. Click Add New Container.

4. Select your layout : Flexbox or Grid.

5. On the canvas select your structure.

6. Drag the widget from the Elementor 

7. Drop it on the selected area.

8. Setting your header content here, you can enable or disable the Sale Price.

9. Add or Edit the description here.

  • Click Add Item.

10. Setting Button :

  • Click Show to add icon.
  • Click Icon Library Choose Icon Click Insert.
  • Setting Icon Position & Button Text.

11. Setting Ribbon :

  • Click Yes to enable ribbon.
  • Setting Icon Position & Ribbon Text.

12. Setting Footer :

  • Edit the footer text or delete the text if you don’t want to show the footer.

13. Container Style (used to customize the container style) :

  • Click Style → Container.
  • Customize the border type, border color, padding, border radius, and background color.

14. Header Style (used to customize the header style) :

  • Click Style → Header.
  • Customize the typography, alignment, padding, spacing, text and background color heading and subheading.

15. Sale Price Style (used to customize the sale price style) :

  • Click Style → Sale Price.
  • Customize the typography, text color and spacing.

16. Price Style (used to customize the price style) :

  • Click Style → Price.
  • Customize the position, typography, text color price and period, spacing, alignment, and position.

17. Feature Style (used to customize the feature or description style) :

  • Click Style → Feature.
  • Customize the feature style, click Yes to show divider.
  • Customize the divider style as you wish here.

18. Button Style (used to customize the button style) :

  • Click Style → Button.
  • Customize the typography, padding, margin, alignment, size, icon spacing, text, button and icon color.

19. Ribbon Style (used to customize the ribbon style) :

  • Click Style → Ribbon.
  • Customize the typography, text and background color, border type.

20. Footer Style (used to customize the footer style) :

  • Click Style → Footer.
  • Customize the typography, alignment, padding, text and background color.

21. Don’t forget to click Publish to save the changes.

Share this Doc

How To Use & Customize Pricing Table Widget

Or copy link

CONTENTS