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.

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

Si permite el registro de usuarios en su sitio web o ejecuta un sitio web WordPress de varios autores, entonces las etiquetas de usuario pueden presentar a los usuarios entre sí en función de sus roles de usuario.

Por ejemplo, los usuarios con el rol de usuario del 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 sólo resaltan los comentarios hechos por el autor del post. 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 fácilmente el código en WordPress.

Lo primero que tiene que hacer es añadir el siguiente código al archivo functions.php de su tema o a un plugin específico del sitio.

12345678910111213141415161718181920212223242526272829if(! class_exists( WPB_Comment_Author_Role_Label) ) :classWPB_Comment_Author_Role_Label {publicfunction__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_author_role);};}; y // Get comment author role functionwpb_get_comment_author_role($author, $comment_id, $comment) { $authoremail= get_comment_author_email( $comment); // Verificar si el usuario está registrado si(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 = .$comment_user_role.»>. ucfirst($comment_user_role). «Si no, el papel del usuario es el de devolver al autor.  // Mostrar la función de autor de comentarioswpb_comment_author_role($author) { return$author.= $this->comment_user_role; } newWPB_Comment_Author_Role_Label;endif;

Este código de función arriba se engancha a los filtros de WordPress usados para mostrar el nombre del autor del comentario e incluir la etiqueta de rol del usuario.

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.

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 { acolchado: 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 {bacuteurador {brección de fondo:#fde9ff;}}.

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

Esperamos que este artículo le haya ayudado a aprender a añadir una etiqueta de función de usuario junto a los comentarios en WordPress. También puedes ver nuestra guía sobre cómo cargar gravatares de forma perezosa en los comentarios de WordPress.

Si te ha gustado este artículo, suscríbete a nuestros tutoriales de vídeo de YouTube Channel for WordPress. También puede encontrarnos en Twitter y Facebook.

Deja un comentario