Cómo resaltar los comentarios del autor en WordPress

¿Quiere resaltar los comentarios del autor en las publicaciones de WordPress en su sitio web?

Resaltar los comentarios del autor en su blog de WordPress puede ayudarlo a generar compromiso. Cuando los usuarios ven que el autor participa activamente en la discusión, es más probable que comenten.

En este artículo, le mostraremos cómo resaltar fácilmente los comentarios del autor en WordPress para aumentar la participación.

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

Los comentarios son una excelente manera de generar participación de los usuarios en su sitio web. Si desea obtener más comentarios sobre su artículo, puede alentarlos participando activamente en la discusión.

Para los nuevos blogs de WordPress, puede responder fácilmente a los comentarios durante la moderación de comentarios. Si tiene un blog con varios autores, también puede animar a los autores a unirse a la discusión.

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

El lector casual puede desplazarse por los comentarios sin saber qué más puede sugerir el autor en la discusión.

Resaltar los comentarios del autor puede ayudarlo a resolver este problema y hacer que los comentarios del autor sean más notorios y notables.

El objetivo final aquí es alentar a los nuevos usuarios a unirse a las reseñas y eventualmente suscribirse a su boletín informativo o convertirse en clientes.

Dicho esto, veamos lo fácil que es resaltar los comentarios del autor en WordPress.

Destacar autores de comentarios en WordPress

La forma más fácil de resaltar los comentarios del autor en las publicaciones es agregar CSS personalizado a su tema de WordPress. Esto le permite agregar fácilmente el código necesario y ver una vista previa en vivo de cómo se verá en su sitio web sin guardar.

Primero, debes visitar Apariencia »Personalizado en el área administrativa de WordPress. Esto iniciará la interfaz de personalización del tema de WordPress. Notará muchas opciones en la columna izquierda junto con una vista previa en vivo de su sitio web.

Desde aquí, debe hacer clic en la pestaña CSS avanzado. Esto abrirá un área de texto donde agregará su CSS personalizado.

Sin embargo, querrá ver cómo se ve cuando aplica CSS personalizado. Para hacer esto, debe ir a la publicación del blog que contiene el comentario del autor.

Desplácese hacia abajo hasta la sección de comentarios y agregue el siguiente CSS personalizado al campo de CSS personalizado a la izquierda.

.bypostauthor { 
background-color: #e7f8fb;
}

Inmediatamente notará que los cambios en el comentario del autor coinciden con el CSS personalizado que ingresó.

Entonces, ¿cómo funciona todo?

Verá que WordPress agrega algunas clases de CSS predeterminadas a diferentes áreas de su sitio. Estas clases de CSS están disponibles independientemente del tema de WordPress que utilice.

En este código de muestra, usamos la clase CSS .bypostauthor, que se adjunta a todos los comentarios agregados por el autor de la publicación.

Agreguemos más estilos CSS para que se destaque más. Aquí hay un código de muestra que agrega una pequeña etiqueta de "autor" al comentario del autor en la publicación y un marco 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 de prueba.

Comentarios destacados por rol de usuario en WordPress

Muchos blogs de WordPress ya tienen miembros del equipo responsables de responder a los comentarios. Los sitios populares pueden tener un autor de publicaciones, un administrador y un moderador, quienes responden a los comentarios para aumentar la participación de los usuarios.

¿Cómo resalta los comentarios agregados por empleados que no son el autor real de la publicación?

Hay un truco sencillo para conseguirlo. Sin embargo, esto requiere que agregue un código personalizado a su sitio de WordPress. Si no lo ha hecho antes, consulte nuestro artículo sobre cómo agregar fácilmente código personalizado a WordPress.

Primero, debe agregar el siguiente código al archivo functions.php de su complemento o fragmento de tema.

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=" ';
} 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;

Este código simplemente agrega la etiqueta de rol de usuario al nombre del autor del comentario. Esto es sin un estilo personalizado.

Hagámoslo un poco más hermoso agregando CSS personalizado Apariencia »Personalizado y vaya a la pestaña CSS avanzado.

A continuación, puede utilizar el siguiente CSS para diseñar la etiqueta de función 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éntase libre de cambiar el código para que coincida con los colores y estilos del tema.

Para obtener más detalles, puede leer nuestro artículo sobre cómo agregar etiquetas de roles personalizadas a los comentarios de WordPress.

Esperamos que este artículo le haya ayudado a aprender cómo resaltar los comentarios del autor en WordPress. ¿Quieres saber cómo interactúan los usuarios con tu sitio web? Vea nuestros tutoriales sobre cómo rastrear la participación de los usuarios de WordPress y cómo agregar notificaciones web push a su sitio de WordPress para aumentar su tráfico.

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