Divi Tips

Reduce the search result page featured image size

Reduce the search result page featured image size

Add the following CSS code to the Divi theme options area or your child theme style.css file. [css] /* reduce the search result image size so it doesnt fill screen */ .search-results .entry-featured-image-url img {max-height:300px; width:auto;} [/css]

read more
Swap Divi columns on mobile and tablet devices

Swap Divi columns on mobile and tablet devices

Add the CSS class "flip" to any Divi row settings in the Advanced tab. Add the following CSS code to the Divi theme options area or your child theme style.css file. [css] /* swap columns on mobile */ @media only screen and ( max-width: 980px) { .flip { display:...

read more
Hide or show WordPress menu items on mobile devices

Hide or show WordPress menu items on mobile devices

In Appearance/Menus click on the Screen Options tab at the very top right. In the "Show advanced menu properties" area, check the box next to CSS Classes. Use the either "hide-mobile" or "show-mobile" in the menu class field. NOTE: The max-width is the default Divi...

read more
Format superscript text in Divi

Format superscript text in Divi

Add the following CSS code to the Divi theme options area or your child theme style.css file. [css] sub, sup { font-size: 25%; /* Zero out the line-height so that it doesn't interfere with the positioning that follows */ line-height: 0; position: relative;...

read more
How to make Divi mobile menu appear sooner

How to make Divi mobile menu appear sooner

You may find it useful to make the mobile menu appear sooner than the default screen width. Add the CSS in the Divi theme options area. Change the max-width to whatever you like.   [css] @media only screen and (max-width: 1320px){ #et_mobile_nav_menu { display:...

read more