Categoría: css
Tomando algo en la virgen.

Elige tu estilo:

  • Prefiero a Squidge...
  • ¡Me quedo con Wallace!
  • ¿Y qué hay de Spritz?
  • Definitivamente, Nola.
  • Yo soy pro-Roger.

    • Archivo de la Categoría: ‘css’

    Separando nuestros posts

    Domingo, Junio 7th, 2009

    Continuamos añadiendo elementos de diseño a nuestro blog, en este caso una sencilla separación entre las entradas que puede resultar vistosa si se hace adecuadamente.

    El proceso y el código en este caso es muy fácil, solo debemos añadir la imagen que queremos en la carpeta “images”(o la que querais) de nuestro tema, buscar el css y modificar la clase “post” añadiendo esto:

    ?Ver código HTML
    1
2
3
4

     
.post{
     background: transparent url(images/tuImagen.gif) no-repeat bottom;
}

    (más…)

    Etiquetas: , ,
    Dentro de css, destacado, diseño, html | 1 Comentario »

    Estilo de las entradas en wordpress

    Jueves, Junio 4th, 2009

    Hoy vamos a aprender cómo añadir una sección de mini-posts a un blog wordpress. En realidad con lo que vamos a aprender se puede hacer muchas más cosas, el tema de las mini entradas es solo para ejemplificarlo.

    Si tienes la última versión de wp habrás notado que mientras escribes, debajo de cada entrada hay una sección llamada campos personalizados. Pues bien, esto no es otra cosa que la posibilidad de añadir meta datos a nuestras entradas. La forma en la que lo usaremos ahora, es para hacer distinción entre unos posts y otros, es decir poder identificarlos y así darles forma a nuestro gusto en el css.

    Para el ejemplo voy a añadir la siguiente sección a mi css, que consiste en una nueva clase para cambiar el aspecto de los mini-posts. Después en mi footer usaré un bucle que llame a la función de wp encargada de reproducir los posts, pero haciendo uso de los metadatos podré cambiar la clase para que se muestre de distinto modo.
    (más…)

    Etiquetas: , , , , ,
    Dentro de css, destacado, diseño, html | 1 Comentario »

    Cambiar css con javascript

    Jueves, Mayo 28th, 2009

    Otra de las cosas que acabo de añadir al blog es la posibilidad de cambiar el css dinámicamente usando un par de librerias javascript, además, una cookie guarda el estado para que cada vez que abras de nuevo la página se mantenga el último estilo elegido.

    El código es tan sencillo como casi todo en jquery, solo tienes que añadir a la cabecera los “alternates” de los diferentes css e importar tanto jquery como el plugin de este modo:

    ?Ver código HTML
    1
2
3

    	<link rel="alternate stylesheet" type="text/css" href="nuevoEstilo.css" title="nuevoEstilo" media="screen" />
<script type="text/javascript" src="/wp-includes/js/styleswitch.js"></script>
<script type="text/javascript" src="/wp-includes/js/jquery.js"></script>

    El atributo “title” es lo que usará el javascript para identificar los css.
    (más…)

    Etiquetas: , , , ,
    Dentro de css, destacado, javascript, jquery | 1 Comentario »