Personalizar iconos de fecha, comentarios y visitas en WordPress

  • Autor Autor itxel
  • Fecha de inicio Fecha de inicio
I

itxel

Hola tod@s.

Quería saber si alguien me puede ayudar:

En uno de mis blogs: tlnovelas.net
He modificado el theme con este de arthemia. Si se fijan lo he modificado para que en la pantalla principal aparezca sólo los posts por título. Hasta ahí todo bien.
Ahora si ven, justo debajo del título del post se ve la fecha, si tiene o no comentarios y la cantidad de veces que un post es visto.
Lo que quiero es poner un icono pequeñito delante de la fecha (una iimagen de un calendario pequeñito,en comentarios la típica imagen del bocadillo o nube y en posts visto por ejemplo un televisor u ojo en pequeñito.

Sé que lo que hay que modificar está en esta línea del código de mi index.php

HTML: 
<div class="meta">[<?php the_time('j M Y') ?> | <?php comments_popup_link('No Comment', 'One Comment', '% Comments');?> | <?php if(function_exists('the_views')) { the_views(); } ?>]</div>	
	
	</div>

Pero no sé como añadir las imágenes ya que lo he hecho pero no se visualizan alineadas.

Si alguien me pudiera yudar, desde ya muchas gracias.
 
Se hace lo siguiente:

por ejemplo para las fechas:

PHP: 
<?php the_time('j M Y') ?>

quedaría así:

HTML: 
<span class="date"><?php the_time('j M Y') ?></span>

y agregas lo sig. en tu hoja de estilos.

Insertar CODE, HTML o PHP: 
span.date {padding-left: 20px; background: url(images/date.png) no-repeat;}

haces lo mismo con las demás, cambiándole el nombre al span y en el css la imagen.

si tienes dudas o alguna otra pregunta volvés a avisar 😉
 
Hola Nachitox.

Muchas gracias. Ha funcionado a la perfección.
Ahora me faltaría añadirlo al single.php para que se muestre también ahí al leer todo el post. En la cadena de mi código:

HTML: 
	<div id="stats">
<span><?php the_time('j F Y') ?></span>
<span><?php if(function_exists('the_views')) { the_views(); } ?></span>
<span><?php comments_number('No Comment', 'One Comment', '% Comments' );?></span></div>

He añadido <span class="date"> <span class="view"> y <span class="comments"> respectivamente pero se muestra el texto sobre el icono.
 
seguro? en ese código no veo <span class="date">; veo solo <span>. tienes que agregarle una clase.
 
Holitas.
Sí, lo tenía puesto, pero al ver que salía el texto sobre la imagen y esteticamente no quedaa bien, lo quité (ya sabes, cosas de mujeres). Pero vamos, lo que hice fue quitar el <span> y añadir la etiqueta <span class="date"> para la fecha y no va.

Gracias
 
PHP: 
 <div id="stats">
<span><?php the_time('j F Y') ?></span>
<span><?php if(function_exists('the_views')) { the_views(); } ?></span>
<span><?php comments_number('No Comment', 'One Comment', '% Comments' );?></span></div>

debe ir así:

PHP: 
 <div id="stats">
<span class="date"><?php the_time('j F Y') ?></span>
<span class="view"><?php if(function_exists('the_views')) { the_views(); } ?></span>
<span class="comments"><?php comments_number('No Comment', 'One Comment', '% Comments' );?></span></div>
 
al parecer no seguiste las instrucciones xD, en el style.css tienes que poner el atributo padding-left: 20px; tal como te lo expliqué arriba.
 
Holitas again Nachitox.

en el style.css tengo puesto:
HTML: 
span.date {
padding-left: 20px; background: url(images/icons/icon_date.gif) no-repeat;
}
span.comments {
padding-left: 20px; background: url(images/icono-comentario1.png) no-repeat;
}
span.view {
padding-left: 20px; background: url(images/icon_view.gif) no-repeat;
}
Si te fijas, en la página principal se muestra sin problemas, lo que quiere decir que sí está puesto. Pero por algún motivo que desconozco, no sale en el single.php ... que locura :S

Muchas gracias por tu ayuda nuevamente.
 
la misma modificación que hiciste en el index la tienes que hacer en el single.
 
Tengo en mi single.php

HTML: 
 <div id="stats">
<span class="date"><?php the_time('j F Y') ?></span>
<span class="view"><?php if(function_exists('the_views')) { the_views(); } ?></span>
<span class="comments"><?php comments_number('No Comment', 'One Comment', '% Comments' );?></span></div>

Y en el style.css

HTML: 
span.date {
padding-left: 20px; background: url(images/icons/icon_date.gif) no-repeat;
}
span.comments {
padding-left: 20px; background: url(images/icono-comentario1.png) no-repeat;
}
span.view {
padding-left: 20px; background: url(images/icon_view.gif) no-repeat;
}

Debo modificar algo más.

Muchas gracias
 
Hay que estar conectado o registrado para responder aquí.

Temas similares

A
Actualizar automáticamente fecha comentarios en Wordpress
Respuestas
4
Visitas
382
rafadizeosp
rafadizeosp
C
Cómo mostrar fecha, comentarios y títulos en sufusion
Respuestas
6
Visitas
1K
crystaldream
C
Atrás
Arriba