Como dividir a sidebar em duas

Em vez de colocar 3 colunas no blog (um menu de cada lado das postagens) uma opção bem interessante é dividir a sidebar em duas colunas, isso deixar a sidebar (menu do blog) largo no começo e a partir do ponto que desejar ele se divide em duas colunas, com na imagem abaixo:


Para fazer isso no seu blog entre na pagina editar HTML, antes de começar salve uma cópia do seu template (baixar modelo completo) assim poderá facilmente voltar ao modelo atual se tiver algum problema. Usamos o template Mínima do Blogger para fazer essa explicação,
procure por:

#sidebar-wrapper {

width: 220px;......}

Logo abaixo desse trecho coloque:

#sidebar-wrapper-doble {

width: 220px;

float: $endSide;

word-wrap: break-word; /* fix for long text breaking sidebar float in
IE */

overflow: hidden; /* fix for long non-text content breaking IE sidebar
float */

}

#columna-izda {

width: 48%;

float: left;

}

#columna-dcha {

width: 48%;

float: right;

}

Depois disso procure por:

<div id='sidebar-wrapper'>

<b:section class='sidebar' id='sidebar' preferred='yes'>

<b:widget
id='HTML3' locked='false' title='' type='HTML'/>

</b:section>

</div>

O trecho em negrito são os gadgets que tem no seu blog, portanto no seu blog deverá ter varias linhas parecidas com essa, elas não interferem em nada essa modificação é apenas o conteúdo da sua sidebar. O importante é colocar o código abaixo entre </b:section> e </div>

<div id='sidebar-wrapper-doble'>

<b:section class='sidebar' id='columna-izda'
showaddelement='yes'>

</b:section>

<b:section class='sidebar' id='columna-dcha'
showaddelement='yes'>

</b:section>

<div style='clear: both;'/>

</div>

Salve e depois entre na pagina layout e arraste os gadgets para essas novas sub colunas (coluna dividida em dois)

Para ficar melhor podemos aumentar a largura total do blog, volte a pagina editar html e procure por:

#header-wrapper {

width:660px;.........

#outer-wrapper {

width: 660px;............

#footer {

width:660px;............

E troque esses três valores 660px por 980px, depois note que nos trechos acima onde modificamos a sidebar tem o valor 220px, ele aparece duas vezes então modifique os dois para 460 e visualize seu blog, acho que agora ficou com uma aparência bem melhor com essas novas larguras pra as colunas.