Fecha de los posts al estilo Wordpress

Hola, al fin me he acordado de este truco, me lo tenia guardado, pero se me olvido y despues de unos meses me acorde haci que comenzemos:







1.- Nos dirigimos a Opciones-Formato y cambiamos la fecha por la que esta en la penultima opcion.

2.- Ahora en el HTML expandimos los artilugios y pegamos el siguiente codigo antes del /head:

<script>
function date_replace(d){
var da = d.split(' ');
day = "<span class='theDate'>"+da[0]+"</span>";
mon = "<span class='theMonth'>"+da[1].slice(0,3)+"</span>";
year = "<span class='theYear'>"+da[2]+"</span>";
document.write(day+mon+year);
}
</script>

3.- Ahora expandidos los artilugios buscamos el siguiente codigo:

<data:post.dateHeader/>

4.- Y reemplazamos el codigo anterior por este:

<div id='post-date'>
<script>date_replace('<data:post.dateHeader/>');</script>
</div>

5.- Si sos perezoso y no te quieres molestar en crear un estilo para la fecha usa este y lo pones JUSTO antes de ]]></b:skin> (dentro de la plantilla CSS:



div#post-date {

display: block;

float:left; /* set this to right if you want it go to the right */

padding: 1em; /* to keep the text away from the edges */

background-color: #555555; /* you can change this to hold a picture, will make it look nicer */

border: 3px double gray; /* a border to make it look nice */

}



div#post-date span.theDate {

display: block; /* to put this in a different line */

font-size: 3em; /* to make the date stand out */

background-color: transparent; /* to let the background show through */

color: white;

}



div#post-date span.theMonth {

display: block;

font-size: 1em; /* smaller compared to the date */

background-color: transparent;

color: white;

}



div#post-date span.theYear {

display: block;

font-size: 1em; /* smaller compared to the date */

background-color: transparent;

color: white;

}

<script>
function date_replace(d){
var da = d.split(' ');
day = "<span class='theDate'>"+da[0]+"</span>";
mon = "<span class='theMonth'>"+da[1].slice(0,3)+"</span>";
year = "<span class='theYear'>"+da[2]+"</span>";
document.write(day+mon+year);
}
</script>