Como adicionar quatro colunas no rodapé (footer) do seu blogger

Outro problema que ocorre com muitos blogueiros hoje em dia com certeza é o fato de faltar espaço para widgets em alguns modelos de template não é verdade! Então pessoal vou fazer um turorial para ensinar como colocar quatro colunas no rodapé (footer) do seu blogger, eu particulamente não coloquei aqui no meu blogger ainda, agora para meus leitores que usam os modelos de template que estou disponibilizando aqui no blogger sabem que todos estão com vários locais para widgets tanto no footer(rodapé) como no sidebar(lateral), e entao não será necessário seguir esse tutorial.

Mas vamos ao passo-a-passo, entre logado em seu blogger e em seguinda click em "layout" em qualquer uma das duas opções que estou mostrando nas fotos abaixo.

Em seguinda basta clicar na ferramenta "editar html" para abrir a página de edição e troca de template.

Novamente bato na mesma tecla, nunca eu disse nunca edite ou troque o seu template sem antes salvar o seu template, para isso basta clicar no ícone indicado nessa foto e salvar o modelo que vai aparecer, para evitar futuros transtornos e dores de cabeça.

Agora vamos aos códigos para colocar as colunas no footer, não é necessário clicar em expandir modelos de widgets, basta Pressione Ctrl+F e procure por: /* Footer.

Achando esta sessão no código do template, substitua pelo código abaixo, porém, se não houver footer no seu template, adicione o código abaixo antes do código ]]></b:skin>

/* Footer
----------------------------------------------- */
#footer-wrapper{background:#151515;clear:both;margin:0 auto;padding:15px 0 5px 0;overflow:hidden;}
#foot-wrap{margin:0 auto;width:980px;}
.foot{width:25%;float:left;margin:0;padding:0;color:#999;}
.foot a:hover{color:#ccc;}
.ft{padding:0 10px;}
.ft .widget{margin-bottom:15px;}
.ft ul{margin:0;padding:0;list-style:none;}
.ft li{margin:0;padding:0 0 .25em;}
.foot h2 {
font-size:16px;
font-weight:700;
font-family:Arial,Verdana,Sans-serif;
color:#ccc;
border-bottom:dotted 1px ;
margin:0 0 5px;
padding:0 0 2px;
}
#credits{font-size:11px;}
.trb2,.trb3,.trb4{background:#fff;border-left:1px solid #d8d8d8;border-right:1px solid #d8d8d8;}
.trboxcontent{background:#fff;border:0 solid #d8d8d8;display:block;border-width:0 1px;padding:2px 10px;}
.trb1{background:#d8d8d8;margin:0 5px;}
.trb1,.trb2,.trb3,.trb4{display:block;overflow:hidden;}
.trsnazzy{background:transparent;margin:0 0 10px;}
.trtop,.trbottom{background:transparent;display:block;font-size:1px;}
.trb2{border-width:0 2px;margin:0 3px;}
.trb1,.trb2,.trb3{height:1px;}
.trb3{margin:0 2px;}
.trb4{height:2px;margin:0 1px;}
/* wireframe layout tweaks */
body#layout *{margin:0;padding:0;}
body#layout,
body#layout #foot-wrap,body#layout #navbwrap,
body#layout #outer-wrapper,
body#layout #content-wrapper {width:750px;min-width:750px;}
body#layout #navb{padding-bottom:15px;}
body#layout #main-wrapper{width:40%}
body#layout #header-wrapper{height:60px;}
body#layout .foot{width:187px;}
body#layout #srchbxwrap,body#layout #credits{display:none;}

Após ter colado o código acima no seu layout, salve, e depois click novamente CRTL+F e procure pelo código:

<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>

Encontrando substitua por este código abaixo, porém, se não houver este código no seu template procure por esta <!-- end content-wrapper --> e cole o código abaixo abaixo dele.

<div id='footer-wrapper'>
<div id='foot-wrap'>
<div class='foot'>
<b:section class='ft' id='f1'/>
</div>
<div class='foot'>
<b:section class='ft' id='f2'/>
</div>
<div class='foot'>
<b:section class='ft' id='f3'/>
</div>
<div class='foot'>
<div class='ft'>
<b:section id='f4'/>
</div>

<!-- creditos -->
Footer by <a href='http://newtechsound.blogspot.com/' target='_blank'>newtechsound</a>

<div class='clear'/>
</div></div></div></div>

Tudo feito certo basta salvar seu template, e pronto agora visualize para ver se tudo ocorre certo, e caso surja alguma dúvida basta entrar em contato.