The Pricing Table widget allows you to showcase different pricing plans with feature lists, buttons, icons, and custom styles. It’s perfect for SaaS products, service packages, hosting plans, and more. You can customize the layout, style, button behavior, and feature items with full control over the content.
🚀 How to Enable the Pricing Table Widget
To start using the Image Widget, follow these steps:
Navigate to your WordPress dashboard.
Go to Topper Pack → Widgets.
Locate the Pricing Table widget from the list.
Toggle the switch to “On” to enable it.
The widget is now available in the Elementor editor.
1. Add the Widget
Search for “Pricing” in the Elementor widgets panel.
Drag and drop the Pricing Table widget into your layout.
2. Select a Style
Under the Styles section, choose from the available pre-designed pricing table layouts.
You can also enable or disable the card Shape for design preference.
3. Price Settings
Icon Type: Choose whether to use an image, icon, or no icon at all.
Price Label: Add a label (e.g., /month, /year).
Price: Set the actual price (e.g., $10.00).
4. Title Settings
Title: Give your pricing plan a name (e.g., Basic Plan).
Small Title (optional): Add a subtitle like “No credit card required.”
HTML Tag: Choose the appropriate heading tag for SEO (e.g., H2, H3).
5. Content Features
Add multiple features using the List section.
Each feature includes:
A Title (e.g., Cyber Analytics)
An optional Description (can include links or HTML)
An Icon
Enable/disable toggle for default visibility
6. Button Settings
Button Styles: Choose a button design from multiple presets.
Button Text: Enter CTA text (e.g., Purchase Now, Start with This).
Link: Enter the destination URL.
Show Icon: Enable an icon inside the button if needed.
🎨 Styling Options
Go to the Style tab for complete design control.
🔸 Box
Set background color/image, border type, radius, padding, margin, shadow.
🔸 Price & Duration
Customize font, size, color of price and duration label.
🔸 Content Box
Style the feature list: spacing, typography, icons.
🔸 Button
Control button padding, border radius, background, hover effects, and icon spacing.
📱 Responsive Controls
Ensure the pricing table looks great on all devices:
Adjust margin, padding, alignment, and typography per device (desktop, tablet, mobile).
📝 Example Use Case
Create a Monthly Subscription Plan with the following setup:
Pricing Table
The Pricing Table widget allows you to showcase different pricing plans with feature lists, buttons, icons, and custom styles. It’s perfect for SaaS products, service packages, hosting plans, and more. You can customize the layout, style, button behavior, and feature items with full control over the content.
🚀 How to Enable the Pricing Table Widget
To start using the Image Widget, follow these steps:
1. Add the Widget
2. Select a Style
3. Price Settings
4. Title Settings
5. Content Features
6. Button Settings
🎨 Styling Options
Go to the Style tab for complete design control.
🔸 Box
🔸 Price & Duration
🔸 Content Box
🔸 Button
📱 Responsive Controls
Ensure the pricing table looks great on all devices:
📝 Example Use Case
Create a Monthly Subscription Plan with the following setup: