Modificarea HTML-ului Generat de wp_list_comments()
Dezvolt o temă WordPress pentru care aș dori ca marca temporală a fiecărui comentariu să fie înfășurată într-un element <span>
pentru a o putea stiliza cu reguli CSS. Cu toate acestea, funcția wp_list_comments()
așa cum o folosesc în șablonul comments.php
al temei mele nu pare să ofere opțiuni pentru a modifica HTML-ul generat:
<ol class="comment-list">
<?php
wp_list_comments( array(
'style' => 'ol',
'format' => 'html5',
'short_ping' => true,
) );
?>
</ol>
care generează marcaje temporale astfel:
<time datetime="2015-12-21T19:09:49+00:00"> 21 decembrie 2015 la 19:09 </time>
Cum pot modifica rezultatul funcției pentru a include un element <span>
în jurul fiecărui element <time>
fără a modifica fișierele core?
Am încercat să mă uit în functions.php
al temei mele, precum și în fișierele WordPress wp-includes/comment.php
și wp-includes/comment-template.php
. Niciunul dintre acestea nu se ocupă de structura efectivă a tag-urilor marcajelor temporale ale comentariilor generate de wp_list_comments()
, așa că nu am găsit nimic cu care să mă pot juca.

Iată câteva opțiuni pentru a suprascrie layout-ul nativ pentru fiecare comentariu:
Abordarea #1 - Suprascrierea start_el()
cu un walker personalizat
Să definim formatul nostru personalizat de comentarii wpse:
// Argumente pentru wp_list_comments()
$args = [
'style' => 'ol',
'format' => 'html5',
'short_ping' => true,
];
// Folosim walker-ul nostru personalizat dacă este disponibil
if( class_exists( 'WPSE_Walker_Comment' ) )
{
$args['format'] = 'wpse';
$args['walker'] = new WPSE_Walker_Comment;
}
wp_list_comments( $args );
cu un walker de comentarii personalizat, care gestionează acest nou format (PHP 5.4+):
/**
* Walker de comentarii personalizat
*
* @users Walker_Comment
*/
class WPSE_Walker_Comment extends Walker_Comment
{
public function start_el( &$output, $comment, $depth = 0, $args = array(), $id = 0 )
{
// Formatul nostru personalizat 'wpse' pentru comentarii
if ( 'wpse' === $args['format'] )
{
$depth++;
$GLOBALS['comment_depth'] = $depth;
$GLOBALS['comment'] = $comment;
// Începem bufferizarea output-ului
ob_start();
// Folosim șablonul nativ de comentarii html5
$this->html5_comment( $comment, $depth, $args );
// Modificările noastre (înfășurăm <time> cu <span>)
$output .= str_replace(
[ '<time ', '</time>' ],
['<span><time ', '</time></span>' ],
ob_get_clean()
);
}
else
{
// Revenim la formatele native de comentarii
parent::start_el( $output, $comment, $depth, $args, $id );
}
}
} // sfârșitul clasei
Observați cum gestionăm formatul nostru personalizat de comentarii. De asemenea, refolosim metoda start_el()
din clasa părinte pentru formatele native, apelând parent::start_el()
.
De remarcat că folosim bufferizarea output-ului într-un mod similar cu clasa părinte.
Abordarea #2 - Suprascrierea html5_comment()
cu un walker personalizat
Putem suprascrie direct metoda nativă Walker_Comment::html5_comment()
, în felul următor:
// Argumente pentru wp_list_comments()
$args = [
'style' => 'ol',
'format' => 'html5',
'short_ping' => true,
'walker' => new WPSE_Walker_Comment,
];
wp_list_comments( $args );
unde clasa noastră de walker personalizat este definită în functions.php
astfel:
if ( !class_exists( 'WPSE_Walker_Comment' ) ) {
/**
* Walker de comentarii personalizat
*
* @users Walker_Comment
*/
class WPSE_Walker_Comment extends Walker_Comment {
public function html5_comment( $comment, $depth, $args ) {
// Aici plasăm modificările metodei Walker_Comment::html5_comment()
}
}
// sfârșitul clasei WPSE_Walker_Comment
} // sfârșitul condiției '!class_exists'
Aici putem păstra modificările noastre la metoda Walker_Comment::html5_comment()
. Este destul de lungă, așa că nu am adăugat-o aici.
Abordarea #3 - Callback personalizat
Aici am folosi atributul callback
:
// Argumente pentru wp_list_comments()
$args = [
'style' => 'ol',
'format' => 'html5',
'short_ping' => true,
];
// Folosim callback-ul nostru personalizat dacă este disponibil
if( function_exists( 'wpse_comment_callback' ) )
{
$args['format'] = 'wpse';
$args['callback'] = 'wpse_comment_callback';
}
wp_list_comments( $args );
unde definim wpse_comment_callback()
conform nevoilor noastre.
/**
* Callback personalizat pentru comentarii
*/
function wpse_comment_callback( $comment, $depth, $args )
{
// Modificăm metoda Walker_Comment::html5_comment() conform nevoilor
// și o plasăm aici
}
unde am putea începe prin a simula metoda Walker_Comment::html5_comment()
. Dar trebuie să ne amintim să înlocuim toate referințele la $this
.
Abordarea #4 - Suprascrierea argumentelor wp_list_comments()
cu un filtru
Putem folosi și filtrul wp_list_comments_args
pentru a modifica argumentele funcției wp_list_comments()
cu metodele de mai sus.
Există și alte abordări disponibile, dar sperăm că le puteți adapta la nevoile dumneavoastră.
