Wrong anchor on comment navigation links

[splorp]

If comments are set to display across multiple pages (Settings > Discussion > Other comment settings > Break comments into pages …), the anchor associated with the next and previous comment navigation is incorrect. By default, the anchor is defined as #comments in the WordPress core.

The anchor needs to be changed to #comment to match the ID used on the comment form wrapper.

function get_comments_link($post_id = 0) {
    return get_permalink($post_id) . '#comments';
}

This function is found in comment-template.php.

There are also references to #comments in feed-atom.php and link-template.php … which is odd, because every other reference to the comment form anchor in the current WordPress core points to #respond.

[funkylarma]

Would it be acceptable to wrap the current comments in a section element with an id of #comments?

[splorp]

By default, WordPress wraps the comments in <div id="comments"> […] </div> element. We removed that from the Tersus theme because it’s just extra cruftiness that isn’t required to style the individual comments.

It could be treated as a separate section element, I suppose. But I wouldn’t necessarily add another id value to it. The comments are currently containing within the <section id="content"> […] </section> element, but outside of the <article class="hentry" id="post-nnn"> […] </article> element. It could be argued that the comments should be related to the article itself.

[funkylarma]

Good point. I guess you might be able to put together the case that comments reside in an aside of the section that contains the article. Will have to look further into this and see if there is any ground rules, it does appears to be a bit of a grey area on this.

[splorp]

Here’s a couple of takes on the subject.

• The Semantics of HTML5 Structural Elements by Colin Fahrion
• Designing a Blog with HTML5 by Bruce Lawson

I’m leaning towards the latter formatting, similar to this:

<article>

    <header>
        <h1>post_title</h1>
        <time>post_date</time>
    </header>

    post_content

    <footer>post_metadata</footer>

    <article>
        <time>comment_date_and_time</time>
        <p>comment_content</p>
    </article>
    <article>
        <time>comment_date_and_time</time>
        <p>comment_content</p>
    </article>
    <article>
        <time>comment_date_and_time</time>
        <p>comment_content</p>
    </article>

    <nav>prev_next_post_links</nav>

</article>