web-dev-qa-db-de.com

HTML ändern Produziert von wp_list_comments ()

Ich entwickle ein WordPress-Theme, für das ich möchte, dass der Zeitstempel jedes Kommentars in ein <span> -Element eingebunden wird, um es mit CSS-Regeln zu gestalten. Allerdings bietet die Funktion wp_list_comments() , wie ich sie in der Vorlage comments.php meines Themas verwende, anscheinend keine Optionen zum Ändern des erzeugten HTML:

<ol class="comment-list">
    <?php
        wp_list_comments( array(
            'style'       => 'ol',
            'format'      => 'html5',
            'short_ping'  => true,
        ) );
    ?>
</ol>

die Zeitstempel als solche erzeugt:

<time datetime="2015-12-21T19:09:49+00:00"> december 21st,  2015 on 19:09 </time>

Wie kann ich die Ausgabe der Funktion so ändern, dass um jedes <span>-Element ein <time>-Element eingefügt wird, ohne die Kerndateien zu ändern?

Ich habe versucht, den functions.php meines Themas sowie den wp-includes/comment.php von WordPress und den wp-includes/comment-template.php anzusehen. Keiner von ihnen befasst sich mit der eigentlichen Tag-Struktur der Kommentar-Zeitstempel, die von wp_list_comments() generiert wurden. Daher gab es nichts, mit dem ich spielen konnte.

commentstimestampwp-list-commentscomments-template
2
marlakash

Hier sind einige Optionen, wie wir das native Layout für jeden Kommentar überschreiben können:

Ansatz Nr. 1 - Überschreiben von start_el() mit einem benutzerdefinierten Walker

Definieren wir unser benutzerdefiniertes wpse Kommentarformat:

// Arguments for wp_list_comments() 
$args = [
    'style'       => 'ol',
    'format'      => 'html5',
    'short_ping'  => true,
];

// Use our custom walker if it's available
if( class_exists( 'WPSE_Walker_Comment' ) )
{
    $args['format'] = 'wpse';
    $args['walker'] = new WPSE_Walker_Comment;
}

wp_list_comments( $args );

mit einem benutzerdefinierten Kommentar-Walker, der dieses neue Format handhabt (PHP 5.4+):

/**
 * Custom comment walker
 *
 * @users Walker_Comment
 */
class WPSE_Walker_Comment extends Walker_Comment
{
    public function start_el( &$output, $comment, $depth = 0, $args = array(), $id = 0 )
    {
       // Our custom 'wpse' comment format
       if ( 'wpse' === $args['format'] )
       {
           $depth++;
           $GLOBALS['comment_depth'] = $depth;
           $GLOBALS['comment'] = $comment;

           // Start output buffering
           ob_start();

           // Let's use the native html5 comment template
           $this->html5_comment( $comment, $depth, $args );

           // Our modifications (wrap <time> with <span>)
           $output .= str_replace( 
               [ '<time ', '</time>' ], 
               ['<span><time ', '</time></span>' ], 
               ob_get_clean() 
           );
       }
       else
       {
           // Fallback for the native comment formats
           parent::start_el( $output, $comment, $depth, $args, $id );
       }    
    }
} // end class

Beachten Sie, wie wir mit unserem benutzerdefinierten Kommentarformat umgehen. Wir verwenden auch die Methode start_el() aus der Klasse parent für die nativen Formate, indem wir parent::start_el() aufrufen.

Beachten Sie auch, dass wir die Ausgabepufferung auf ähnliche Weise wie die übergeordnete Klasse verwenden.

Ansatz 2 - Überschreiben von html5_comment() mit einem benutzerdefinierten Walker

Wir können die native Methode Walker_Comment::html5_comment() auch auf folgende Weise direkt überschreiben:

// Arguments for wp_list_comments() 
$args = [
    'style'       => 'ol',
    'format'      => 'html5',
    'short_ping'  => true,
];

// Use our custom walker if it's available
if( class_exists( 'WPSE_Walker_Comment' ) )
{
    $args['walker'] = new WPSE_Walker_Comment;
}

wp_list_comments( $args );

wo unsere benutzerdefinierte Walker-Klasse definiert ist als:

/**
 * Custom comment walker
 *
 * @users Walker_Comment
 */
class WPSE_Walker_Comment extends Walker_Comment
{
    public function html5_comment( $comment, $depth, $args )
    {
        // Place the modifications of the Walker_Comment::html5_comment() method here
    }
} // end class

Hier können wir unsere Änderungen an der Walker_Comment::html5_comment() -Methode speichern. Es ist ziemlich lang, deshalb habe ich es hier nicht hinzugefügt.

Ansatz 3 - Benutzerdefinierter Rückruf

Hier würden wir das Attribut callback verwenden:

// Arguments for wp_list_comments() 
$args = [
    'style'       => 'ol',
    'format'      => 'html5',
    'short_ping'  => true,
];

// Use our custom callback if it's available
if( function_exists( 'wpse_comment_callback' ) )
{
    $args['format'] = 'wpse';
    $args['callback'] = 'wpse_comment_callback';
}

wp_list_comments( $args );

wo wir die wpse_comment_callback() nach unseren bedürfnissen definieren.

/**
 * Custom comment callback
 */
function wpse_comment_callback( $comment, $depth, $args )
{
    // Modify the Walker_Comment::html5_comment() method to our needs 
    // and place it here
}

hier könnten wir mit der Simulation der Methode Walker_Comment::html5_comment() beginnen. Wir müssen jedoch daran denken, alle Verweise auf $this zu ersetzen.

Es gibt andere Ansätze, aber Sie können diese hoffentlich an Ihre Bedürfnisse anpassen.

8
birgire