Creación de botón con fecha para blog en Wordpress

Vamos a crear un botón que visualice la fecha del día y mes de nuestras entradas, muchos lo vemos necesario ya que tener este tipo de diseño de nuestro blog o pagina nos da algo de imagen y vistosidad, bien ahora esto lo haremos dentro de nuestro blog o pagina web que tengamos con Wordpress.
Para empezar veremos la manera de su colocación ya que lo haremos en la parte lateral de nuestras entradas, estos pasos serán tan simples ya que únicamente colocaremos tres códigos los cuales nos ayudaran veamos como:



Paso Numero 1:

Colocaremos el siguiente codigo:

<div class=”post-date”>
<div class=”month”><?php the_time(‘M’) ?></div>
<div class=”day”><?php the_time(‘d’) ?></div>
</div>

Paso Numero 2:

Para este paso tenemos que diseñar una imagen lo podemos realizar en Photoshop, les pongo una imagen de diseño del botón hecha por mi amigo WPdesigner.

Paso Numero 3:

Ya que realizamos el paso anterior de la creación de nuestro diseño aplicaremos un poco de CSS, claro si sabemos dominarlo es mejor, si somos de las personas que no estamos familiarizados con este tipo de código , podemos proceder a buscar Tutoriales en la web para así lograr un apoyo mas importante y tener una imagen bien esterilizada y diseñada.

Ya que hicimos todo esto usaremos este código como base:

.post-date{
float: left;
display: inline;
margin: 0 10px 0 0;
background: url(images/date_button_template.gif) no-repeat;
}

Después de colocar este código vemos que esta marcado con rojo  :

•  date_button_template.gif, este código sera donde colocaremos la imagen que tenemos diseñada.
• Images/, en esta parte colocaremos la ubicación de la carpeta de nuestras imágenes.

Nota: Si queremos almacenar las imágenes en carpetas diferentes, tenemos que cambiar la ruta especificada de Images/, para que pueda coincidir con la ubicación de nuestra capeta de imágenes.

Posted in: Wordpress