¿Quiere destacar 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. Es más probable que los usuarios dejen un comentario cuando ven que el autor participa activamente en la discusión.
En este artículo, le mostraremos cómo resaltar fácilmente los comentarios del autor en WordPress para impulsar el compromiso.
¿Por qué destacar 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 sus artículos, puede alentarlo participando activamente en las discusiones.
Para un nuevo blog de WordPress, puede responder fácilmente los comentarios durante la moderación de comentarios. Si tiene un blog de varios autores, puede animar a los autores a participar también en la discusión.
Sin embargo, la mayoría de los temas de WordPress no distinguen entre comentarios y los enumeran con el mismo estilo.
Un lector casual puede desplazarse por los comentarios, sin darse cuenta del contenido adicional aportado por el autor en la discusión.
Resaltar los comentarios del autor le ayuda a remediar eso y hace que los comentarios del autor se destaquen y sean más notorios.
El objetivo final aquí es alentar a los nuevos usuarios a unirse a los comentarios y, en última instancia, suscribirse a su boletín informativo o convertirse en clientes.
Dicho esto, echemos un vistazo a cómo resaltar fácilmente los comentarios de los autores en WordPress.
Resaltado del autor del comentario en WordPress
La forma más fácil de resaltar los comentarios del autor de la publicación es agregando 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ía en su sitio web sin guardarlo.
Primero, debes visitar Apariencia »Personalizar en el área de administración de WordPress. Esto iniciará la interfaz de personalización de temas de WordPress. Notará un montón de opciones en una columna a su izquierda y una vista previa en vivo de su sitio web.
Desde aquí, debe hacer clic en la pestaña CSS adicional. Esto abrirá un área de texto donde agregará el CSS personalizado.
Sin embargo, querrá ver cómo se verá el CSS personalizado cuando se aplique. Para hacerlo, debe navegar a una publicación de blog que contenga comentarios del autor de la publicación.
Desplácese hacia abajo hasta la sección de comentarios y luego agregue el siguiente CSS personalizado en el cuadro CSS personalizado a la izquierda.
.bypostauthor { background-color: #e7f8fb; }
Notará inmediatamente que el cambio de comentario del autor coincide con el CSS personalizado que ingresó.
¿Entonces, cómo funciona todo esto?
Verá que WordPress agrega algunas clases CSS predeterminadas a diferentes áreas de su sitio web. Estas clases de CSS están ahí independientemente del tema de WordPress que esté utilizando.
En este código de muestra, hemos utilizado el .bypostauthor
Clase CSS que se agrega a todos los comentarios agregados por el autor de una publicación.
Agreguemos algunos estilos CSS más para hacerlo aún más prominente. Aquí hay un código de muestra que agrega una pequeña etiqueta de ‘Autor’ a los comentarios del autor de la publicación y un borde alrededor de la imagen de 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.
Resaltado de comentarios por rol de usuario en WordPress
Ahora, muchos blogs de WordPress tienen miembros del equipo responsables de responder a los comentarios. Los sitios web populares pueden tener autor de la publicación, administrador y moderadores, todos respondiendo a los comentarios para impulsar la participación de los usuarios.
¿Cómo resalta 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 agregue un código personalizado a su sitio web de WordPress. Si no ha hecho esto antes, consulte nuestro artículo sobre cómo agregar fácilmente código personalizado en WordPress.
Primero, debe agregar el siguiente código al complemento de fragmentos de código o al archivo functions.php de su 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=" <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;
Este código simplemente agrega la etiqueta de función 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 añadiendo CSS personalizado. Ir Apariencia »Personalizar página y cambie a la pestaña CSS adicional.
Después de eso, puede usar el siguiente CSS para diseñar 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éntase libre de modificar el código para que coincida con los colores y el estilo de su tema.
Para obtener más detalles, es posible que desee leer nuestro artículo sobre cómo agregar etiquetas de roles de usuario a los comentarios de WordPress.
Esperamos que este artículo le haya ayudado a aprender a destacar los comentarios de los autores en WordPress. ¿Quiere ver cómo interactúan los usuarios con su sitio web? Vea nuestro tutorial sobre cómo realizar un seguimiento de la participación del usuario en WordPress y cómo agregar notificaciones push web en su sitio de WordPress para aumentar su tráfico.
Si le gustó este artículo, suscríbase a nuestro Canal de Youtube . También puedes encontrarnos en Twitter y Facebook.
Cómo resaltar los comentarios del autor en WordPress .