Destacar los comentarios del autor de la entrada

Tiempo estimado de lectura: 7 minutos

 

Cómo destacar los comentarios del autor de la entrada

Esta semana aprenderemos a destacar los comentarios del autor de la entrada, una opción muy interesante y visual que te servirá para distinguir de un vistazo tus comentarios de los comentarios del resto de usuarios de tu web.

Un aspecto visual que, a mi juicio, no se ha tenido en cuenta en WordPress, es la forma en la que visualmente se muestran los comentarios. Me refiero a que lo único que se ha hecho, en cuanto a diseño de este tipo de información se refiere, es colocar las respuestas con un padding izquierdo, lo que hace que visualmente sepamos cual es un comentario y cual es una respuesta al mismo.

Código para destacar los comentarios del autor de la entrada del resto de comentarios

Afortunadamente, siempre podemos contar con un poco de CSS para hacer que las cosas destaquen y tengan un aspecto más agradable y acorde al estilo gráfico de nuestra web.

Este ejemplo es muy sencillo, en principio lo que vamos a hacer es destacar nuestros propios comentarios como autores de la entrada. Esto significa que cuando una de nuestras entradas tenga un comentario, nosotros podemos comentar a su vez ese comentario. Pues bien, a respuesta que nosotros publiquemos, destaque sobre el resto de comentarios.

Esto que parece un poco lioso, es más simple de lo que parece: cuando nosotros escribamos un comentario, este destacará sobre el resto. ¡Así de sencillo!.

¿Y cómo conseguimos esto?. Pues con este código tan simple:

/* Destacar los comentarios del autor */
.bypostauthor {
background: #eee;
border-color: #000;
border-width: 1px;
border-style: solid;
padding: 20px;
margin-bottom:40px;
}

Este código afecta a una clase llamada .bypostauthor, que como podemos imaginar, formatea los comentarios del autor del post o entrada.

Con este código le decimos a WordPress, que cuando el autor de una entrada, ponga esa información en un cuadro gris con borde negro, con un padding de 20 píxeles y un margen inferior de 40 píxeles para que no se pegue al siguiente comentario. Ni que decir tiene que puedes cambiar los valores a tus necesidades o gustos.

¿Dónde ponemos este código?

Al ser un código muy sencillito y muy ligero, podemos ponerlo directamente en el Personalizador de WordPress. Para ello debes ir Apariencia, Personalizar y pegarlo en el apartado CSS Adicional.

El resultado es muy vistoso.

Destacar los comentarios del autor de la entrada
Destacar los comentarios del autor de la entrada


¿Qué te ha parecido el artículo?. Házmelo saber en los comentarios que tienes más abajo. Estoy deseando leerte.

Por último, si crees que este artículo puede ser interesante para algún amigo tuyo, te agradecería enormemente que lo compartieras con él y con todo el mundo a través de las Redes Sociales.

Puntúa este artículo:
[Total: 0 - Promedio: 0]

Puede que también te interese...

Deja una respuesta

Información básica sobre protección de datos
Responsable: Jose González Bueno.
Finalidad: Moderación y publicación de comentarios.
Destinatarios: No se comunican datos a terceros, salvo por imperativo legal.
Derechos: Tienes derecho a acceder, rectificar, exportar y suprimir tus datos.

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

He leído y acepto la política de privacidad de este sitio. *