[DIVI Theme] How to Control the Lazy Loading Behavior of DIVI Theme?

Sometimes, the default behavior of the lazy loading of the WordPress DIVI theme is very undesirable:

  • when the lazy loading elements are place close to the bottom of the page, it will just never show up
  • when viewing on mobile devices on a network or WIFI, it takes too long to load the lazy loading elements on the fly and the web page layout just looks broken

The workaround to this lazy loading problem is to adjust the sensitivity of the lazy loading.

In the js directory of the DIVI theme (wp-content >themes > DIVI > js), open custom.js and go to line 719 (or search around that line as the line number may be changed depending the version of the theme). You will be able to see the following block of code:

if ( $.fn.waypoint ) {
   $( '.et_pb_counter_container, .et-waypoint' ).waypoint( {
      offset: '60%',
      handler: function() {
         $(this).addClass( 'et-animated' );

Change the offset value from ‘60%’ to “100%’ or even ‘200%’ (this will virtually remove the lazy loading behavior), you might want to adjust the value to suit your needs.



Please login to post comments.

Login thru Twitter / Facebook


Log in with Facebook