Tutorial: Mejora el aspecto de tus comentarios (Parte 2)

Por Makita desde Chile

Continuando con este tutorial para mejorar el aspecto de los comentarios en nuestros Blogs, vamos a centrarnos en el estilo de los comentarios anidados que son las respuestas que se pueden producir respecto a una opinión.

El estilo que se entregará de base es crear un marco, que entrega un efecto de caja, un color de fondo para los comentarios y una personalización a la imagen del perfil que comenta, la haremos redondeada.

Para aplicar esto debes copiar el siguiente código debajo de ]]></b:skin>,  luego de haber ingresado a Edición HTML y haber expandido los artilugios.

<b:if cond='data:blog.pageType == &quot;item&quot;'> <style type='text/css'>.comments .comments-content .comment-content{text-align:left;}.comments .comments-content .inline-thread{background: #eef2f2; border:1px solid #cedadc;}.comments .comments-content .comment{border-bottom: 1px solid #b2d1d6 !important;}.comments .avatar-image-container{background: url(http://4.bp.blogspot.com/-SGVRdTVEU_I/TZtDiTE9xNI/AAAAAAAAFYI/Oj8zWFsfs-Y/s1600/icono-persona-c.png) no-repeat center center;border:3px solid #cedadc;}.comments .avatar-image-container, .comments .avatar-image-containerimg{-webkit-border-radius:30px;-moz-border-radius:30px;border-radius:30px; }</style> </b:if>Lo que se encuentra con rojo es lo que se puede modificar, de acuerdo a sus gustos y a continuación se explica que hace cada una de ellas: .comments .comments-content .inline-thread: va el color del borde (border) y fondo (background) de las respuestas de los comentarios, por eso se ven en "cajitas"..comments .comments-content .comment: va el borde (border) que se aplica al fondo de cada comentario, independientemente que sea repuesta o no..comments .avatar-image-container: va la imagen que aparece debajo de cada avatar, si alguien usa imagen transparente en su avatar, se verá esta como fondo, o bien cuando no haya ningún avatar, por ejemplo en comentarios de usuarios que comenten como anónimos.Si prefieres el texto justificado en los comentarios, quita todo lo resaltado de azul: .comments .comments-content .comment-content{text-align:left;} esa regla ya la envía Blogger.Ahora, solamente debes personalizar la plantilla para que tu Blog quede a tu pinta ;)Fuente: miltrucosblogger.info/