[Tutoriales] Personalizar la fecha

Holiii!!! Hoy os traigo un tutorial sobre como personalizar la fecha en vuestro blog, os daré además, los códigos exactos que utilicé para las fotos de arriba, por si las queréis utilizar. Además, es solo con CSS, así que no hace falta entrar en la plantilla. Solo dale al Continuar leyendo.

Primero que todo, vamos Diseño>Diseñador de Plantillas>Avanzado>Añadir CSS, y allí pones:

.date-header span {
Códigos
}

Y en donde pone códigos, vamos a añadir lo que queramos. Primero so voy a dejar los códigos que utilicé en los mios, y luego os digo como hacerlo personalizado.

Códigos

font: normal normal 14px Arial;
display: block;
border-left: 0 solid transparent;
border-right: 0 solid transparent;
margin-left: -90px;
background: #f5f5f5;
padding: 5px;
width: 60px;
border-bottom: 1px dashed #989898;
box-shadow: 0 0 8px;

border-bottom: 3px solid #F7D8DA!important;
padding: 5px 7px 5px 7px!important;

 

font: normal normal 14px 'courier', sans-serif;
color: #fff;
width: 56px;
background: #000;
padding: 3px;

Códigos personalizados:

Vale, para hacer esto, hay varias cosas que puedes poner, o no poner:

background:#colordefondo;
padding:espacioentrelasletrasyelborde;
color:#colordetexto;
font:estilosdelfont;
border:estilosdelborde;
box-shadow:estilosdelasombra;
width:ancho;
margin:margen;

Ten en cuenta que si pones un background, debes poner obligatoriamente el padding, porque si no, el borde del fondo, quedaría pegado a las letras, así: Sin padding. Y con el padding, así: Con padding. Aunque si lo quieres sin padding porque el diseño de tu blog es así, eso es otra cosa.

En donde hay un # antes de donde te explico que hay que poner, debes poner el código del color que quieras. Puedes encontrarlos aquí.

Espero que os sirva!! Beshus y hasta mañana!!