Blog and Web

La barra de estatus de Blogger es aquella que se muestra en la parte superior de las entradas cuando accesamos a las etiquetas o hacemos una búsqueda. Por defecto, están definidos estilos para el borde, el fondo y la fuente, que aunque tiene un aspecto neutro, no siempre es lo más adecuado.

Personalizar la barra de estatus

Para personalizar esta barra es necesaria agregar esencialmente 4 clases en la sección css de la plantilla, estas son:

status-msg-wrap. Es el contenedor principal de la barra, es el lugar adecuado para definir su ubicación respecto a las entradas.
status-msg-body. Clase encargada de dar estilos al mensaje.
status-msg-border. Clase que define el borde.
status-msg-bg. Clase que define el color de fondo.

Es necesaria acompañar estas clases con el selector superior “#main”, para que sobrescriba los valores por defecto.

Ejemplo

Código css. (va antes de ]]></b:skin>)

#main .status-msg-wrap {
width:90%;
padding:5px;
}

#main .status-msg-body {
font-size:80%;
text-align:left;
padding:5px 5px 5px 30px;
width:auto;
}

#main .status-msg-border {
border:1px solid #a19a36;
opacity:1;
}

#main .status-msg-bg {
background: #FFF9B3 url(http://bp0.blogger.com/_Zuzii37VUO4/RvtwlnVpGrI/AAAAAAAACOw/K5daSpdOLYg/s1600/gnome-status%5B2%5D.png) center left no-repeat;
opacity:1;
}

Que da como resultado:

Conclusión

La barra de estatus de Blogger tiene una estructura de estilos un poco compleja y creo yo, mal organizada, para personalizar correctamente esta parte se debe tener cuidado de sobrescribir todos los estilos por defecto.

Solo como anotación, extrañamente la barra de estatus repite dos veces el mensaje, solo que uno de ellos tiene atributos para no mostrarte, al parecer el equipo de blogger hizo al vapor varios de los elementos de sus plantillas.

Nota: Si lo que buscan es ocultarla definitivamente consulte nuestro post para hacerlo.