Column pricing plans
Divi pricing plans layout & tutorial
This free Divi layout and tutorial is from the Elegant Themes website blog post “Turning Columns Into Pricing Plans with Divi”.
This layout allows you to show off your pricing plans in a unique way and has 3 columns that will scale and rotate on hover. These Divi pricing plans use Divi columns and built-in options to create 3 pricing plans for your website.
The tutorial will show you how to;
- Add columns and use column transform settings to rotate and zoom in both default and hover modes
- Use gradient backgrounds to get a circular background for prices
- Use z-index to stack the columns in the right order
- Use Divi Blurb, Text and Button modules to add your pricing table content
Download this layout on the Elegant Themes blog
To download the JSON layout file for this tutorial you will need to enter an email into the subscription box on the blog post. If you are already signed up to the Elegant Themes mailing list you will not be re-added. This sign-up form is found just below the layout Demos near the top of the post.
To import the layout to your Divi website you will need to extract the zip file and drag-and-drop the JSON file into your Divi Builder page.
Affiliate disclosure* – Links to layouts on Elegant Themes and 3rd party websites may contain affiliate code. You will never pay any extra for using these links. Thanks for supporting Divi Theme Examples.