Pagination. Classes name mistake for item of pagination

  • Resolved Andry

    (@blackstar1991)


    1 year, 1 month ago

    Hi, I have created pagination for comments using the default method.

    <?php

$args = array(
    'post_id' => get_the_ID(), 
    'parent' => 0, 
    'count' => true, 
);
$top_level_comments_count = get_comments($args);
$max_pages = ceil($top_level_comments_count / $per_page);

$args = array(
    'screen_reader_text' => __('Comments navigation'),
    'aria_label' => __('Comments'),
    'class' => 'comments-pagination',
    'format' => '',
    'total' => $max_pages,
    'current' => $page,
    'prev_text' => '?',
    'next_text' => '?',
    'type' => 'list',
    'echo' => false, // Установите это значение в false
);

$pagination = get_the_comments_pagination($args);
$pagination = str_replace('#comments', '', $pagination);
?>
<div class="company-rewiew-pagination">
    <?php echo $pagination; ?>
</div>

    This challenge created this pagination for me

    <div class="company-rewiew-pagination">
  <nav class="navigation comments-pagination" aria-label="Comments">
    <h2 class="screen-reader-text">Comments navigation</h2>
    <div class="nav-links">
      <ul class="page-numbers">
        <li><span aria-current="page" class="page-numbers current">1</span></li>
        <li><a class="page-numbers" >2</a></li>
        <li><a class="page-numbers" >3</a></li>
        <li><a class="next page-numbers" >?</a></li>
      </ul>
    </div>
  </nav>
</div>

    But I got a bug into name of class wrapper. It has the same class like for <li><a class="page-numbers"> item. class="page-numbers" Can You fix this mistake ? Can you make for item <li><a class="page-number"> name?

    I also don’t understand, why if I choose 'type' => 'plain' I will get different name of classes.

    <div class="company-rewiew-pagination">
  <nav class="navigation comments-pagination" aria-label="Comments">
    <h2 class="screen-reader-text">Comments navigation</h2>
    <div class="nav-links"><span aria-current="page" class="page-numbers current">1</span>
      <a class="page-numbers" >2</a>
      <a class="page-numbers" >3</a>
      <a class="next page-numbers" >?</a></div>
  </nav>
</div>

    with the same problem – <code><a class="next page-numbers"</code> should be <a class="next page-number"

Viewing 5 replies - 1 through 5 (of 5 total)
  • Gerry

    (@metamezzo)

    Hello, the get_the_comments_pagination function uses paginate_links and it’s here where you will see why 'type' => 'plain' returns a different output.

    You could use the paginate_links_output filter to replace the li .page-numbers to li .page-number . Could you explain why the li .page-numbers is a bug for you? When selecting the page numbers, you could be specific and say li .page-numbers and that would be sufficient to distinguish from ul.page-numbers. Good luck!

    Thread Starter Andry

    (@blackstar1991)

    Because it doesn’t make sense.

    Why at all, then, assign the class .page-numbers to the <ul> tag? If you read the documentation about the class attribute for tags, you will see that it is used for elements (if about CSS) with the same logic for styalize. What are the same general logic between ul.page-numbers and li.page-numbers in this pagination? It’s not here.

    Gerry

    (@metamezzo)

    Hello, thanks for explaining your concern. I wouldn’t know the specific reason(s) or logic for why the WP comments was structured the way it is, but having a common class name would make it easier to style these elements the same way; for example, to have them all use the same font styles or colour. Even the link you referred to has a section on ‘Different Elements Can Share Same Class’, with an <h2> and <p> tag sharing the same class name.

    You could raise a ticket for it, or put out a PR to have it changed. For now though it looks like you can use the paginate_links_output filter to help with your use case. Good luck!

    Thread Starter Andry

    (@blackstar1991)

    Did you understand that WP developers made the same name of class for ul.page-numbers and li.page-numbers in this case ? That’s wrong, When you try too set any styles for ul element by using class name you will get the same for li elements. If you will use BEM metodologi you will need to use tag selector too in this moment.

    Can you write who can change this moment in WP? Thank you

    Gerry

    (@metamezzo)

    Hi, if your last question meant who could change the code, then I won’t know, sorry, but it could be you to change it if you would like to contribute to WP, by raising a ticket or issuing a PR, as mentioned in my earlier reply. You could also ask in the WP Slack channel.

    The ul tag and the li > a tags having the same class name is not an issue for me, personally, but I can understand where you’re coming from. Good luck!

Viewing 5 replies - 1 through 5 (of 5 total)
  • The topic ‘Pagination. Classes name mistake for item of pagination’ is closed to new replies.