Se seu blog está faltando espaço para adicionar Gadgets, adicione mais espaço no rodapé e deixe seu blog com mais Gadgets e mais bonito :-)
Advertências:
Apague todos os Gadgets do rodapé "Footer" "Layout"->"Elementos da página"
- É indicado salvar antes os Gadgets do rodapé do blog para que não ocorra perdas.
Salve os Gadgets antes de começar! Não só estou pedindo ;-)1.Acesse o painel do Blogger
2.Vá em "Layout"->"Editar HTML" não marque a "Caixa Expandir Modelos de Widgets"
3.Procure pelo código abaixo "Ctrl e F" :
<div id='footer-wrapper'>
<b:section class='footer' id='footer'/>
</div>4.Substitua o código em laranja por este abaixo:
<div id='footer-columna-contenedor'>
<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>
<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='Text20' locked='false' title='' type='Text'/>
</b:section>
</div>
<div style='clear:both;'/>
</div> 5. Agora vamos adicionar a CSS ao blog para que ela controle o espaço entre as colunas, procure pelo código abaixo:
]]></b:skin>6. Acima do código anterior adicione o código seguinte:
#footer-columna-contenedor {
clear:both;
}
.footer-columna {
padding: 10px;
}7. Salve as alterações e vizualize.
A area de adição de Gadgets ("Layout"->"Elementos da página") deve ficar como esta imagem abaixo:
34 Comentários
Maravilhoso!! Nossa Muito obrigada! Já coloquei no meu blog!;)
@Brava Malvada , Foi um prazer poder ajudar:)
Não achei esse 1º código no meu blog, não consegui muda nada buaaaa :-(
@NYCK DOWNLOADS , coloque abaixo de <div id='footer-wrapper'> o código 4
eu ja tinha tentado fazer isso alias testei em vários lugares, só consegui colocar em baixo do cabeçalho do blog, mais daí fica ruim né... se poder me ajudar de novo agradeço (:
Não conseguir achar a 1ª linha, alias ela não tem no meu blog, pode me ajudar? Gostaria de colocar estas colunas no rodapé do blog, aguardo retorno, obrigada!
@Marilucia , coloque abaixo de <div id='footer-wrapper'> o código 4
Olá!Cheguei aqui por mero acaso e logo encontrei duas alterações que queria fazer no meu blog.Foi tudo fácil e correu bem.Obrigada!Fou linkar,seguir,etc,etc!!!
Sensacional! Tudo o que eu precisa!!!
é isoo ai cara valeu ficou da hora
sensacional, cara.. me ajudou bastante.. valeu
http://guaranysportingclub.blogspot.com/
Deu tudo certo e ajudou bastante, VALEUUU!!!
Olá.
Não tou conseguindo introduzir as 3 colunas no footer, mesmo seguindo rigorosamente todas as instruções.
Após clicar no botão GUARDAR MODELO aprece a seguinte informação:
Não foi possível guardar o seu modelo.
Foi encontrado mais do que um widget com o ID: Text20. Os IDs de widgets devem ser exclusivos.
Por isso ao apelo a quem ler este comentário para me AJUDAR a resolver esta situação até pq eu já tive as 3 colunas (td certo) no meu blog mas ao querer salvar o template, escolhi outra opção q me fez perder todo o esquema (layout) incluindo as 3 colunas. ALGUÉM ME AJUDE POR FAVOR. MUITO OBRIGADO.
@Rúben Barata Da Silveira , seu problema é fácil de resolver basta mudar a palavra que está em negrito Text20 para ex: Text95
<div id='footer-columna-contenedor'>
<div id='footer2' style='width: 30%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col1' preferred='yes' style='float:left;'/>
</div>
<div id='footer3' style='width: 40%; float: left; margin:0; text-align: left;'>
<b:section class='footer-column' id='col2' preferred='yes' style='float:left;'/>
</div>
<div id='footer4' style='width: 30%; float: right; margin:0; text-align: left;'>
<b:section class='footer-column' id='col3' preferred='yes' style='float:right;'/>
</div>
<div style='clear:both;'/>
<div id='footer-bottom' style='text-align: center; padding: 10px; text-transform: lowercase;'>
<b:section class='footer' id='col-bottom' preferred='yes'>
<b:widget id='Text20' locked='false' title='' type='Text'/>
</b:section>
</div>
<div style='clear:both;'/>
</div>
akii.. nao estou conseguindo nao.. nao acha o codigo em laranja..
:'( No template do meu blog não tem o código:
:'(
@Semnome56, encontre um parecido mas lembre-se faça antes em um blog de teste.
meu blog nao tem os codigos expressos, como façopara colocar
kaytros.blogspot.com
Basta adicionar o código que você não possui abaixo de:
<!-- end outer-wrapper -->
e ai é só continuar o tutorial. Ok, qualquer dúvida é só comentar...
Duvida e fiz consegui tudo certinho mas a coluna de baixo não tem fundo
fica com o fundo do blog e as coisas escritas, não sei se entendeu, mas é +- isso.
Eu acho que da pra resolver se colocar as colunas pra serem iguais a sidebar, desde já agradeço. Estou achado isso muito dificil se vc puder me ajudar faço um post indicando seu blog que é muito bom. Suceso
nao funcionou no meu :(
como faço para diminuir porque fico muito grande olha ai http://luanteste11.blogspot.com/
outra duvida tem como colocar cor no fundo dos gadgets?
Olá amigos muti legal...]Fiz todo o processo como ordenado---porém meu fotter ficou lá em cima abaixo do cabeçalho---
Alguém sabe como me ajudar..
Valew
Adorei o blog, super fácil as explicações. O meu blog também não possuía o primeiro código que você colocou, mas encontrei a solução nas respostas que você dá aos "perdidos" como eu. Obrigada.
Como faço pra dividir uma coluna unica em 2?
No caso meu blog tem a coluna de postagem e uma coluna a direita, e quero manter assim, mas no final da coluna da direita gostaria de dividi-la em 2, como nesse site: http://nomundodoslivros.blogspot.com/
um dia fiz isso sem querer, mas não sei como que fiz... vc sabe?
Querida eu consegui fazer no meu, o problema é que esse codigo id='footer-3' showaddelement='yes'/> está no meu blog, no rodape! Não sei o que deu errado para ele ficar lá! AJUDAAAAAAAA, PLEASEEEEEE
Interessante, mas se eu fizer isso tiro os direitos autorais do criador do Blog, como posso mantê-lo?
Abraços
eu não consiguiiiiiiiiiiiiiiii
Consegui incluir, mas os elementos do rodapé ficam muito colados um no outro e nas margens. Como fazer?
Meu blog é: www.comandologin.com.br
Muito útil a informação desse blog. Recomendo!
[ www.blogdosocorrista.com ]
finalmente consegui o que eu queria... porem não fikou exatamente do jeito que eu queria só fikou 2 colunas, se alguen puder me dar uma dica eu aceito
Excelente dica, você é muito gentil.
Obrigada.
Abraços e sucesso
Postar um comentário
Deixe seu comentário aqui
Para exibir sua foto, escreva o seu comentário e clique em "Visualizar" e em seguida clique em "Adicionar Foto de Perfil"(Só é exibido quando o comentário é publicado como Conta do Google). Para editar seu perfil Clique aqui.