Template de 3 colunas

Clique aqui para fazer o download do template, após abrir o arquivo de texto no seu computador entre na página editar html, copie e salve o código completo do seu blog(caso queira voltar ao modelo atual novamente).

Depois disso procure a parte:
<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML5' locked='false' title='' type='HTML'/>

No seu blog terá varias linhas parecidas com essa ultima e você deve copiar todas elas e colocar nas colunas do template que baixou desse site no lugar dessas ultimas linhas nestes dois trechos:

<div id='sidebar-wrapper'>
<b:section class='sidebar' id='sidebar' preferred='yes'>
<b:widget id='HTML1' locked='false' title='' type='HTML'/>

<div id='newsidebar-wrapper'>
<b:section class='sidebar' id='novabarra' preferred='yes'>
<b:widget id='HTML3' locked='false' title='' type='HTML'/>

Mas tenha atenção, não é para colocar o trecho inteiro em cada uma das partes, mas para dividir entre as duas, ou seja, colocar algumas das linhas em uma e o resto na outra por que essas são as colunas laterais do blog. O mais importante aqui é colocar todas as linhas que copiou não deixando faltar nenhuma nem repetir qualquer uma das linhas. Afinal depois de fazer essas mudanças será fácil trocar as coisas de lado na página layout somente clicando e arrastando até o lugar desejado. Depois de terminar fazer isso coloque o código na página editar html, clique para salvar e já está pronto seu template de 3 colunas.

Para mudar as cores de fundo clique na guia fontes e cores e encotrará como trocar as cores de fundo do blog. Agora vamos ajustar a largura das colunas e do blog para isso só precisamos achar n o código que desejamos mudar:

Largura do blog: #outer-wrapper
Postagens: #main
Coluna da direita: #sidebar
Coluna da esquerda:#newsidebar-wrapper

E usar esse exemplo abaixo, pois o modo de mudar em qualquer uma dessas partes é o mesmo:

.exemplo {
width: 300px;
font-family: "Comic Sans MS";
font-size: 12pt;
color: #FF0000;
text-decoration: none;
border: 2px solid #000000;
margin: 5px;
padding: 3px;
}

No caso acima troque o numero 300px na ultima linha, mas lembre-se o importante não é a ordem das linhas, mas o que está em cada uma e quando fizer alterações não esqueça de manter o ponto e vírgula no final como está no exemplo. Além do valor em pixels(px) poderíamos usar o valor em percentagem, ficando desse jeito: width: 100%; isso é um jeito fácil de fazer seu site se ajustar ao tamanho da tela dos seus visitantes. Mas é claro se as larguras das imagens e outras coisas que estão no seu site foram maiores que a largura da tela aparecerá a barra de rolagem horizontal(embaixo) ou dependendo do layout ele mudará uma das colunas para baixo.

Se tiver algum problema escreva para nosso e-mail fabiano1404@yahoo.com.br