web-dev-qa-db-fra.com

Ajout d'ancre à paginate_links + bug d'ancrage Safari

Je ne comprends pas très bien comment fonctionne la réécriture de pagination_links(). Voici ma fonction de pagination:

$big = 999999999;
$translated = __( 'Page ', 'epc' );

echo paginate_links( array(
    'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
    'format' => '?page=%#%', // Here I'd like to add my anchor #result
    'current' => max( 1, get_query_var( 'paged' ) ),
    'total' => $wp_query->max_num_pages,
    'before_page_number' => '<span class="screen-reader-text">'.$translated.' </span>',
    'prev_text' => __( 'Précédent', 'epc' ),
    'next_text' => __( 'Suivant', 'epc' ),
    'type' => 'list',
    ) 
);

Cependant, j'ai assez permalien activé donc le format ?page=%#% est changé en /page/#/. Jusqu'ici tout va bien. Mais j'ai deux problèmes:

  • Premièrement, ma requête a deux variables dans le permalien comme so ?programme=10&type=2. Quand je vais sur la deuxième page, wordpress ajoute #038;type=2 à la fin du permalien (maintenant j'ai ?programme=10&type=2#038;type=2). Je ne sais pas pourquoi.

  • Deuxièmement, si j'essaie d'ajouter une ancre au format comme ceci, ?page=%#%#result, cela ne fonctionnera pas. Si j'essaie de renommer la variable en ?nb=%#%#result, cela ne fonctionne toujours pas. J'ai même essayé /page/#/#result car il correspond à la jolie structure permalien mais toujours pas de chance. Quelqu'un peut-il me mettre sur la bonne voie ou expliquer ce qui se passe ici?

Merci!


UPDATE 1

Grâce au commentaire @bonger, le lien permanent fonctionne parfaitement avec ce code mis à jour:

$big = 999999999;
$translated = __( 'Page ', 'epc' );
echo paginate_links( array(
    'base' => str_replace( $big, '%#%', get_pagenum_link( $big, false ) ),
    'current' => max( 1, get_query_var( 'paged' ) ),
    'total' => $wp_query->max_num_pages,
    'before_page_number' => '<span class="screen-reader-text">'.$translated.' </span>',
    'prev_text' => __( 'Précédent', 'epc' ),
    'next_text' => __( 'Suivant', 'epc' ),
    'type' => 'list',
    'add_fragment' => '#result',
) );

Cependant, après avoir creusé un peu plus, lorsque vous cliquez dessus, le lien précédent perd l'ancre dans Safari uniquement (fonctionne correctement sous Chrome et Firefox). J'ai lu cet ancien message et il semble qu'il y ait quelque chose de bizarre dans la façon dont Safari gère la redirection.

Sachez-le bien, mon lien précédent affiche ce href http://mywebsite.com/page/1/#result ou http://mywebsite.com/page/1/?programme=10&type=2#result en fonction du filtrage. Cependant, lorsque je clique dessus, il redirige vers http://mywebsite.com/ ou http://mywebsite.com/?programme=10&type=2. Apparemment, Safari a besoin du / avant le #anchor mais je ne sais pas comment l'ajouter, car si je l'ajoute à l'argument fragment, il est échappé. Des idées?

1
Pipo

Si cela peut aider quelqu'un, voici la réponse complète aux problèmes qui pourraient survenir lorsque vous souhaitez ajouter la pagination Wordpress avec des ancres à une page de modèle.


ÉTAPE 1

Suivez l'exemple du Codex pour que la fonction paginate_links() s'applique à votre requête personnalisée et non à la requête principale.


ÉTAPE 2

Votre fonction devrait ressembler au code ci-dessous:

global $wp_query;

$big = 999999999; // need an unlikely integer
$translated = __( 'Page', 'mytextdomain' ); // Supply translatable string

echo paginate_links( array(
    'base' => str_replace( $big, '%#%', esc_url( get_pagenum_link( $big ) ) ),
    'format' => '?paged=%#%',
    'current' => max( 1, get_query_var('paged') ),
    'total' => $wp_query->max_num_pages,
    'before_page_number' => '<span class="screen-reader-text">'.$translated.' </span>'
) );

Maintenant, plusieurs problèmes peuvent survenir avec ce code, voici quelques solutions:

  • Il est préférable de supprimer la ligne 'format' => '?paged=%#%', et de laisser Wordpress travailler avec le formatage permanent (il peut en résulter des problèmes si le lien permanent est activé);

  • Vous pouvez avoir un problème d'échappement avec le # de votre ancre si vous échappez à la sortie de get_pagenum_link()function. Dans ce cas, supprimez simplement la fonction esc_url() dans cette partie esc_url( get_pagenum_link( $big ) );

  • Il y a un argument pour ajouter votre ancre, il s'appelle add_fragment.

Vérifiez le codex pour voir tous les arguments que vous pouvez utiliser avec cette fonction. En fin de compte, votre code ressemblera à ceci:

$big = 999999999;
$translated = __( 'Page', 'mytextdomain' );
echo paginate_links( array(
    'base' => str_replace( $big, '%#%', get_pagenum_link( $big, false ) ),
    'current' => max( 1, get_query_var( 'paged' ) ),
    'total' => $wp_query->max_num_pages,
    'before_page_number' => '<span class="screen-reader-text">'.$translated.' </span>',
    'prev_text' => __( 'Précédent', 'epc' ), // In case you want to change the previous link text
    'next_text' => __( 'Suivant', 'epc' ), In case you want to change the next link text
    'type' => 'list', // How you want the return value to be formatted
    'add_fragment' => '#result', // Your anchor
) );

ÉTAPE 3

Pour finir, il y a un problème avec la façon dont Safari gère la redirection des pages avec ancre. Vous constaterez peut-être que l'ancre n'est pas appliquée lors du retour à la première page de Safari. Ce que vous devez faire (si vous avez assez de permalien activé) est de filtrer le page/1 pour empêcher la redirection. Ainsi:

add_filter( 'paginate_links', 'custom_pagination_redirect' );

function custom_pagination_redirect( $link ) {
    return preg_replace( '%/page/1/%', '/', $link );
}

Et c'est tout! Merci beaucoup à @bonger pour cette aide précieuse!

1
Pipo