Este artículo va para sinpalabras, que me preguntó cómo había tuneado el estilo del blog. Antes de nada, y como siempre, invitaros a visitar el blog de ad astra, que ha sido el pionero en este tipo de hurgamientos.
A continuación varias premisas, que confío sean verdaderas:

  • En las secciones título, sobre mí y nuevo artículo puedo meter código HTML.
  • El fichero de estilos CSS por defecto no se puede cambiar, ni el HTML de la plantilla de estilo, pero...
  • ...sí que puedo sobreescribir los CSS a mi antojo

Cosas que hice, más o menos:

  1. Lo primero que hice fue tener una idea más o menos clara de cómo quería que quedase el blog. Colores, distribución de los elementos, buena usabilidad, tipos de fuentes, etc. etc.
  2. A continuación busqué entre todos los estilos que ofrece lacoctelera.com aquel que coincidiera con el mayor número de características que esperaba de mi blog.
  3. Yo escogí el tema Florido azul. Como veis, en el ejemplo aparece un menú de navegación semejante al mío, pero que no aparece cuando tú escoges este estilo. Más adelante escribiré cómo lo puse.
  4. Lo siguiente es empezar a sobreescribir estilos. Hice una hoja de estilos propia, que podéis ver aquí, e inserté la siguiente porción de código en el apartado lema del título:
    <style type="text/css">
      @import url('/myfiles/dunkelheit/estilo.css');
    </style>

    para que dicha hoja de estilos se cargue y sobreescriba los elementos que a mí me convengan.

  5. En principio a base de cambiar los estilos ya se pueden hacer mil virguerías, pero yo concretamente quería tener un menú de navegación como el que sale en el ejemplo del estilo Florido Azul, por lo que se me ocurrió echar y vistazo al código html del blog original, y vi ésto:
    <div id="cabecera">
     <h1>TITULO</h1>
     <p></p>
     <div id="menu" class="clearfix">
     </div>
    </div>
  6. En el tag p se incluye el lema, y ahí es donde yo meto mi menú (aconsejo ver el código fuente de este blog). El tag div que hay a continuación del p es un estorbo, y para eliminarlo modifico su visibilidad con CSS.
  7. El paso siguiente es ir probando hasta que obtengas resultados. No hay que olvidar la compatibilidad entre exploradores y todas esas cosas.

Estaré encantado de resolver cualquier duda :O

La Coctelera | CSS | Tuning