.

13 de mayo de 2009

Cambiar la amplitud de las columnas de la plantilla

Escrito por
Cambiar la amplitud de la side-bar. Hay una plantilla que te gusta, pero hay uno o dos detalles que cambiarias para que fuera exactamente lo que necesitas, para conseguir la plantilla perfecta. Se puede hacer. Se puede entrar en el código de la plantilla y modificarla tanto como se quiera hasta el punto de dejarla irreconocible, en el siguiente artículo vamos a ver un ejemplo simple, cambiar la amplitud de los espacios del blog, en concreto de la columna lateral o side-bar.

Lo primero que tenemos que hacer es ir a la pestaña "Diseño" en el editor de blogger, y en ella al apartado "Editar Plantilla". Se abrirá una pantalla donde tenemos un recuadro con texto en HTML, este es el código de nuestro blog. Si somos principiantes lo mejor es hacer una copia de seguridad antes de empezar, tras realizar la copia del texto y guardarlo procedemos a hacer los cambios para mejorar la plantilla.

1- Buscar donde están indicadas las características de la sidebar.
2- Buscar el valor de ancho de la sidebar y de toda la página.
3- Cambiar el valor de ancho al que queramos.
4- Observar en la vista preeliminar si los cambios son los que buscábamos o nos hemos equivocado.
5- Si es todo correcto, guardaremos los cambios.
6- En el peor de los casos si no conseguimos el efecto deseado, borraremos todo el código y restableceremos el código HTML inicial que hemos guardado.

El problema es que el código es largo y por desconocimiento del lenguaje HTML muchos bloggers no saben encontrar donde esta configurada la sidebar y sus dimensiones. Vamos a intentarlo. Baja leyendo el texto hasta que encuentres el apartado "Outer-Wrapper", aqui es donde configuramos los espacios del blog. Dentro de este apartado veras distintos subtitulos "outer-wrapper, main-wrapper, y sidebar-wrapper que se corresponden con el conjunto de la página, la columna principal (donde quedan los posts) y la columna lateral. Veras que cada uno de ellos hay una característica que es "width" y luego un valor como 600px, 840px, esto es el ancho de cada espacio si aumentas el numero de pixels (px) veras que aumentan el ancho de uno de los espacios.

Para cambiar el espacio de la side-bar y que no se desajuste el blog, deberás por ejemplo aumentar la sidebar de 200px a 350px y al mismo tiempo aumentar la anchura total (outer-wrapper) por ejemplo de 600px a 780px. Lo mismo puedes realizar para disminuir el tamaño de la columna si quieres que sea mas estrecha. Puedes realizar tantos cambios y pruebas como quieras, hasta encontrar el tamaño deseado y guardar la plantilla. En todo caso el outer-wrapper debería tener un valor igual o superior a la suma del ancho del side-bar y de la columna principal. Espero estas indicaciones os sirvan para mejorar vuestra plantilla y ajustarla a las dimensiones que queráis.

1 comentario:

  1. Gracias, tu blog es muy interesante y didactico,justamente queria hacer algo asi en mi blog, felicitaciones de nuevo y voy a intentarlo.
    Ed

    ResponderEliminar

Bienvenido, en este blog encontrarás información para crear y personalizar tu blog de Blogger o Wordpress, además de artículos sobre Internet, las nuevas tecnologías, programación con HTML y CSS, educación y otros temas. Espero que los tutoriales, artículos y recursos del blog te resulten útiles. Si quieres mantener el contacto puedes hacerlo a través de mis cuentas de Twitter o Google Plus.