Product grid limit number of products – Part 2

Hi,
I looked for the pastebin clip in your functions.php, I didn’t see it so I added it and since your “pages” are actually “archives” I changed the “IF” statement to this:

if(is_archive(array( 99))) {
			$pages = 5;
		}

because the term for the archive is “99”, but it still is not working well, I will have to research more unless @Ismael sees the error and can correct 🙂

PS, I also commented out the woocommerce pagination function because I understood from above that this was not the issue.

Best regards,
Mike

Hi,
As I understand your opening post, the reason you were having issues with the solution in the other thread, is because you want it to work on one page only and you want the pagination to display the highlighting for the current page, I adjusted the previous solution to achieve both of these.
Please clear your browser cache and check.
This is the new script:

function custom_pagination(){
  ?>
  <script>
(function($){
  $(document).ready(function(){
	var url = document.URL;
	var theURL = url.split("page")[0];
  	$new_pagination = '<nav class="pagination"><a href="'+theURL+'" class="p1">1</a><a href="'+theURL+'page/2/" class="p2">2</a><a href="'+theURL+'page/3/" class="p3">3</a><a href="'+theURL+'page/4/" class="p4">4</a><a href="'+theURL+'page/5/" class="p5">5</a></nav>'
if ($("body").is('.page-id-5480')){
	$( "nav.pagination" ).replaceWith( $new_pagination );
} else {}
$('#top:not(.paged-2):not(.paged-3):not(.paged-4):not(.paged-5) .pagination .p1').addClass('current');
$('#top.paged-2 .pagination .p2').addClass('current');
$('#top.paged-3 .pagination .p3').addClass('current');
$('#top.paged-4 .pagination .p4').addClass('current');
$('#top.paged-5 .pagination .p5').addClass('current');
});
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'custom_pagination');

Best regards,
Mike

Hi,
Glad it helps, on your other pages the pagination looks like this:

and on the page we are working on I see this:

Where do you see “1 of 5”, “2 of 5”, “3 of 5” ?
In the script above for the pagination links you can change the number “2” to “2 of 5”, for example, like this:

function custom_pagination(){
  ?>
  <script>
(function($){
  $(document).ready(function(){
	var url = document.URL;
	var theURL = url.split("page")[0];
  	$new_pagination = '<nav class="pagination"><a href="'+theURL+'" class="p1">1 of 5</a><a href="'+theURL+'page/2/" class="p2">2 of 5</a><a href="'+theURL+'page/3/" class="p3">3 of 5</a><a href="'+theURL+'page/4/" class="p4">4 of 5</a><a href="'+theURL+'page/5/" class="p5">5 of 5</a></nav>'
if ($("body").is('.page-id-5480')){
	$( "nav.pagination" ).replaceWith( $new_pagination );
} else {}
$('#top:not(.paged-2):not(.paged-3):not(.paged-4):not(.paged-5) .pagination .p1').addClass('current');
$('#top.paged-2 .pagination .p2').addClass('current');
$('#top.paged-3 .pagination .p3').addClass('current');
$('#top.paged-4 .pagination .p4').addClass('current');
$('#top.paged-5 .pagination .p5').addClass('current');
});
})(jQuery);
</script>
<?php
}
add_action('wp_footer', 'custom_pagination');

But this will change the size of your pagination, and not match the rest of your site.
Am I understanding correctly?

Best regards,
Mike

Hi,
Thanks, I adjusted the script to add that and make the leading number change based on the pagination 😅
Please clear your browser cache and check.

This is the updated script:

function custom_pagination(){
  ?>
  <script>
(function($){
  $(document).ready(function(){
	var url = document.URL;
	var theURL = url.split("page")[0];
	var countURL = url.split("/")[5]|| "1";
  	$new_pagination = '<nav class="pagination"><span class="pagination-meta">Page '+countURL+' sur 5</span><a href="'+theURL+'" class="p1">1</a> <a href="'+theURL+'page/2/" class="p2">2</a> <a href="'+theURL+'page/3/" class="p3">3</a> <a href="'+theURL+'page/4/" class="p4">4</a> <a href="'+theURL+'page/5/" class="p5">5</a> </nav>'
if ($("body").is('.page-id-5480')){
	$( "nav.pagination" ).replaceWith( $new_pagination );
} else {}
$('#top:not(.paged-2):not(.paged-3):not(.paged-4):not(.paged-5) .pagination .p1').addClass('current');
$('#top.paged-2 .pagination .p2').addClass('current');
$('#top.paged-3 .pagination .p3').addClass('current');
$('#top.paged-4 .pagination .p4').addClass('current');
$('#top.paged-5 .pagination .p5').addClass('current');
});
})(jQuery);

Best regards,
Mike

Hi,
Glad we were able to help, we will close this now. Thank you for using Enfold.

For your information, you can take a look at Enfold documentation here
For any other questions or issues, feel free to start new threads in the Enfold forum and we will gladly try to help you :)

Best regards,
Mike