How to easily enable „infinite Scroll“ in the WordPress Total Theme (or others)

It is really modern to use the infinite scroll effect, though I am not quite sure I I am really a fan of it. Whenever there are more posts available than you want to initially show on a page, you could use pagination or simple „infinite scroll“. So when the user scrolls to the bottom the next few posts will be loaded.

How to implement this fearzre if there is just a „Load More“ button present?

Actually If you don’t have this functionality provided, as in the total theme where some Visual composer module slack this function, you can easily add it to any theme. It is as simple as dropping a few lines of code to the functions.php.

Add this and enable infinite scroll in any theme

Just add this code snippet with a script that auto triggers a click on a certain button element selected by jQuery. It works out of the box with the total theme but can be easily adapted for use with any theme but changing the button selector.

add_action( 'wp_footer', function() { ?>
  <script>
    jQuery(function(){ //on document ready
    jQuery(document).scroll(function (e) { //bind scroll event

        var intBottomMargin = 300; //Pixels from bottom when script should trigger

        //if less than intBottomMargin px from bottom
        if (jQuery(window).scrollTop() >= jQuery(document).height() - jQuery(window).height() - intBottomMargin) {
            jQuery(".vcex-loadmore a").click(); //trigger click
        }

    });
});
  </script>
<?php }, 99 );