Header AD

Personalizar la fecha de las entradas


Algo parecido a ésto que tengo yo en el blog: en bloque, en lugar de en línea, con fondo y... distinto, en suma.
Pues bien... preprados para trabajar duro:

Para empezar, si queréis vuestro propio estilo, tenéis que andar con el photoshop o lo que queráis para crear una especie de "banner" para cada día del mes, de cada mes, y para unos pocos años de aquí a... lo que penséis andar por el blog... un rollo... (al final, tendréis que diseñar cosa de cuarenta banners).

Si se os pone el vello de punta de pensar en tal cantidad de trabajo-como a mí-no pasa nada: The Last Word nos salva nuestra poca paciencia con algo menos personal, pero más sencillo. Vamos a dar los pasos:



1º.- Id a Opciones de vuestro blog. En FORMATO, cambiad el de FECHA de la entrada por éste: 25 febrero 2007. Es decir: día, més, año. Es la segunda opción de la tabla, empezando por abajo. Guardad.

2º.- Id a Edición de plantilla y expandidla:

.- Insertad el siguiente CSS, antes del cierre /skin, para darle el estilo a la fecha (podéis cambiar el color, el fondo, el bloque...):




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; }



2º.- Insertad el siguiente script antes del cierre /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º.- Bajad vuestra plantilla hasta el elemento "Navigation". Poco más arriba debéis encontrar, un "b:loop values='data:posts' var='post'... y poco detrás, un
<b:if cond='data:post.dateHeader'>

<h2 class='date-header'><data:post.dateHeader/></h2>

</b:if> que va dentro del b:loop data.post


Bien: ahora colocad detrás lo siguiente:




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

>



De manera que os quede así ese fragmento de la tag b: loop:




<b:if cond='data:post.dateHeader'>

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

</b:if>

>




No guardéis nada mientras no lo veáis todo perfecto desde "Vista Previa". ¡Suerte!

Pd: He solucionado el "error" que daba en la página, si se sguían las instrucciones de The Last Wor para esta última parte de código: señala el autor que hay que SUSTITUIR el date.Header, y todo lo que se encuentre dentro de ese b:loop, por el código que propone, a excepción de las condicionales b:if. Pero no... porque si precisamente sustituímos ese condicional, que es donde se encuentra el date.header... es cuando nos da un error como un campano. Así que yo ni sustituyo, ni reeemplazo, ni elimino (A EXCEPCION DE LA TAG h2 /h2, que ha de eliminarse si ya no se quiere visualizar la fecha "antigüa"): me limito a colocar el código justo detrás.

Y, solucionado el problema del "error 3n la página", encuentro otro: y es que no se visualiza el hack junto a algunos títulos de entradas... como no sé si se trata de entradas que he escrito el mismo día... pues tengo que comprobarlo, entre otras cosas.

Y ¡OJO!: el hack lo he insertado sólo en la "main" o página principal de este blog: de manera que, desde otras páginas, se ve la fecha "habitual".

PDII: Je... acabo de insertarlo también las otras páginas, además de la principal. Funciona bien... eso sí: queda un poco horroroso junto a mis "dropcaps"... tendré que cambiarlas por una inicial más grande, o algo así...

Y otra cosa: Efectivamente, como me sospechaba, las entradas que "no" tienen el bloque de la fecha ... es porque son del mismo día...

post-Firma

Personalizar la fecha de las entradas Personalizar la fecha de las entradas Reviewed by Pilar Lozano Santos on 18:52:00 Rating: 5

No hay comentarios

Post AD