Cambiar HTML producido por wp_list_comments ()

2

Estoy desarrollando un tema de WordPress para el cual me gustaría que la marca de tiempo de cada comentario esté envuelta en un elemento <span> para darle un estilo con reglas CSS. Sin embargo, la función wp_list_comments() , ya que la uso en la plantilla comments.php de mi tema no parece proporcionar opciones para modificar el HTML producido:

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

que produce marcas de tiempo como tales:

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

¿Cómo puedo alterar la salida de la función para incluir un elemento <span> alrededor de cada elemento <time> sin alterar los archivos principales?

He intentado buscar en functions.php de mi tema, así como en WordPress wp-includes/comment.php y wp-includes/comment-template.php . Ninguno de ellos trata con la estructura de etiquetas real de las marcas de tiempo de comentarios generadas por wp_list_comments() , por lo que no tenía nada con lo que jugar.

    
pregunta marlakash 02.02.2016 - 22:47

1 respuesta

8

Aquí hay algunas opciones sobre cómo podemos anular el diseño nativo para cada comentario:

Enfoque # 1: Anulación de start_el() con un caminante personalizado

Definamos nuestro formato de comentario personalizado wpse :

// 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 );

con un andador de comentarios personalizado, que maneja este nuevo formato (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

Observe cómo manejamos nuestro formato de comentario personalizado. También reutilizamos el método start_el() de la clase principal para los formatos nativos, llamando a parent::start_el() .

También tenga en cuenta que usamos el búfer de salida de una manera similar a la clase principal.

Enfoque # 2 - Anulando html5_comment() con un caminante personalizado

También podemos anular directamente el método nativo Walker_Comment::html5_comment() , de la siguiente manera:

// 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 );

donde nuestra clase de caminante personalizado se define como:

/**
 * 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

Aquí podemos almacenar nuestras modificaciones en el método. Pero debemos recordar reemplazar todas las referencias a Walker_Comment::html5_comment() .

Hay otros enfoques disponibles, pero esperamos que puedas ajustarlos a tus necesidades.

    
respondido por el birgire 04.02.2016 - 12:24

Lea otras preguntas en las etiquetas