Posted on by

Fixing broken pagination links in themes with smooth scrolling

There are several WordPress themes that use javascipt to make page anchors scroll smoothly. The problem is, this code “hijacks” the pagination links generated by Participants Database, forcing them to scroll instead of change the page. It may be possible with your theme to disable smooth scrolling so the list pagination can work again, but I’ve found that, generally, theme developers haven’t supplied a way to avoid this.

Update of August 4, 2016:

As of version 1.7.0.3, there is a setting under the advanced tab called “Use Pagination Scroll Anchors” that allows you to turn off the scroll anchor that scrolls the page back up to the top of the list when you change pages. These scroll anchors trigger a scroll, so the theme javascript preempts the link function to do it’s smooth scroll thing. Uncheck this setting and in most cases, the pagination links will begin working again.

How to fix if you don’t have the latest version installed:

To fix this, we have to add some of our own code to let the pagination links work again.

(Note that this code won’t work will all themes that have this problem, some themes do things differently, so the fix won’t work. Ask around the theme support forums for help with this if your theme doesn’t respond to the code here.)

What we need to do is add a filter function that removes the “anchor” from the pagination links. This anchor is what scrolls the page back to the top of the list when you change pages. If we remove the anchor, the theme’s “smooth scrolling” won’t kick in and the pagination links will work. The filter function is called on the ‘pdb-pagination_configuration’ filter that is built into the plugin, which is there to give the user a way to alter the pagination links HTML.

You’ll need to be handy editing PHP files: if these instructions don’t make sense, you probably don’t have the necessary basic knowledge to do this yourself.

The best way to do this is to create a simple plugin by creating a PHP file, pasting in the following code and uploading it to the plugins directory. Activate it, and it will do it’s thing.

Simple plugin:

<?php
/**
 * Plugin Name: Remove Anchors from PDB List Pagination Links
 * Description: modifies the pagination links to to remove the anchor so that 
 *              theme smooth scrolling won't interfere with changing pages
 */
add_filter( 'pdb-pagination_configuration', 'xnau_fix_list_pagination_links' );
/**
 * modifies the pagination links to to remove the anchor
 *
 * @param array $config the pagination configuration array
 * @return array
 */
function xnau_fix_list_pagination_links ( $config ) {

 // split the added variables string at the hash #
 $parts = explode( '#', $config['add_variables'] );

 // only use everything in front of the hash
 $config['add_variables'] = $parts[0];
 
 return $config;
}

Upload it, activate it and the problem is fixed!

NOTE: This post was edited on 6/13/16 to make it simpler, also it’s a more robust method than the originally posted code.

7 thoughts on “Fixing broken pagination links in themes with smooth scrolling

  1. This didn’t work for me

    1. It works on mobile but not laptop. kind of a deal breaker with a lot of records :(

    2. Scratch that – it doesn’t work on mobile now either.

      1. This “fix” is a way to address a specific problem caused by some themes that use URL anchors to initiate a smooth scroll. It won’t work in all cases. I suggest you contact your theme support with the problem.

        1. Thanks Roland. Hope you had a happy Thanksgiving!

  2. Thank you for this!!!!

  3. There are several WordPress themes that use javascipt to make page anchors scroll smoothly. The problem is, this code

Leave a Reply

Your email address will not be published. Required fields are marked *

Would you like to be notified of followup comments via e-mail? You can also subscribe without commenting.

7 thoughts on “Fixing broken pagination links in themes with smooth scrolling

  1. This didn’t work for me

    1. It works on mobile but not laptop. kind of a deal breaker with a lot of records :(

    2. Scratch that – it doesn’t work on mobile now either.

      1. This “fix” is a way to address a specific problem caused by some themes that use URL anchors to initiate a smooth scroll. It won’t work in all cases. I suggest you contact your theme support with the problem.

        1. Thanks Roland. Hope you had a happy Thanksgiving!

  2. Thank you for this!!!!

  3. There are several WordPress themes that use javascipt to make page anchors scroll smoothly. The problem is, this code

Leave a Reply

Your email address will not be published. Required fields are marked *

Would you like to be notified of followup comments via e-mail? You can also subscribe without commenting.