Recently a client reached out with a frustrating issue every time a visitor clicked through the pagination on their Divi blog page, the browser would automatically jump to the top of the section. Not a great user experience.
After some investigation I discovered that this is actually built-in Divi behavior. The Divi blog module triggers a jQuery.animate({scrollTop}) call after every AJAX pagination request and unfortunately there is no toggle in Divi settings to disable it. So I had to go deeper and intercept it with a custom script.
How it works
The script does two things:
- Intercepts Divi’s jQuery.animate calls and blocks any scrollTop animation on html or body, but only right after a pagination click
- Detects pagination clicks by checking if the link href contains et_blog, which is a unique identifier Divi adds to all pagination links
The fix
Add this code to Divi → Theme Options → Integration → Add code to the < body > section:
<script>
(function($) {
var paginationClicked = false;
var origAnimate = $.fn.animate;
$.fn.animate = function(props, speed, easing, callback) {
if (props && props.scrollTop !== undefined) {
var el = this[0];
if ((el === document.documentElement || el === document.body) && paginationClicked) {
if (typeof callback === 'function') callback();
if (typeof easing === 'function') easing();
paginationClicked = false;
return this;
}
}
return origAnimate.apply(this, arguments);
};
document.addEventListener('DOMContentLoaded', function() {
document.addEventListener('click', function(e) {
var target = e.target;
var href = target.getAttribute('href') || '';
if (href.indexOf('et_blog') !== -1) {
paginationClicked = true;
setTimeout(function() {
paginationClicked = false;
}, 3000);
}
}, true);
});
})(jQuery);
</script>
Written by Anton, founder of OSWOptimize and an SEO & Web Performance expert with 15+ years of experience optimizing WordPress sites, improving Core Web Vitals, and increasing search rankings.
Leave a Reply