Presenta:¿Editar un blog es difícil?

Para empezar con este práctico tutorial, tengo dos indicaciones por seguridad:

1. Entra a tu blog, en la pestaña diseño busca laopción “edición HTML”, y haz clic, tal y como lo muestrala imagen.

Acto seguido vas al cuadro donde esta escrita la plantillaen códigos HTML, y copias todo el texto en una hoja wordo 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ónprevia. Para que así la puedas volver a poner y listo.

INTRODUCCIÓN

¿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 perointentando 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.

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 1100pxsi 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.

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.

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 muestrala 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.comFinalmente haces clic en GUARDAR y a disfrutar de tu blog.

FINTutorial hecho por : Renato-tube.Patrocinado por: El ocio de Renato.

Visita:

http://www.renato-tube.blogspot.com