dejá de jugar con el blog - 2da parte

Finalmente me decidí y puse la segunda columna en el blog, también le saqué el borde al header.

Y como lo prometido es deuda dejo unas mini instrucciones de como hacer para agregar la segunda columna.

En la parte de diseño Ir a la "Edición de HTML".

En el código buscar el fragmento que dice algo así:

#sidebar-wrapper {
  margin-left: 5%;
  width: 20%;
  float: right;
  word-wrap: break-word;
  }

Entre las llaves puede haber diferentes cosas de acuerdo al template que tengamos. Eso es lo que maneja el estilo de la barra, dice como se ve.

Hay que copiar ese fragmento desde el # hasta la } y pegarlo abajo.
Para poder diferenciarlos hay que cambiarle el nombre (lo que está después del #) yo le puse leftsidebar-wrapper.

Dentro del estilo hay que indicar de que lado queremos que aparezca la barra, esto se hace dándole un valor al atributo float, los valores posibles son "left" y "right". Si le dejamos el mismo valor a las dos quedan juntas del mismo lado.

#leftsidebar-wrapper {
  width: 20%;
  margin-right: 5%;
  float: left;
  word-wrap: break-word;
  } 

Ahora que ya tenemos el estilo para la columna hay que crearla, para eso hay que copiar la que ya tenemos y cambiarle el estilo para que use el nuevo. Para eso buscamos algo como esto:

      <div id='sidebar-wrapper'>
        <b:section class='sidebar' id='sidebar' preferred='yes'>
          <b:widget id='BlogArchive1' type='BlogArchive'/>
          <b:widget id='BlogList1' type='BlogList'/>
        </b:section>
      </div>

Lo copiamos y pegamos abajo, modificamos los dos id de acuerdo al nombre que le pusimos al nuevo estilo y borramos los widgets:

      <div id='leftsidebar-wrapper'>
        <b:section class='sidebar' id='leftsidebar' preferred='yes'>

        </b:section>
      </div>

Listo ya tenemos dos sidebars... peeeeero si vamos a la vista previa segurísimo que se ve horrible, con una de las barras abajo de todo el texto, para solucionar esto hay que jugar con los anchos de las barras y de el panel central, esto se hace modificando el valor del width en los estilos de las 2 barras y del main-wrapper, el valor se expresa en porcentaje, yo le puse 20% a cada sidebar y 50% al principal, el 10% restante lo usé como margen (margin-left, margin-right).

Ahora sí, después de hacer varias pruebas y cometer varios errores van a quedar las 3 columnas bonitas.

Al final quedó más largo de lo que yo esperaba...

P.S.: La columna aparece en la parte de "Elementos de la página" así que se pueden agregar widgets desde ahí y también arrastrar los que ya tenemos de una columna a la otra.