Modificar el formulario de comentarios de WordPress

Publicado en: Tecnología

Editando el fichero comments.php de nuestro theme, ya sea un child theme o no, podemos modificar los campos, añadir, quitar… sin tocar el core de WordPress, que no es nada recomendable.

En esencia, se trata de crearnos un array personalizado, con los campos y valores que escojamos, y se lo volvamos a pasar a la función comment_form() del core de WordPress. Creamos el array comentarios:

$comentarios = array ();

Y la forma de pasar el nuevo array a la función de comment_form es:

comment_form($comentarios);

Así no conseguiríamos todavía nada. Veamos unos casos prácticos para modificarlo.
Por defecto, en nuestro formulario, tenemos indicados las etiquetas HTML permitidas al escribir en el campo ‘comentario’. Si quisiéramos quitarlos y que no se mostraran, añadimos a nuestro array:

'comment_notes_after' => '',

Lo que resetea el valor por defecto de WordPress a nuestro nuevo valor, un valor vacío y no escribe esa parte de texto en el formulario. Ale, hemos quitado la lista de etiquetas permitidas.

Ahora un ejemplo más complicado. Para modificar los campos del formulario de email y url para adaptarlos a los teclados de los dispositivos móviles, como el iPhone y el iPad, facilitando escribir las arrobas, las barras de URL y los dominios. Para eso creamos un array independiente al anterior, lo llamo $campos, con los parámetros y valores de author, email y url. Realmente, a los campos por defecto, solo cambiamos el ‘type’ del campo: para email un type=»mail», y para las url un type=»url»:

$campos = array(
 'author' => '<p class="comment-form-author"><label for="author">' . __( 'Name', 'domainreference' ) . '</label> ' . ( $req ? '<span class="required">*</span>' : '' ) . '<input id="author" name="author" type="text" pattern="" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30"' . $aria_req . ' /></p>',
 'email' => '<p class="comment-form-email"><label for="email">' . __( 'Email', 'domainreference' ) . '</label> ' . ( $req ? '<span class="required">*</span>' : '' ) . '<input id="email" name="email" pattern="" type="email" value="' . esc_attr( $commenter['comment_author_email'] ) . '" size="30"' . $aria_req . ' /></p>',
 'url' => '<p class="comment-form-url"><label for="url">' . __( 'Website', 'domainreference' ) . '</label><input id="url" name="url" type="url" pattern="" value="' . esc_attr( $commenter['comment_author_url'] ) . '" size="30" /></p>'
);

Y este array ‘campos’ los añadimos a nuestro array ‘comentarios’, aplicando filtros:

'fields' => apply_filters( 'comment_form_default_fields', $campos ),

El código completo de las modificaciones del formulario de comentarios queda así:

<?php
$campos = array(
 'author' => '<p class="comment-form-author"><label for="author">' . __( 'Name', 'domainreference' ) . '</label> ' . ( $req ? '<span class="required">*</span>' : '' ) . '<input id="author" name="author" type="text" pattern="" value="' . esc_attr( $commenter['comment_author'] ) . '" size="30"' . $aria_req . ' /></p>',
 'email' => '<p class="comment-form-email"><label for="email">' . __( 'Email', 'domainreference' ) . '</label> ' . ( $req ? '<span class="required">*</span>' : '' ) . '<input id="email" name="email" pattern="" type="email" value="' . esc_attr( $commenter['comment_author_email'] ) . '" size="30"' . $aria_req . ' /></p>',
 'url' => '<p class="comment-form-url"><label for="url">' . __( 'Website', 'domainreference' ) . '</label><input id="url" name="url" type="url" pattern="" value="' . esc_attr( $commenter['comment_author_url'] ) . '" size="30" /></p>'
);
$comentarios = array(
 // remove "Text or HTML to be displayed after the set of comment fields"
 'comment_notes_after' => '',
 // Campos del formulario con type para dispositivos moviles
 'fields' => apply_filters( 'comment_form_default_fields', $campos ),
 // redefine your own textarea (the comment body)
 //'comment_field' => '<p class="comment-form-comment"><label for="comment">' . _x( 'Comment', 'noun' ) . '</label><br /><textarea id="comment" name="comment" aria-required="true"></textarea></p>',
);
comment_form($comentarios);
?>

Y si comprobamos el resultado en un iPhone, veremos nuestro teclado adaptado al campo, con la arroba en email, y el .com en la url. Más cómodo.

Teclados personalizados

Que lo disfrutéis!
Saludos

  1. Luciano
    |

    buen post…