Listado de Paginas.

[zatoshi]

Buenas miren de primera les doy el link de mi site

http://arthasdestiny.es.kz

Ahora os explico aver si me podeis exar un cable.

Como vereis he conseguido poner 2 widgets en la parte superior del theme, uno de las noticias recientes y otro el de las páginas. No se mucho de php pero algo de html y css así que he conseguido que en vez de un <li></li> en las noticias aparezca esta imágen.



Ahora bien, tengo un problema, quiero hacer lo mismo en el de páginas reciente.

Este es el código que tengo en widgets.php

Código:

/**
 * Display pages widget.
 *
 * @since 2.2.0
 *
 * @param array $args Widget arguments.
 */
function wp_widget_pages() {
	$options = get_option( 'widget_pages' );

	$title = empty( $options['title'] ) ? __( 'Páginas Recientes' ) : apply_filters('widget_title', $options['title']);
	$sortby = empty( $options['sortby'] ) ? 'menu_order' : $options['sortby'];
	$exclude = empty( $options['exclude'] ) ? '' : $options['exclude'];

	if ( $sortby == 'menu_order' ) {
		$sortby = 'menu_order, post_title';
	}

	$out = wp_list_pages( array('title_li' => '', 'echo' => 0, 'sort_column' => $sortby, 'exclude' => $exclude) );

	if ( !empty( $out ) ) {
?>
	<?php echo $before_widget; ?>
		<?php echo $before_title . $title . $after_title; ?>
		<ul>
			<?php echo $out; ?>
		</ul>
	<?php echo $after_widget; ?>
<?php
	}
}

Me podríais ayudar a quitar a en vez del "li" aparezca esa imágen, he retocado muuucho el código bajo mi inexperiencia, se que quitando <ul></ul> se quita la imagen del punto, pero he intentado de incuir en...

Código:

<ul>
<?php echo $out; ?>
</ul>

la imagen en codigo html <img..... /> y nada suele ponerse delante o detrás de los titulos de las paginas, y no sustitule el <li></li>.

he leido tambien que tocacando el codigo.

Código:

$out = wp_list_pages( array('title_li' => '', 'echo' => 0, 'sort_column' => $sortby, 'exclude' => $exclude) );

Se puede llegar a hacer, pero no consigo leer algo que me ayude a conseguirlo.

Gracias de antebrazo digo antemano ^^.

[American2010]

Me parece que podrías consultarlo en el sub-foro de PHP mejor esto... De seguro es más PHP que WP...

[AlvaroG]

Hola zatoshi, bienvenido a Foros del Web.
Permíteme recomendarte leer este tema para que tu estadía por acá sea la mejor posible.

Ahora, contestando a tu pregunta, la forma más sencilla de hacer esto es utilizando CSS:

A un html como éste:

Código HTML:

<ul>
<li>Un elemento de lista</li>
</ul> 

le podés aplicar un CSS como éste:

Código css:

ul {
    list-style-image : url(ruta/a/la/imagen);
}
 

y verás la imagen colocada en vez del punto. Así de sencillo y así de rápido.
También podés utilizar una clase (class="algunacosa") o un identificador (id="algunacosa") en la etiqueta UL, por ejemplo para que esa imagen no se aplique a todas las listas.

Muevo el tema al foro de CSS, ya que CSS es tu mejor opción en este caso, en vez de jugar con imágenes.


Saludos.

[zatoshi]

Mil gracias, deveras, me has ayudado mucho ^^.

Otra cosa nueva que se de css ^^.

Gracias.

---

Edit 1:

Una pregunta y se puede por css, para que entre título y título se acorte el espacio?.

Gracias ^^.

[Aresillo]

Pregunto, yo lo hice poniéndole background al li. Por ello, tuve que ponerle un line-height del tamaño del alto de la imagen... porque si por lo que sea el usuario utiliza una letra más pequeña que el ancho... se recortará la imágenes con la de arriba...
¿Qué diferencia hay??
Lo hice en este ejemplo: las flechas naranjas de entradas recientes que hice para una competencia de css
http://www.emdma.com/FdW/kersv2/kers.html

Un saludo!

[zatoshi]

Pues gracias por el código "line-height" es lo que andaba buscando, gracias a ello tambien en las noticias reciente tengo la flechita.

Un saludo :D

[AlvaroG]

Iniciado por Aresillo

¿Qué diferencia hay??

Supongo que sería simplemente una diferencia semántica.

Haciéndolo vía background-image uno tiene algo más de control. Por otro lado, haciéndolo con list-style-image se puede colocar una imagen de lista y otra de fondo


Saludos.

[Aresillo]

gracias jefe!

Ares