Tema: Style WP
Ver Mensaje Individual
  #13 (permalink)  
Antiguo 09/06/2009, 19:15
American2010
 
Fecha de Ingreso: abril-2003
Mensajes: 1.129
Antigüedad: 21 años, 7 meses
Puntos: 34
Respuesta: Style WP

Bueno, vamos a ello...

Primero en tu "styles.css"

Ubica esta parte y dejala así... Y ya abajo de eso añadí el nuevo código...

PD: Más prolijo sería editar la imagen de ese fondo y hacerla más alta. Pero por ahora para hacerle espacio, subí el título...

Vamos: (El padding del caption es lo que cambia, el resto es tu nuevo codigo)

Código PHP:
#caption {
    
padding:0px 30px 0;
}

#pagenav {
    
floatleft;
    
width920px;
    
height40px;
    
padding-top5px;
}

#pagenav ul {
    
list-style-typenone;
    
floatleft;
    
padding-left20px;
    
height40px;
}

#pagenav ul li {
    
floatleft;
    
height40px;
    
width35px;
    
text-aligncenter;
    
margin-right10px;
}

#pagenav ul li a {
    
floatleft;
    
displayblock;

Y ahora en el header.php que está dentro de "templates" añadí esto...

(Justo despues de estas líneas)
Código:
		<div id="tagline"><?php bloginfo('description'); ?></div>
	</div>
Pones esto...

Código PHP:
    <div id="pagenav">
    <ul>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
        <li><a href="#"><img src="<?php bloginfo('template_url'); ?>/img/01.gif" /></a></li>
    </ul>
</div>
Los logos de los clubes que sean de 30 x 40 (Ancho por alto) con fondos transparentes, y los subís en la carpeta img que tiene tu theme...

Editas los link, y si quieres al código de las imagenes añadile el alt="Chelsea" etc etc

<img src="<?php bloginfo('template_url'); ?>/img/chelsea.gif" alt="Chelsea" />

¿Quieres verlo? Lo hice con una imagen cualquiera que la transparencia no le quedó muy bien, pero mira como quedaría...

http://www.lovienlared.com.ar/videos/#

(PD: Blog temporal, en poco o no estará más o aparecerá un Blog de videos :P )

Suerte, si quedan dudas nos consultas... De paso me sirvió un poco para aprender mas esto...

El sitio oficial tiene los 20 escudos de los clubes, pero con un fondito blanco, tendrías que tomarte el trabajo de hacerlos trasnparente... Oooo la otra, es hacer el menu en una zona con fondo blanco, pero eso se me ocurrió ahora :P
__________________
elGastronomo