Sliding-Down Pricing Tables

Divi Layout

Starts at $3.90
license details »
Add to Cart
Product Details

Sliding-Down Pricing Tables

A compact Sliding-Down Pricing Tables easy to customize with modular Css classes

This layout is a Pricing section with a compact tables design. Every table will slide down on hover and you can customize the design by toggling modular Css classes.

The zip file includes:

  • .JSON file
  • Layout Screenshot
  • Readme file

The layout is made of three rows (you can delete the two ones you are not interested in) plus the Code row:
–  1st Row: The entire Pricing module slide down on hover;
–  2nd Row: Single Pricing tables slide down on hover;
–  3rd Row: Central Featured Pricing tab visible and the other two sliding down on hover;
–  Code Row: A Code Module in which is stored all the advanced css and jQuery to make the design properly work.

By toggling the classes below you will have good margins of customizations without having to touch the css code; however if you need to customize further you can modify the css both in the Row/Module Advanced Settings and in the last Code Module added in the section in which is stored all the advanced css.

–  ‘heading_icon‘ -> Toggling this class the heading icon will be shown or not. It has been designed as a background icon so as not to be too invasive in the overall design but you can edit both the icon (we use ETModules font family for ET Icons) and the design (color, font-size etc.) in the ‘:after’ custom css of each single tab.
–  ‘labelled‘ -> Toggling this class you can make visible or not the labels of each tab. You can customize the text and background color directly in the ‘:before’ custom css of each single tab (obiously if you want to show just one label you have to activate this class for the pricing module, then you will remove the ‘content’ property in the ‘:before’ of the tabs for which you don’t want to show the label).
–  ‘custom_bullet‘ -> This class if active will transform the default list bullets in ET Icons (by default “\51” and “\52” but you can change these values in the Code module under ‘List Bullet Style’ section).


We offer a basic support that includes:
a)  fixes of any display problems;
b)  one minor design improvement. This can involve a specific part of the layout and in a way that the improvement doesn’t change the global design: could be for example moving a label or the heading icon, or change the icon itself or even making any changes that are not upsetting compared to the original design;

The time needed to get support may vary; any fixes will be supported in about 1/2 days while for the improvement support the time needed will be from 1 to 5 days.

NOTE: If you see display issues about the bullet list icons please check in the Code module (List Bullet Style section) that the content has one backward slash preceding the icon code (alphanumeric or numeric): in our case the list bullet icons should be respectively “\52” and “\51”!

Product Support & Contact Information

If you have any support related or other questions, please contact How i-Divi t via the form located on their Author Profile.

You must log in and be a buyer of this download to submit a review.

Sliding-Down Pricing Tables

Divi Layout




Last Updated

2 Years Ago

Visit This Seller's Profile

Sold by How i-Divi t

Contact This Seller

Have any questions or need product support? Contact This Seller

Get Email Updates (It's Free)

No spam ever. Only Divi related updates. You need this.

Pin It on Pinterest