Modificare l'HTML prodotto da wp_list_comments()

2 feb 2016, 23:47:11
Visualizzazioni: 20K
Voti: 10

Sto sviluppando un tema WordPress per il quale vorrei che il timestamp di ogni commento fosse racchiuso in un elemento <span> per poterlo stilizzare con regole CSS. Tuttavia, la funzione wp_list_comments() come la uso nel template comments.php del mio tema non sembra fornire opzioni per modificare l'HTML prodotto:

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

che produce timestamp in questo modo:

<time datetime="2015-12-21T19:09:49+00:00"> 21 dicembre 2015 alle 19:09 </time>

Come posso modificare l'output della funzione per includere un elemento <span> intorno a ciascun elemento <time> senza modificare i file core?

Ho provato a cercare nel file functions.php del mio tema, così come nei file WordPress wp-includes/comment.php e wp-includes/comment-template.php. Nessuno di questi gestisce la struttura effettiva dei tag dei timestamp dei commenti generati da wp_list_comments(), quindi non c'era nulla con cui potessi lavorare.

9
Commenti

Hai visto il codice sorgente di wp_list_comments()? Sei sicuro che sia questa la funzione responsabile e non invece, ad esempio, il template comments.php o una parte completamente diversa?

kaiser kaiser
2 feb 2016 23:51:42

Sei certo di aver effettivamente bisogno di un wrapper <span>? Perché non applicare gli stili direttamente all'elemento <time>?

bosco bosco
3 feb 2016 00:11:12

Concordo con @bosco, sembra che il <span> non sia necessario qui. Altrimenti dovresti mostrare gli argomenti della funzione wp_list_comments(), per vedere se utilizza un callback o un custom walker. Molto probabilmente stai usando il built-in Walker_Comment::html5_comment(). Una domanda correlata è stata posta qui ieri.

birgire birgire
3 feb 2016 00:43:51

@birgie mio errore - in realtà ho rimosso il suo uso di wp_list_comments() perché pensavo fosse superfluo. Corretto O.o

bosco bosco
3 feb 2016 00:50:51

ho trovato ESATTAMENTE quello che mi serviva in questo file: wp-includes/class-walker-comment.php - qui è dove potevo modificare l'html della data del commento. Volevo stilizzare l'orario in modo diverso dalla data, quindi avevo bisogno che fossero in tag separati. grazie a tutti!

marlakash marlakash
3 feb 2016 09:37:57

Spero tu non stia modificando direttamente i file del core! @marlakash

birgire birgire
3 feb 2016 13:33:24

mi piacerebbe farlo in altro modo, ma non sono sicuro di come... non ho molta esperienza nello scrivere plugin e simili. qualche suggerimento? @birgire

marlakash marlakash
4 feb 2016 00:23:51

BTW penso sia meglio mantenere il mio precedente titolo della domanda. Non avrei mai trovato questa risposta su Google. È troppo specifico... @birgire

marlakash marlakash
4 feb 2016 10:03:52

Ho messo insieme alcune opzioni per te, spero tu possa adattarle alle tue esigenze @marlakash

birgire birgire
4 feb 2016 13:25:22
Mostra i restanti 4 commenti
Tutte le risposte alla domanda 1
2
14

Ecco alcune opzioni su come possiamo sovrascrivere il layout nativo per ogni commento:

Approccio #1 - Sovrascrivere start_el() con un walker personalizzato

Definiamo il nostro formato di commento personalizzato wpse:

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

// Usa il nostro walker personalizzato se disponibile
if( class_exists( 'WPSE_Walker_Comment' ) )
{
    $args['format'] = 'wpse';
    $args['walker'] = new WPSE_Walker_Comment;
}

wp_list_comments( $args );

con un walker di commenti personalizzato, che gestisce questo nuovo formato (PHP 5.4+):

/**
 * Walker di commenti personalizzato
 *
 * @users Walker_Comment
 */
class WPSE_Walker_Comment extends Walker_Comment
{
    public function start_el( &$output, $comment, $depth = 0, $args = array(), $id = 0 )
    {
       // Il nostro formato di commento personalizzato 'wpse'
       if ( 'wpse' === $args['format'] )
       {
           $depth++;
           $GLOBALS['comment_depth'] = $depth;
           $GLOBALS['comment'] = $comment;

           // Inizia l'output buffering
           ob_start();

           // Usiamo il template di commento html5 nativo
           $this->html5_comment( $comment, $depth, $args );

           // Le nostre modifiche (avvolgiamo <time> con <span>)
           $output .= str_replace( 
               [ '<time ', '</time>' ], 
               ['<span><time ', '</time></span>' ], 
               ob_get_clean() 
           );
       }
       else
       {
           // Fallback per i formati di commento nativi
           parent::start_el( $output, $comment, $depth, $args, $id );
       }    
    }
} // fine della classe

Nota come gestiamo il nostro formato di commento personalizzato. Riusiamo anche il metodo start_el() dalla classe genitore per i formati nativi, chiamando parent::start_el().

Nota anche che usiamo l'output buffering in modo simile alla classe genitore.

Approccio #2 - Sovrascrivere html5_comment() con un walker personalizzato

Possiamo anche sovrascrivere direttamente il metodo nativo Walker_Comment::html5_comment(), nel modo seguente:

// Argomenti per wp_list_comments() 
$args = [
    'style'       => 'ol',
    'format'      => 'html5',
    'short_ping'  => true,
    'walker'      => new WPSE_Walker_Comment,
];

wp_list_comments( $args );

dove la nostra classe walker personalizzata è definita in functions.php come:

if ( !class_exists( 'WPSE_Walker_Comment' ) ) {

    /**
     * Walker di commenti personalizzato
     *
     * @users Walker_Comment
     */
    class WPSE_Walker_Comment extends Walker_Comment {

        public function html5_comment( $comment, $depth, $args ) {
            // Inserisci qui le modifiche al metodo Walker_Comment::html5_comment()
        }
    }
    // fine di WPSE_Walker_Comment
} // fine della condizione '!class_exists'

Qui possiamo memorizzare le nostre modifiche al metodo Walker_Comment::html5_comment(). È piuttosto lungo, quindi non l'ho incluso qui.

Approccio #3 - Callback personalizzato

Qui useremmo l'attributo callback:

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

// Usa la nostra callback personalizzata se disponibile
if( function_exists( 'wpse_comment_callback' ) )
{
    $args['format'] = 'wpse';
    $args['callback'] = 'wpse_comment_callback';
}

wp_list_comments( $args );

dove definiamo wpse_comment_callback() secondo le nostre esigenze.

/**
 * Callback di commento personalizzato
 */
function wpse_comment_callback( $comment, $depth, $args )
{
    // Modifica il metodo Walker_Comment::html5_comment() secondo le nostre esigenze 
    // e inseriscilo qui
}

dove potremmo iniziare simulando il metodo Walker_Comment::html5_comment(). Ma dobbiamo ricordarci di sostituire tutti i riferimenti a $this.

Approccio #4 - Sovrascrivere gli argomenti di wp_list_comments() con un filtro

Possiamo anche usare il filtro wp_list_comments_args per modificare gli argomenti di wp_list_comments() con i metodi sopra.

Ci sono altri approcci disponibili, ma spero che tu possa adattare questi alle tue esigenze.

4 feb 2016 13:24:35
Commenti

Perché non c'è un filtro per questo invece di usare OOP.

Brad Dalton Brad Dalton
12 feb 2022 10:48:11

La struttura dell'output dell'albero dei commenti è probabilmente troppo complessa per essere regolabile attraverso un singolo filtro di testo.

birgire birgire
17 feb 2022 18:14:12