Cómo añadir una etiqueta de función de usuario junto a los comentarios en WordPress

Uno de nuestros lectores preguntó si era posible resaltar el rol de usuario junto a cada comentario en WordPress? La visualización de la etiqueta de función del usuario da peso a los comentarios realizados por los usuarios registrados en su sitio web, específicamente autores, editores y administradores. En este artículo, le mostraremos cómo añadir fácilmente la etiqueta de rol de usuario junto a los comentarios en WordPress.

Añadir rol de usuario junto a los comentarios en WordPress

¿Por qué mostrar la etiqueta del rol de usuario junto al nombre del autor del comentario en WordPress?

Si usted permitir el registro de usuario en su sitio web o ejecutar un multi-author WordPress website , entonces las etiquetas de usuario pueden presentar a los usuarios entre sí basándose en su Permite»>Papeles de usuario .

Por ejemplo, los usuarios con el rol de usuario editor mostrarán una insignia junto a su nombre en los comentarios para que otros usuarios sepan que este comentario fue hecho por un editor.

Aumenta la confianza de los usuarios y aumenta la participación de los usuarios en los comentarios de su sitio web.

Muchos temas de WordPress solamente resaltar los comentarios hechos por el autor del mensaje . No muestran etiquetas para ningún otro rol de usuario, incluso si otros comentarios son hechos por usuarios registrados o administradores del sitio.

Dicho esto, echemos un vistazo a cómo añadir fácilmente la etiqueta de función de usuario junto a los comentarios en WordPress.

Adición de una etiqueta de función de usuario junto al nombre del autor del comentario en WordPress

Este tutorial requiere que añada código a los archivos de temas de WordPress. Si no lo has hecho antes, por favor, echa un vistazo a nuestra guía sobre cómo copiar y pegar código en WordPress .

Lo primero que debe hacer es añadir el siguiente código a su tema functions.php file or a site-specific plugin .

12345678910111213141415161617181920212223242526272829if (! class_exists( ‘WPB_Comment_Author_Role_Label’) :class WPB_Comment_Author_Role_Label {función pública __construct() {add_filter( ‘get_comment_author’, array( $this, ‘wpb_get_comment_author_role’), 10, 3 );add_filter( ‘get_comment_author_link’, array( $this, ‘wpb_comment_author_role’);}// Get comment author author role function wpb_get_comment_author_role($author, $comment_id, $comment) { $authoremail = get_comment_author_email( $comment); // Verificar si el usuario está registrado (email_existe($authoremail)) {$commet_user_role = get_user_by(‘email’, $authoremail);$comment_user_role = $commet_user_role->roles[0];// HTML output to add next to comment author name$this->comment_user_role = ‘ ‘ . ucfirst($comment_user_role) . Si no, devuelve $author. // Mostrar la función de autor de comentarios wpb_comment_author_role($author) { return $author .= $this->comment_user_role; } nuevo WPB_Comment_Author_Role_Label;endif;

Este código de función arriba hooks into WordPress filters used to display comment author name to include user role label.

Ahora puedes visitar cualquier entrada con comentarios para verla en acción. Los comentarios realizados por los usuarios registrados mostrarán su rol de usuario junto al nombre del autor del comentario. Cualquier comentario hecho por usuarios no registrados sólo mostrará el nombre del autor del comentario.

Etiqueta del rol de usuario mostrada junto a su comentario

Ahora que hemos añadido el rol de usuario, es el momento de estilizarlo y hacer que parezca limpio.

En nuestro código, hemos añadido una clase CSS para cada rol de usuario, por lo que podemos usar estas clases CSS para personalizar cada insignia de usuario de forma diferente (es decir, usar colores diferentes, etc.)

Puede utilizar el siguiente ejemplo de CSS como punto de partida:

12345678910111213141415161617181920212223.inicio-autor-etiqueta {revestimiento: 5px;tamaño de fuente: 14px;radio del borde: 3px;}.comment-author-label-editor { background-color:#efefef;}.comment-author-label-author-author {background-color:#faee;}.comment-author-label-contributor {background-color:#f0faee; }.comment-author-label-subscriber {background-color:#eef5fa; }.comment-author-label-administrator {Background-color:#f9ff;}}.

Siéntase libre de ajustar el CSS a su gusto. Así es como se veía en nuestro sitio web de demostración:

Placas de función del usuario mostradas con sus comentarios

Rate this post

Deja un comentario

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *