Cómo resaltar los comentarios del autor en WordPress

La sección de comentarios es donde tu comunidad cobra vida. Es un espacio importante para la conexión, la conversación y la participación del lector.

Como autor, tus respuestas son una parte clave de esa interacción. Quieres asegurarte de que tu voz sea fácil de encontrar para los lectores, para fomentar aún más la discusión.

Resaltar tus comentarios les da la atención que merecen. Este simple toque hace que toda tu área de discusión se vea más profesional, organizada y atractiva.

Creemos que las pequeñas decisiones de diseño pueden tener un gran impacto en la experiencia del usuario. Y este es uno de los cambios más fáciles y efectivos que puedes hacer.

En este artículo, te mostraremos cómo resaltar fácilmente los comentarios del autor en WordPress.

¿Por qué resaltar los comentarios del autor en WordPress?

Los comentarios son una excelente manera de generar participación de los usuarios en tu sitio web. Si quieres obtener más comentarios en tus artículos, puedes fomentarlo participando activamente en las discusiones.

Para un nuevo blog de WordPress, puedes responder fácilmente a los comentarios y participar en discusiones con tus lectores. Si administras un blog de varios autores, puedes animar a los autores a ayudar también con la moderación de comentarios.

Sin embargo, la mayoría de los temas de WordPress no distinguen entre comentarios, y se listan con el mismo estilo.

Un lector casual puede revisar los comentarios sin darse cuenta del contenido adicional aportado por el autor en la discusión.

Resaltar los comentarios del autor te ayuda a remediar eso y hace que los comentarios del autor destaquen y sean más notorios.

El objetivo final aquí es animar a los nuevos usuarios a unirse a los comentarios y, en última instancia, suscribirse a tu boletín o convertirse en cliente.

Dicho esto, veamos cómo resaltar fácilmente los comentarios del autor en WordPress.

• Resaltar al autor del comentario en WordPress
• Resaltar comentarios por rol de usuario en WordPress

Resaltar al autor del comentario en WordPress

La forma más fácil de resaltar comentarios del autor de una publicación es agregando CSS personalizado a tu tema de WordPress. Esto te permite agregar fácilmente el código necesario y ver una vista previa en vivo de cómo se vería en tu sitio web sin guardarlo.

Primero, necesitas visitar Apariencia » Personalizar en el área de administración de WordPress. Esto iniciará la interfaz del personalizador de temas de WordPress. Notarás un montón de opciones en una columna a tu izquierda y una vista previa en vivo de tu sitio web.

Desde aquí, necesitas hacer clic en la pestaña 'CSS adicional'.

Esto abrirá un área de texto donde agregarás el CSS personalizado.

Sin embargo, querrás ver cómo se verá el CSS personalizado cuando se aplique.

Para hacer eso, necesitas navegar a una publicación de blog que contenga comentarios de un autor de la publicación.

Desplázate hacia abajo hasta la sección de comentarios y luego agrega el siguiente CSS personalizado en el cuadro de CSS personalizado a la izquierda.

.bypostauthor { 
background-color: #e7f8fb;
}

Notarás inmediatamente que el comentario del autor cambia, coincidiendo con el CSS personalizado que ingresaste.

Entonces, ¿cómo funciona todo esto?

Verás, WordPress agrega algunas clases CSS predeterminadas a diferentes áreas de tu sitio web. Estas clases CSS están ahí independientemente del tema de WordPress que estés utilizando.

En este código de ejemplo, hemos utilizado la clase CSS .bypostauthor, que se agrega a todos los comentarios añadidos por un autor de la publicación.

Agreguemos algunos estilos CSS más para hacerlo aún más prominente. Aquí hay un código de ejemplo que agrega una pequeña etiqueta de 'Autor' a los comentarios del autor de la publicación y un borde alrededor de la imagen del avatar del autor.

.bypostauthor:before { 
content:"Author";
float:right;
background-color:#FF1100;
padding:5px;
font-size:small;
font-weight:bold;
color:#FFFFFF;
}
.bypostauthor .avatar {
border:1px dotted #FF1100;
}

Así es como se veía en nuestro sitio web de prueba.

Resaltar comentarios por rol de usuario en WordPress

Ahora, muchos blogs de WordPress tienen miembros del equipo responsables de responder comentarios. Los sitios web populares pueden tener al autor de la publicación, al administrador y a los moderadores respondiendo comentarios para aumentar la participación del usuario.

¿Cómo resaltas un comentario agregado por un miembro del personal que no es el autor real de la publicación?

Hay un truco fácil para lograrlo. Sin embargo, requiere que agregues código personalizado a tu sitio web de WordPress. Si no lo has hecho antes, consulta nuestro artículo sobre cómo pegar fragmentos de código de la web en WordPress.

Primero, necesitas agregar el siguiente código al archivo functions.php de tu tema o a un plugin de fragmentos de código:

if ( ! class_exists( 'WPB_Comment_Author_Role_Label' ) ) :
class WPB_Comment_Author_Role_Label {
public function __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 role 
function wpb_get_comment_author_role($author, $comment_id, $comment) { 
$authoremail = get_comment_author_email( $comment); 
// Check if user is registered
if (email_exists($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 = ' <span class="comment-author-label comment-author-label-'.$comment_user_role.'">' . ucfirst($comment_user_role) . '</span>';
} else { 
$this->comment_user_role = '';
} 
return $author;
} 
  
// Display comment author                   
function wpb_comment_author_role($author) { 
return $author .= $this->comment_user_role; 
} 
}
new WPB_Comment_Author_Role_Label;
endif;

En lugar de editar el archivo functions.php de tu tema, recomendamos agregar este código con WPCode.

Este plugin de fragmentos de código hace que sea seguro y fácil agregar código personalizado en WordPress.

Para empezar, necesitas instalar y activar el plugin gratuito WPCode. Si necesitas ayuda, consulta nuestra guía sobre cómo instalar un plugin de WordPress.

Una vez que el plugin esté activado, dirígete a Code Snippets » Add Snippet desde tu panel de WordPress.

Luego, pasa el cursor del mouse sobre la opción ‘Agregar tu código personalizado (Nuevo fragmento)’ y haz clic en el botón ‘Agregar fragmento personalizado’.

A continuación, selecciona ‘PHP Snippet’ como tipo de código de las opciones que aparecen en la pantalla.

Ahora, puedes agregar un título para tu fragmento y pegar el código de arriba en el cuadro ‘Code Preview’.

Después de eso, simplemente cambia el interruptor de ‘Inactive’ a ‘Active’ y haz clic en el botón ‘Save Snippet’ en la parte superior de la página.

Este código simplemente agrega la etiqueta del rol de usuario junto al nombre del autor del comentario. Así es como se vería sin ningún estilo personalizado.

Hagámoslo un poco más bonito agregando algo de CSS personalizado. Ve a la página Appearance » Customize y cambia a la pestaña Additional CSS.

Puedes usar el siguiente CSS para estilizar la etiqueta del rol de usuario en los comentarios.

.comment-author-label {
    padding: 5px;
    font-size: 14px;
    border-radius: 3px;
}
  
.comment-author-label-editor {  
background-color:#efefef;
}
.comment-author-label-author {
background-color:#faeeee;
}
  
.comment-author-label-contributor {
background-color:#f0faee;   
}
.comment-author-label-subscriber {
background-color:#eef5fa;   
}
  
.comment-author-label-administrator { 
background-color:#fde9ff;
}

Así es como se veía en nuestro sitio de prueba. Siéntete libre de modificar el código para que coincida con los colores y el estilo de tu tema.

Para más detalles, quizás quieras leer nuestro artículo sobre cómo agregar etiquetas de rol de usuario a los comentarios de WordPress.

Esperamos que este artículo te haya ayudado a aprender cómo resaltar los comentarios del autor en WordPress. También podrías querer ver nuestro tutorial sobre cómo resaltar nuevas publicaciones para visitantes recurrentes en WordPress y nuestras selecciones expertas de los mejores plugins de cuadros de biografía de autor para WordPress.

Si te gustó este artículo, suscríbete a nuestro canal de YouTube para obtener tutoriales en video de WordPress. También puedes encontrarnos en Twitter y Facebook.