Divi Image Sizes

A good handy guide for Divi image sizes.

  • Full Width Edge To Edge: 1920×1080
  • 1 column: 1080 x 608
  • 3/4 column: 795 x 447
  • 2/3 column: 700 x 394
  • 1/2 column: 510 x 287
  • 1/3 column: 320 x 181
  • 1/4 column: 225 x 128

height should follow 16:9 if possible

Divi: Sub-Menu resize

Tired of hunting this down E-V-E-R-Y time I need it. 🙂

/*Sub menu adjustments */
#top-menu li ul { width: 280px; }
#top-menu li li a { width: 250px; font-size: 105%; }

Divi Custom Blurbs

This coolness: http://divisoup.com/custom-blurb-module/

+

This tweak to the CSS

/*———- [Custom Blurb Module] ———-*/
.OurWorkmanship img {
border: 5px solid ‪#‎FA1010‬;
border-radius: 50%;
margin-top: -170px;
}
.OurProducts img {
border: 5px solid #FA1010;
border-radius: 50%;
margin-top: -170px;
}
.OurServicePromise img {
border: 5px solid #FA1010;
border-radius: 50%;
margin-top: -170px;
}

.OurServicePromise {
webkit-border-radius: 30px;
moz-border-radius: 30px;
border-radius: 30px;
}

.OurProducts {
webkit-border-radius: 30px;
moz-border-radius: 30px;
border-radius: 30px;
}

.OurWorkmanship {
webkit-border-radius: 30px;
moz-border-radius: 30px;
border-radius: 30px;
}

Getting Divi, WooCommrece and Products Per Page Plugin to play nice

Whew, that’s a long title!

So I’m branching out into using the Divi theme a bit more.  It’s an OK theme, I probably haven’t explored all of it’s customizations enough, but it’s no Avada. 🙂  It’s nice though.

If you are using

Then here’s a tip.  It wont work…out of the box at least.  However after much searching I found a quick fix here.

Just add the code below to the functions.php file in your child theme (because you know to ALWAYS use a child theme, right?)

/* products per page with - this fixes it when using divi */
add_action( 'pre_get_posts', 'wppp_extra_filter', 30 );
function wppp_extra_filter( $query = false ) {
$query->set( 'posts_per_page', apply_filters( 'loop_shop_per_page', 12 ) );
}

And presto, it’s working!