AJAX pagination can enhance the user experience by allowing seamless content loading without refreshing the page. However, there are instances where disabling AJAX pagination in the Blog Module may be necessary for compatibility, performance, or customization reasons.
In this article, we will guide you through the process of disabling AJAX pagination in Divi’s Blog Module.
The Blog Module uses AJAX pagination to load older posts. When you click on the Older entries link, the Blog module reloads instead of refreshing the entire page
The pagination links have the ?et_blog parameter to avoid pagination clashing with the main query. It does not impact SEO since the URLs have the "canonical" URL set to the main page.
Remove the AJAX Pagination on all Blog module instances across your entire website
Go to WordPress Dashboard → Divi → Theme Option → Integration tab → Header
Add this JS code:
<script>
(function ($) {
$(document).ready(function () {
$(".et_pb_module.et_pb_posts .pagination a, .et_pb_blog_grid .pagination a").click(function () {
window.location.href = $(this).attr('href');
return false;
});
});
})(jQuery);
</script>
Remove the AJAX Pagination only on a specific page
Edit the page containing the Blog Module and for which you want to deactivate the AJAX pagination
After the Blog module, in the page layout, insert the Code module
Add this JS code to the Code Module:
<script>
(function ($) {
$(document).ready(function () {
$(".et_pb_module.et_pb_posts .pagination a, .et_pb_blog_grid .pagination a").click(function () {
window.location.href = $(this).attr('href');
return false;
});
});
})(jQuery);
</script>
Remove the AJAX Pagination only for a specific instance of the Blog Module
Open the Blog module's settings by clicking on the Gear icon
Go to Advanced Tab → CSS ID & Classes → CSS Class and set a custom CSS class such as dt-blog-no-ajax
Go to Divi → Theme Option → Integration tab → Header and add this JS code:
<script>
(function ($) {
$(document).ready(function () {
$(".dt-blog-no-ajax .pagination a").click(function () {
window.location.href = $(this).attr('href');
return false;
});
});
})(jQuery);
</script>