In this guide, we’ll show you how to add a Pricing Table Flip Box widget to your Elementor website. The Pricing Table Flip Box widget lets you display your product, service, or package pricing in an interactive flip-box layout. It’s a great way to present essential pricing details on the front and reveal additional features, descriptions, or call-to-action buttons on the back. Whether you’re promoting products, subscription plans, or service packages, this widget helps make your pricing sections engaging, modern, and easy to understand.
Let’s explore the customization options available in the Pricing Table Flip Box widget for Elementor below.
Add a Pricing Table Flip Box Widget to Elementor
This widget requires Unlimited Elements Pro version installed and activated on your WordPress website.
Add a Pricing Table Flip Box Widget to a Container in Elementor
Elementor Pricing Table Flip Box Widget General Settings
Show Graphic Element
Enables or disables the visibility of an icon or image at the top of the card.
Show Title
Controls whether the main heading of the pricing table is displayed.
Title
Allows you to input the primary text for the pricing plan name.
Show List
Toggles the visibility of the features or bullet points list.
Show Subtitle
Enables or disables the display of a secondary text line.
Subtitle
Used to enter supporting text, such as a category or short tagline.
Show Price
Controls whether the cost information is visible on the card.
Price
Allows you to enter the numerical value and currency for the plan.
Show Description
Toggles the visibility of the short text summary area.
Description
A text field for adding detailed information about the pricing plan.
Show Button
Enables or disables the call-to-action button.
Button Link
Sets the destination URL for when a user clicks the button.
Button Text
Allows you to customize the label appearing on the button.
Transition Duration (ms)
Adjusts the speed of the flip animation between the front and back of the card.
Keep Hovered
Forces the card to stay on its "back" state to make it easier to design and view the reverse side.
Items Source
A dropdown menu used to select the origin of the pricing features list. Options include:
- Items: Manually enter list items directly in the widget.
- Dynamic Sources: Pull data from Posts, WooCommerce Products, ACF Custom Fields, JSON/CSV, Gallery, Terms, Users, Menu, RSS, Instagram, or API Integrations.
Debug - Show Input Data
A toggle switch that, when enabled, helps troubleshoot by displaying the raw data being pulled from the selected source.
List Item Preview
Displays a header for each entry to help identify and organize the list.
Title
A text field for entering the name or label of the feature.
Link
A field for entering a URL to make the specific list item a clickable hyperlink.
Link Options (Gear Icon)
Opens additional settings for the link, such as "Open in new window" or "Add nofollow".
Dynamic Tags
Allows you to pull content for the Title or Link from dynamic website data.
AI Writing Tool
Provides access to AI-generated suggestions for the item text.
Duplicate
An icon button used to copy an existing item and all its internal settings.
Add Item
A button used to create a new entry at the bottom of the list.
Enable Schema
Enable Schema for the selected widget.
Schema Source
Choose the Schema Source:
- From List
- Custom
Custom JSON Schema
We can also add a Custom JSON Schema.
Schema Type
Choose the Schema Type:
FAQ (FAQ Page)
List of Person (Person)
How To
Recipe
Courses (Course)
Books (Book)
Items List (ItemList)
Event
Places (Place)
Products (Product)
Tourist Destinations (TouristDestination)
Event Series (EventSeries)
Music Playlist (MusicPlaylist)
Search Results Page (SearchResultsPage)
We are continuously expanding the list of supported Schema types in upcoming releases.
Schema Main Title
Enter a Schema title that describes the action, for example, how to tie your shoes.
Enable Fields Mapping
Enable manual field mapping by roles. Post-related fields are applicable only When the content is sourced from posts.
Show Schema Debug
Display Schema debug information in the front-end footer.
Elementor Pricing Table Flip Box Widget Style Settings.
Border Radius
Adjusts the roundness of the card's corners for all sides or individually.
Box Shadow
Controls the shadow effect applied to the card.
Front Card / Back Card Tabs
Switches between styling the front-facing side and the reverse side of the card.
Padding
Sets the inner spacing between the card edge and its content.
Background Type
Switches between classic (solid/image) and gradient backgrounds.
Background Color
Sets the primary color for the card background.
Background Image
Allows for an image to be uploaded and set as the card background.
Border Type
Selects the style of the border (e.g., Solid, Double, Dotted).
Border Width
Controls the thickness of the card's border.
Border Color
Sets the color of the applied border.
Width
Controls the horizontal size of the graphic element container.
Height
Controls the vertical size of the graphic element container.
Icon Size
Adjusts the size of the icon itself.
Background Color
Sets a color behind the icon or graphic.
Color
Sets the color of the icon or graphic.
Border Type
Select the border style for the players' boxes.
Default
None
Solid
Double
Dotted
Dashed
Groove
Border Radius
Adjust the roundness of the corners for the players' boxes.
Box Shadow
Adds a shadow effect to the graphic element.
Typography
Controls the font settings for the list items.
List Text Color
Sets the color for the text in the list.
Border Type
Selects a border style for the list.
Border Width
Controls the thickness of the list's border.
Border Color
Sets the color for the list's border.
List Padding
Sets the inner spacing for the entire list container.
Item Padding
Sets the inner spacing for individual items within the list.
Text Align
Aligns the text for the entire list (Left, Center, Right).
Typography
Opens the text styling controls for font family, size, weight, and line height.
Color
Sets the color of the subtitle text.
Text Shadow
Allows for the configuration of a shadow effect behind the subtitle text.
Text Align
Controls the alignment of the subtitle text (e.g., Left, Center, Right).
Margin
Adjusts the external spacing around the subtitle, with options to link or unlink sides for individual control.
Typography
Opens the text styling controls for font family, size, weight, and line height.
Color
Sets the color of the subtitle text.
Text Shadow
Allows for the configuration of a shadow effect behind the subtitle text.
Text Align
Controls the alignment of the subtitle text (e.g., Left, Center, Right).
Margin
Adjusts the external spacing around the subtitle, with options to link or unlink sides for individual control.
Typography
Opens the text styling controls for font family, size, weight, and line height.
Color
Sets the color of the subtitle text.
Text Shadow
Allows for the configuration of a shadow effect behind the subtitle text.
Text Align
Controls the alignment of the subtitle text (e.g., Left, Center, Right).
Margin
Adjusts the external spacing around the subtitle, with options to link or unlink sides for individual control.
Typography
Opens the text styling controls for font family, size, weight, and line height.
Button Padding
Controls the inner spacing between the button text and its border for all four sides.
Button Margin
Sets the outer spacing around the button to position it within the card.
Button Align
A dropdown menu to set the horizontal alignment of the button (e.g., Left, Center, Right).
Normal / Hover Tabs
Switches between styling the button's standard appearance and its appearance when a user hovers over it.
Color
Sets the color of the text inside the button.
Background Color
Sets the color of the button's background.
Text Shadow
Provides an editor to add and configure a shadow effect for the button text.
Box Shadow
Provides an editor to add and configure a shadow effect around the button itself.
Border Type
A dropdown menu to select the style of the button's border (e.g., Solid, Double).
Border Radius
Adjusts the roundness of the button's corners.
Pricing Table Flip Box Widget Design Examples For Elementor
Here are some live use cases for the Pricing Table Flip Box Widget.
Football Club Tournament Bracket Maker.
Pricing Flip Box with Gradient.
Thank you for using the Pricing Table Flip Box widget for Elementor! This free widget adds an interactive and stylish flip-box effect to your pricing sections, allowing you to showcase key details, features, and calls to action in a modern, engaging way. It’s a simple yet effective way to make your pricing stand out and improve user engagement. Need help or design ideas? Visit our demo page for examples and inspiration.