Divi Mobi Column Classes | How To Use Plugin?

Enhance Your Divi Mobile Experience

Create Gorgeous, High Converting Mobile First Website Designs In Minutes… Using Our Extensive Divi CSS Library

blank

Keep Divi Column ratios and build aesthetically beautiful mobile layouts for the Divi Builder with our expertly crafted CSS library. Get access to our over 30+ Divi mobile layouts. See what can be done using this plugin. See Main Menu for Demos.

Regular Section Tutorial

After activating the CSS plugin, the next thing you do is select the row that you want and type or copy the related CSS class name in the class field for the row container.

STEP 1.

Select the Regular section

blank

Step 2.

Select your desired row

blank

STEP 3.

Copy the related class name from the regular section chart for the row that you chose.

blank

STEP 4.

Open up the Row advanced settings and type the class name in the CSS Class field.

CSS Class Field image

Result

Before

blank

After

blank

Specialty Section Tutorial

As before, after activating the plugin, all you have to do next is enter the correlating class names. However there are two classes we must enter. One for the section column layout and the other for the row container embedded in the specialty section column layout.

STEP 1.

Select the Specialty Section

blank

STEP 2.

Select the desired section layout

blank

STEP 3.

Copy the related class name from the the column layout that you choose. See specialty section chart below.

blank

STEP 4.

Open up the Section settings and type the class name in the CSS Class field.

CSS Class Field image

STEP 5.

This is extra step for the specialty section. After choosing your desired section layout and it’s class name, select the respective row layout and it’s class name from the as seen in the regular section chart. Open the settings for the row container and add the CSS class name to the CSS field. Note that most row containers for the specialty section has up to 3 columns with 1 exception with 4.

blank

STEP 6.

All done.
But wait there is more! With this plugin you can also…

 

1. Mobile Menu Headers

BEFORE

Loading...

AFTER

Loading...

2. Row Layouts

BEFORE

Loading...

AFTER

Loading...

3. Tab Layouts

BEFORE

Loading...

AFTER

Loading...

4. Combining Two Rows

BEFORE

Loading...

AFTER

Loading...

5. Combining Two Sections

BEFORE

Loading...

AFTER

Loading...

Subscribe

Join Our Divi Mobi First Community

Get access to all our Divi Mobi First tips, articles and cutting-edge helpful tutorials that are easy to understand for small businesses, bloggers, and non-techy Divi website owners, direct to your inbox.

blank

By Jemila

blank

Completely revolutionize the way you think about building Divi Websites.
Get Instant Access Now

blank

Check Out These Related Posts

0 Comments

0 Comments

Submit a Comment

Your email address will not be published. Required fields are marked *