Este documento proporciona instrucciones en 5 pasos para crear una segunda o tercera columna lateral en un blog utilizando código HTML. Primero, el lector debe copiar y respaldar el código HTML existente. Luego, deben agregar nuevas variables, ajustar el ancho, copiar el código de la segunda columna y cambiar los nombres, agregar el contenido de la nueva columna y finalmente agregar el código HTML para la nueva columna. Siguiendo estos 5 pasos, el lector podrá crear columnas laterales adicionales

1. Presenta:
¿Editar un blog es difícil?

2. Para empezar con este práctico tutorial, tengo dos
indicaciones por seguridad:
1. Entra a tu blog, en la pestaña diseño busca la
opción “edición HTML”, y haz clic, tal y como lo muestra
la imagen.
Acto seguido vas al cuadro donde esta escrita la plantilla
en códigos HTML, y copias todo el texto en una hoja word
o block de notas. Todo esto es con el fin de que si en la
edición de tu plantilla cometes errores y no obtienes los
resultados que buscas, tengas respaldada tu información
previa. Para que así la puedas volver a poner y listo.
INTRODUCCIÓN

3. ¿Como crear una segunda, tercera o más columnas laterales?
Primero debes saber que las columnas laterales en un Blog y en idioma
HTML, son llamados sidebar. También debes tener en claro que todas las
plantillas de los blogs, son distintas así que debes tomar este tutorial,
como un ejemplo, y tienes que tomar lo que mejor te ayude.
1º Tienen que ver la plantilla, en un comienzo les costará entenderla pero
intentando y con persistencia les aseguro que resultará. Tienen que ir a la
sección que dice “/* Variable definitions “ , dentro de esta parte, están
====================
situadas todas las variables de tu blog, lo que es texto color, etc; ustedes
deben buscar en todas las variables, las que tengan el nombre sidebar.
Como se ve en la imagen, en mi plantilla
solo aparecía las variables de
“sidebarBgColor1” y la “sidebarBgColor2”,
ambas corresponden a la columna 1 y 2.
Para la tercera columna copio la variable
“siderbarBgColor2” debajo de las dos
variables anteriores y le cambio el nombre
de “siderbarBgColor2” a
“siderbarBgColor3”, y la que me resulta es
la variable que queda en verde, como
muestra la imagen.

4. 2º Después sigues bajando, y buscas la sección con el nombre “/* Content”
es en esta donde está el contenido de tu blog. Primero tienes que ubicar la
siguiente imagen:
En esos códigos ubican el que dice “width”
que significa anchura. En i blog vino con
950px, y como ven lo modifique a 1100px
si deseas puedes poner 100% para facilitar el
trabajo.
3º Después sigues bajando, y ubicaras
los códigos de cada sidebar, tal y
como se ve en la imagen, deben
hacer el mismo paso de las variables,
en este caso yo copie la información
del “#sidebar2-wrapper {“, y le cambie
el nombre a “#sidebar3-wrapper {”, y
me quedo como pueden apreciar en
la imagen con sombreado verde.

5. 4º Después encontrarán la sección “`/* Left Sidebar Content”, la cual no
modificaremos, sigues bajando y encontrarás /*Right Sidebar Content, en la
Que verás resaltado en verde,
cada parte tiene el nombre de
sidebar2, ya que corresponde a la
segunda columna. Como nosotros
queremos crear una tercera
columna, copiamos toda la
información de esa sidebar, y los
nombres resaltados se cambian
por sidebar3, en mi plantilla, al
modificar esto, la tercera columna
quedo tal y como muestra la
imagen de la derecha. Si se dan
cuenta todo lo resaltado con
amarillo, son los nombres de
sidebar2, modificados por
sidebar3.

6. 5º Por último el paso final, siguen bajando y encontrarán la sección
“/* Footer”, siguen bajando y llegarán a unos códigos más raros, el que
deben encontrar para sentirse encaminados es el <div id='sidebar-wrapper'>,
si lo encontraron siguen bajando hasta encontrar <div id='sidebar2-wrapper'>
que representa la segunda columna entonces copian esa información y
cambian el nombre a <div id='sidebar3-wrapper'>, tal y como muestra la
siguiente imagen:
Quedará tal y como muestra
la imagen, mi resultado fue los
códigos que están sombreados,
obviamente que el contenido de esa
parte no es tal igual a la sidebar2,
porque yo ya la modifique, cosa que
harán uds, después de lograr la
tercera columna. Los resultados
quedarán como se muestra en el
siguiente blog:
http://www.renato-tube.blogspot.com
Finalmente haces clic en GUARDAR y
a disfrutar de tu blog.

7. FIN
Tutorial hecho por : Renato-tube.
Patrocinado por: El ocio de Renato.
Visita:
http://www.renato-tube.blogspot.com