19/12/2007

Blog com 3 Colunas

Antes de começar a mudar seu template para 3 colunas você deve salvar uma cópia do seu template original, pois essa mudança é um pouco complicada de fazer e caso você não consiga deixar seu blog do jeito que deseja será fácil voltar tudo ao normal tendo uma cópia salva no seu computador. Então vá até a página editar html e clique em Baixar modelo completo, então salve o arquivo e se tiverem problemas é só colocar esse modelo novamente nesta mesma página onde está escrito Faça upload de um modelo de um arquivo no seu computador.
Na explicação usarei varias vezes {..........} isso quer dizer que tem alguns códigos que não teria utilidade colocar aqui pois isso muda para cada modelo de blog, mas o procedimento para alterar qualquer um deles é o mesmo, clique e veja um exemplo de sidebar na pagina editar html.
Depois que salvar uma cópia do modelo vamos colocar a terceira coluna no blog, na página editar html procure onde está #sidebar{.........} e logo abaixo coloque:

#newsidebar-wrapper {
background-color: #cccccc;
width: 170px;
float: left;
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 */
}

A linha background-color:#cccccc; serve para colocar um fundo cinza na nova coluna, isso é somente para ficar mais fácil visualizar e acertar a largura dela, depois apague essa linha e a cor cinza desaparece. Quando falei acertar a largura estou me referindo a largura de cada coluna(essa que estamos criando e a que já existia), a largura das postagens também a largura total do blog. Para acertar isso olhe os seguintes códigos, o primeiro (760px) é a largura total do blog, 400px(largura das postagens) e 150px(largura da coluna que já existia no blog):

#content-wrapper {
width: 760px;

#main-wrapper {
width: 400px;

#sidebar-wrapper {
width: 150px;

Você precisa ajustar os valores para que a soma das duas colunas(sidebar-wrapper, e a que estamos fazendo agora) e da postagem(main-wrapper) seja menor que a largura total do blog(content-wrapper). Não deixe uma conta exata pois existem padding e margin que são espaços vazios nas margens e não estão incluídos nos valores. Portanto se quando visualizar seu blog as 2 colunas e a postagem não ficarem uma do lado da outra diminua um pouco o valor das colunas e postagem ou aumente a largura do blog. Mas antes de visualizar o blog precisamos colocar a segunda parte do código.
Agora procure por:

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Postagens no blog' type='Blog'/>
</b:section>
</div>

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


Então copie a segunda parte<div id='sidebar-wrapper'> fazendo as alterações para a nova coluna

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

Note que alterei as partes em negrito(newsidebar e novabarra). Depois de fazer essas mudanças coloque isso antes do techo acima. Outra coisa indispensável para isso funcionar é colocar alguma coisa que já existia no seu blog nesta nova coluna, foi o que fiz com a linha <b:widget id="HTML2" locked="false" title=""
type="HTML">, mas lembre-se de apagar essa linha na coluna antiga. Mas não se preocupe esta linha não for exatamente igual pois à parte HTML2 depende de quantas coisas você tem no blog, o importante é copiar uma linha para a nova coluna senão criaremos uma coluna vazia e ficará difícil visualizar.
Portanto esse trecho ficará assim:

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

<div id='main-wrapper'>
<b:section class='main' id='main' showaddelement='no'>
<b:widget id='Blog1' locked='true' title='Postagens no blog' type='Blog'/>
</b:section>
</div>

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

Depois de feito tudo isto é só salvar e pronto já conseguimos adicionar uma nova coluna ao blog. Se você agora remova a linha background-color: #cccccc; para tirar o fundo cinza da nova coluna pois como falei no inicio ela só servia para ficar mais fácil a visualização. As outras alterações como colocar mais coisas na nova coluna pode ser feito pela página modelo adicionando elementos de pagina do mesmo modo que da outra coluna que já existia no blog. Se ainda tiver alguma duvida veja nosso outro tutorial sobre colocar mais uma coluna no blog.

Veja também:
Como Ajustar a largura e espaços entre as colunas
Colocar fundo degrade no blog
Como conseguir mais visitas
Related Posts with Thumbnails

132 comentários:

  1. Olá ,adoro as suas dicas , sempre passo aqui para uma visitinha, mais hoje passei para deixar um comentário a respeito de mudar o blog, já tentei varias vezes , mas não consigo, sempre diz que não foi possivel, acho complicado , pois sou iniciante em materia de blog, gostaria de aprender mexer e entender mais sobre templates, html, mais no entanto acho super complicado, mais irei tentar de novo seguindo sua dica, beijs e um Feliz 2008 cheio de realizações e muito Suce$$o, um forte Abraço! Rosa Maria.

    ResponderExcluir
  2. gostaria de colorir as margens externas do blog.Você sabe como fazer isto? Obrigado e parabéns pelo blog.

    ResponderExcluir
  3. Daniel

    colorir as margens externas...

    não entendi bem o que você quer fazer, mas se for mudar a cor da parte vazia nas laterais do blog, na pagina editar html procure por:

    body {.......
    ......
    ......
    ....}

    terá varias coisas aqui, então coloque
    background-color: #0000FF;

    isso é um fundo de cor azul, é só escolher a cor que deseja

    ResponderExcluir
  4. Oi amigo, obrigado pela gentileza de me ajudar. mas a opção que você me deu faz o fundo inteiro mudar de cor. e eu gostaria apenas que as duas margens laterais, que ficam na parte externa do blog, mudassem de cor.obrigado novamente, e sucesso!

    ResponderExcluir
  5. E aí parceiro, blz, gostaria de saber se vc já tentou essas mudanças em seu blog, e se tentou o que deu errado? abraços

    ResponderExcluir
  6. Nilo Júnior

    Testei novamente depois que você perguntou se deu algo errado, e deu tudo certo. Fiz o teste adicionando a terceira coluna a partir do modelo:
    Blogger Template Style
    Name: Minima Black
    Designer: Douglas Bowman
    URL: www.stopdesign.com
    Date: 26 Feb 2004
    Updated by: Blogger Team

    Se você tentou e deu algo errado, tenha cuidado nos detalhes:

    ajustar a largura das colunas e a largura total do blog

    quando copiar a coluna existente para criar a nova, lembre-se de deixar uma das linhas por exemplo os arquivos e claro apagar essa linha da coluna original

    ResponderExcluir
  7. cuidado com espaços a mais ou a menos ou mudanças de linhas

    também tenha cuidado na hora de copiar alguma coisa da coluna já existente para a nova(linha HTML2 que falo na postagem)

    ResponderExcluir
  8. RESOLVENDO:

    FACIL AS PESSOAS QUE DIZEM QUE O "HTML2 JA TA USADO" E SO COLOCAR OUTRO Nº PARA SEU HTML....EXEMPLO NO MEU EU COLOKEI O NUMERO 99
    ENTAUM FICOU ASSIM: "HTML99"
    PODEM COLOCAR.

    FUIIIIIIII

    ResponderExcluir
  9. RESOLVENDO:

    FACIL AS PESSOAS QUE DIZEM QUE O "HTML2 JA TA USADO" E SO COLOCAR OUTRO Nº PARA SEU HTML....EXEMPLO NO MEU EU COLOKEI O NUMERO 99
    ENTAUM FICOU ASSIM: "HTML99"
    PODEM COLOCAR.

    FUIIIIIIII

    ResponderExcluir
  10. Não consegui colocar a terceira coluna,mudou algumas coisinhas,mas não criou outra coluna,pode me explicar melhor pelo meu orkut?
    http://www.orkut.com/Home.aspx

    ResponderExcluir
  11. Teria como eu mudar a lateral de um template. por exemplo: http://totalxx.blogspot.com/

    nesse blog teste eu coloquei esse template, eu gostaria de saber se tem como eu colocar uma coluna na direita, não ficar a duas na esquerda!

    se poder me ajudar e nao for muito dificiul.

    obrigadoo ;]

    ResponderExcluir
  12. Liipii

    coloque ou mude isso aqui no código das colunas

    float: right;

    se estiver left no lugar de right é só trocar isso faz mudar o lado da coluna, veja também no texto dessa postagem o lugar de colocar o código

    ResponderExcluir
  13. cara gostaria muito de fazer uma barra de titulo como a sua parabéns

    ResponderExcluir
  14. o veio será q vc poderia me ajudar?
    naum estou conseguindo mudar o blog para 3 colunas!1

    ResponderExcluir
  15. caso vc esteja online me add aee no msn

    jerry_edson@hotmail.com


    e quem souber e poder me ajudar eu agradeço

    ResponderExcluir
  16. Cara, já procurei milhões de vezes e não acho esse #sidebar{.....} que vc fala, nunca deu certo e olha que tentei pra carama, falando serio... uma dica pra vc e pra leigos coo nós.... desenheeeeeeeeeeeeeeeeee por favor!!

    obrifgado!!

    ResponderExcluir
  17. laboratório

    postei um link com uma imagem mostrando a sidebar, veja a explicação novamente


    http://img99.imageshack.us/img99/8982/sidebaryg4.gif

    ResponderExcluir
  18. Gente! Até consegui colocar a terceira coluna, mas não sei como se faz para escrever nela!!!
    Não consigo descobrir como se faz alguma coisa com essa coluna!
    PLEASE!!!!!!

    ResponderExcluir
  19. vá até a pagina layout de seu blog, aquele quadrado adicionar gadget deve aparecer em cima de cada uma das colunas é só adicionar o que desejar neles.

    ResponderExcluir
  20. funcionou blz, mas esse espaço vazio que fica no final do blog?? Alguém sabe como resolver isso???

    ResponderExcluir
  21. ola eu estava procurando um artigo deste tipo e sinceramente, não decepcionou em nada. amei, fiz tudo como foi dito aqui, e deu certo. quero agradecer, parabéns pelas dicas!!!

    ResponderExcluir
  22. Kra, Eu Naum To Axando Esse #sidebar, Ja Fiz Di Tudo, So Aperece No Modelo Clássico, e Qando Eu Coloco Naum Consigo Reverte, Vc Poderia Me Ajudar?

    Meu E-Mail: Gustavo.Lz@hotmail.com

    ResponderExcluir
  23. a #sidebar aparece no modelo layout, umas linhas depois de /* Inner layout */

    ResponderExcluir
  24. Bom dia Fabiano
    sou Renato de Penambuco
    eu mandei um e-mail pra você
    sobre um por quanto vc colocaria três colunas no meu blog,abração cara
    espero retorno
    seu,urgente

    ResponderExcluir
  25. Este comentário foi removido pelo autor.

    ResponderExcluir
  26. Fabiano, boa noite. Uso seu blog como referência pra mexer no meu. Tudo funciona perfeitamente, mas estou tomando uma "surra" pra colocar a terceira coluna. Fiz como vc explicou, mas na hora de salvar aparece uma mensagem dizendo "Não foi possível analisar o seu modelo, pois sua formatação é inadequada. Certifique-se de que todos os elementos XML estão fechados adequadamente." Aí eu procuro a tag citada na mensagem e fecho. Daí aparece outra mensagem igual, pra outra tag... Enfim... Me ajuda? Obrigada!

    ResponderExcluir
  27. Fabiano, só pra complementar: primeiro pede pra eu fechar a tag b:section, depois div... e depois body, depois script... nesta ordem.

    ResponderExcluir
  28. Cara, tentei de tudo, não achei muita coisa do que você disse e ainda não consegui ajeitar nada, me perdi legal.
    Pode me ajudar ?

    e-mail: f.a.q.forum@hotmail.com

    ResponderExcluir
  29. vou preparar um modelo pronto para download com 3 colunas, assim ficará mais facil, fazer essa mudança de 2 para 3 colunas é um pouco complicado mesmo

    ResponderExcluir
  30. FABIANO !
    DESCOBRI O ERRO !
    CONSEGUI JÁ !
    SÓ UM PROBLEMA: TENHO AS 3 COLUNAS
    POREM A DO MEIO DA MAIS PRA ESQUERDA, NÃO ESTÁ CENTRALIZADA, COMO EU FAÇO PRA CENTRALIZAR ?

    E COMO EU FAÇO PRA BOTAR A BORDA NA EM VOLTA DA COLUNA TODA ?

    TIPO:
    __________
    | FABIANO|
    | É |
    | REI |
    |________|

    ResponderExcluir
  31. para trocar a coluna de lado procure por float:left; no código delas, e troque por float:right; ou o contrário.

    veja aqui sobre bordas
    http://dicasparablogs.blogspot.com/2008/08/colocar-ou-alterar-as-bordas.html

    ResponderExcluir
  32. Não acho que você não entendeu.

    Eu quero contornar uma coluna com bordas, fazer o contorno nela tipo no seu blog.

    E

    Como fazer pra centralizar a coluna do meio?

    Pra entender melhor, olhe esse blog:

    www.vestveiga2009.blogspot.com

    ResponderExcluir
  33. esse blog usa uma imagem de fundo, aquelas bordas que separam as postagens das colunas na verdade são uma imagem de fundo

    ResponderExcluir
  34. E como eu faço pra fazer como eu quero ?

    ResponderExcluir
  35. veja nossas explicações sobre imagens de fundo, está no guia rapido

    tem que fazer uma imagem, hospedar e coloca no código do blog na parte #content-wrapper{...

    se tiver mais duvidas sobre isso escreva para nosso email fabiano1404@yahoo.com.br

    ResponderExcluir
  36. mano me ajuda, eu nao consegui de jeito nemnhum. tentei umas 7 vezes e tudo oq aconteseu é coloka o meu menu em negrito, eu nao intendo muito bem de HTML. Intao me da uma força, de preferencia pelo msn, se ppuder ser pelo msn me add: gregory_ggy3@hotmail.com

    vlw

    ResponderExcluir
  37. ™ GяΣgoяﻵ MﺔŧђΣΰﯕ ™ - Kenpachi não usamos msn

    vou preparar outro tutorial sobre como colocar 3 colunas, vou tentar achar um jeito mais simples de fazer isso.

    ResponderExcluir
  38. Olá! Eu tentei muitas vezes mais não consegui! Se eu colocasse você como Admin do meu blog você faria isso pra mim? POR FAVOR!

    ResponderExcluir
  39. ola, eu so vim aki dizer q eu consegui fazer a 3ª coluna brigadao, é so ler com calma e ir tentando muito obrigado ^^

    ResponderExcluir
  40. Parabéns pelo site! É o que eu estava precisando. Conseguir criar a terceira coluna, mas o texto [texte]da 3 coluna e da coluna do meio estão muito próximo; como faço para separá-los?

    ResponderExcluir
  41. veja essa postagem sobre larguras do blog

    http://dicasparablogs.blogspot.com/2007/08/largura-do-blog.html

    ResponderExcluir
  42. você precisa alterar a largura do titulo
    #header-wrapper {
    width:660px;

    coloque o mesmo valor da largura que usou na parte das colunas do blog

    ResponderExcluir
  43. você precisa alterar a largura do titulo
    #header-wrapper {
    width:660px;

    coloque o mesmo valor da largura que usou na parte das colunas do blog

    ResponderExcluir
  44. Mais tem 2 #sidebartop dependendo do modelo, oque devo fazer? quem quiser visita meu blog da uma opinião lá ta livre em :D http://www.bobbas.tk, se poder responder minha duvida por email: Jornal_habbilo@hotmail.com irei ficar agradeçido adoro muito seu blog abraços

    ResponderExcluir
  45. já que vai modificar o modelo do blog sugiro que faça isso apartir do minina ou Son of Moto são os mais fáceis

    ResponderExcluir
  46. Adoreei, só q é bastante complicandinho de fazer ¬¬'
    HUAHUAHAU

    ResponderExcluir
  47. realmente é complicado, mas não tem outro jeito.

    ResponderExcluir
  48. Realmente não consegui, me blog esta ótimo só me falta isso, da uma olhada: http://www.bobbas.tk, você pode me ajudar mais, não acho sibebar-wrap, #header-wrapper só, e n ta dando cérto acho que dependendo do modelo não da cérto, se podesse me ajudar meu email é: jornal_habbilo@hotmail.com ,obrigado e responda por email pfv :D

    ResponderExcluir
  49. Isso é impossivel men achei:

    #sidebar

    Ñ tem isso lá

    ResponderExcluir
  50. eu ñ intendi onde eu posto a segunda parte do code?
    vlw!
    adoro esse blog!xD

    visite:

    www.livrodacomedia.blogspot.com

    ResponderExcluir
  51. Ola peguei uma Dica aqui e Gostei muito, como minhas postagem fica muito grande resolvi colocar resumo de post.

    Template do meu blogm fui eu que modifiquei fui colocando algums codigo que eu ja sabia e terminei o ponto que eu queria, gostaria vc me fala-se oque voce axa dele.
    amigosdownload.blogspot.com..

    brigado..

    ResponderExcluir
  52. os modelos variam um pouco no seu está #sidebar-wrapper, clique ctrl F para procurar as coisas na pagina editar html

    ResponderExcluir
  53. Biel

    tudo nesta postagem é feito na pagina editar html

    ResponderExcluir
  54. Olá!!!
    Gostaria muito que vcs pudessem me ajudar.
    Como faço pra mudar a coluna da postagem, ao invés da esquerda colocar no meio.
    Desde já agradeço a ajuda.

    ResponderExcluir
  55. Ficou só o espaço da nova coluna!
    Não mostrou Adicionar um Gadget , o que faço agora?

    ResponderExcluir
  56. Ola equipe dicas para blogs!

    Quebrei muito minha cabeça ate que consegui-se que ficase do jeitinho certo rsrs as 3 colunas uma na esquerda uma no meio e outra a direita, porem nao sei o que fiz que os titudos dos gadjets e das postagens ficaram enormes, e nao gostei, voutei o layout ao normal, bom quase, o que pode ter acontecido? abraços!

    blogdoluarencantado.blogspot.com

    ResponderExcluir
  57. é dificil dizer o que aconteceu, provavelmente apagou algo a mais no blog, mas veja esse link sobre formatar texto
    http://www.dicasparablogs.com.br/2009/04/como-formatar-o-texto-do-blog.html

    ResponderExcluir
  58. Boa dica queria mesmo botar outra coluna

    ResponderExcluir
  59. Cara vc ta de parabens não sabia oque seria do meu blog sem suas dicas Parabéns.Parece dificil mas é só prestar um pouco de atenção. valeu

    ResponderExcluir
  60. Cara parabéns eu me amarro nas suas dicas, parabéns

    ResponderExcluir
  61. Achei muito fácil:

    http://naruto-kun-blog.blogspot.com/

    ResponderExcluir
  62. valeu mesmo.no começo um pouco complicado para iniciante como eu,mais um pouco de pratica e fica perfeito.com essas dicas coloco elas colunas do jeito que eu quero. valeu!!!!

    ResponderExcluir
  63. OLA! ADOREI SUAS DICAS!
    + NAO TO CONSEGUNDO COLOCAR UMA NOVA COLUNA NO MEU BLOG

    SERA Q VC PODE MIM AJUDAR

    MIM ADD NO MEU MSN

    CIROJSF@HOTMAIL.COM

    ResponderExcluir
  64. Olha, Fabiano eu não consegui achar o sidebar, só achei o sidebar-wrap.
    Mesmo vendo a imagem mais não consegui indentificar!
    O que faço para achar, meu blog é diferente? O que é?

    Obrigado pela atenção!

    ResponderExcluir
  65. Fabiano, como coloco o guia rápido no meu blog?
    Tipo site!?
    Faz tempo que tento achar isto na internet mas não consigo!

    ResponderExcluir
  66. Dário Melo
    o guia rápido são os marcadores do blog só isso.

    ResponderExcluir
  67. gostaria de saber como deixar um blog de 3 colunas com 2 colunas?

    ResponderExcluir
  68. olá.. consegui fazer tudo certinho.. mas as duas barras ficam coladinhas uma na outra, lado a lado, é assim mesmo? queria uma d cada lado da postagem.. como q faço? brigada!!

    ResponderExcluir
  69. Oi Fabiano, sua dica esta ótimo. Muito bem explicado. Mas só tem condições de fazer esta alteração para quem já tem algum conhecimento básico. Sugiro um acréscimo nesta dica para facilitar mais quem é leigo no assunto. Como exemplo vamos escolher um modelo clássico do blogspot de preferência o último, retirar o código do modelo em branco, insirir o código da terceira coluna e mostrar o código inteiro nesta dica. Valeu!

    ResponderExcluir
  70. Prof. Reigota
    obrigado pela sugestão, eu estava mesmo preparando uma nova explicação mais detalhada sobre como adicionar um coluna no blog.

    concordo com você que é um pouco complicado de fazer, mas infelizmente não tem outro jeito mais fácil, se houver eu não conheço

    ResponderExcluir
  71. Consegui colocar a 3 coluna e até achei fácil de fazer, apenas não tou a conseguir colocar o espaço direito entra as colunas. Fica uma coluna kase em cima da outra e o espaço entre as outras duas é grande.

    ResponderExcluir
  72. veja esse link sobre largura das colunas
    http://dicasparablogs.blogspot.com/2007/08/largura-do-blog.html

    ResponderExcluir
  73. eu consegui criar a coluna, mas as configurações de cores e fontes do blog não foram aplicadas a ela. o que deu errado?

    ResponderExcluir
  74. paulinho
    no exemplo da postagem a nova coluna está com fundo cinza, use a busca no inicio de nosso blog para encontrar sobre imagens ou cores de fundo

    ResponderExcluir
  75. Só pra dar um feeedback, este post me ajudou muito no meu Blog, obrigado.

    ResponderExcluir
  76. Eu sempre visito o seu blog e uso a maioria das dicas mas tenho uma dúvida que eu acho que você ainda nao postou.
    Eu quero saber como separar a sidebar das postagens sem precisar de usar imagens

    ResponderExcluir
  77. Banjo Master Hero

    é relativamente simples separar as colunas sem imagens, primeiro no estilo #content-wrapper retire a cor ou imagem de fundo e depois coloque separadamente nas colunas e postagens(#main, #sidebar e #newsidebar)

    ResponderExcluir
  78. valeu, eu consegui.
    só mais uma dúvida:
    que programa você usou para fazer a antiga imagem do header ficar se mexendo?

    ResponderExcluir
  79. nosso outro banner era feito em flash, é esse mesmo o nome do programa, a versão mais recente é o flash cs4

    ResponderExcluir
  80. Olá Fabiano. Olha eu aqui de novo. Realmente, teu blog é show. Mas definitivamente, não consigo criar a 3a. coluna. Já tentei umas trocentas vezes depois daquele post que deixei aqui e não consigo. Sei que poderia tentar usando o mesmo modelo que vc usou para criar o tutorial, mas não quero mudar outra vez o modelo do meu blog pq depois dá um trabalhão danado pra deixar tudo ajeitadinho. Bem, então te pergunto: tem como eu te enviar por e-mail o código HTML do meu blog e vc cria a 3a. coluna aí e depois me envia por e-mail? Daí eu colo direto lá nas configurações de edição de HTML do blog. É possível?
    Grata.
    Abçs!
    Myrian
    Ah! Obrigada pela resposta ao outro post que fiz aqui. Valeu!

    ResponderExcluir
  81. mas a questão é justamente essa se o seu template é diferente fica complicado fazer um template para ele fora do blog, pois mesmo usando seu html como inicio na hora de instalar poderia ser necessário algum ajuste(sempre falta algo)

    escreva para nosso email e vamos ver o que fazemos sobre isso.

    ResponderExcluir
  82. Consegui criar a 3a coluna mas a nova fica em cima da antiga. Queria saber se tem como colocar uma em cada lado da postagem. Será que é possivel?

    ResponderExcluir
  83. Simplesmente Mulher
    na verdade você usa uma imagem de fundo que precisaria trocar

    http://img690.imageshack.us/img690/8926/curediabetescopy666.jpg

    para se adaptar melhor a nova largura do seu blog, veja aqui sobre afastar um pouco uma coluna da outra
    http://www.dicasparablogs.com.br/2009/12/espaco-entre-as-colunas-do-blog.html


    outra coisa retire a linha
    background-color: #cccccc;
    do código da newsidebar, isso é aquela cor de fundo cinza

    ResponderExcluir
  84. Muito obrigada, viu :D
    Tive que tirar a 3a coluna mas agradeço a ajuda.

    ResponderExcluir
  85. Oi adoro as suas dicas!
    Eu tentei colocar tres colunas e deu certo mas teve um problema !!ela não ficam centralizadas!!ou ficam dodas para esquerda ou todas para a direita!!por favor me ajude a resolver isso!!!Eu ja tentei colocar right e left!!Mas não existe um center!!??

    ResponderExcluir
  86. maria
    as colunas ficarem centralizadas não é nesta parte do código.

    você pode corrigir isso colocando text-align:center; junto com os códigos do body{....

    ResponderExcluir
  87. No meu blog(não sei pq)eu tive que mudar um tal de "label1" pra "label2" ao invés de "html1" pra "html2" n sei pq mas so assim deu certo(na verdade nem tinha html 1)

    ResponderExcluir
  88. Ola Fabiano. Meu nome é Fabio - asuhuhashasu - e criei um blog faz uma semana. Vi várias postagens suas sobre editar um blog e fui tentando fazer isso no meu - www.jovensdofuturo2.blogspot.com Sucesso em todas, mas eu queria saber como posso colocar um menu do lado direito e outro do lado esquerdo e deixar as postagens no meio, igual o seu menu lateral direito, so que eu queria 2 laterais. Se puder me explicar por msn - bio_trust@hotmail.com - eu agradeço. Obrigado, Fábio A. novo seguidor =) .

    ResponderExcluir
  89. esta postagem é sobre colocar mais uma coluna no blog, sei que é um pouco complicado de fazer mas não tem outro jeito

    ResponderExcluir
  90. Muito obrigada!
    Fazem 5 dias que estou tentando colocar a bendita terceira coluna, husahuashusaa' *.*

    ResponderExcluir
  91. Fabiano, coloquei tudo deu certinho mais eu queria colocar a área das posts no meio, tem como isso?

    ResponderExcluir
  92. João Pedro
    acho que já resolveu o problema, visitei seu site e as postagens estão no meio

    ResponderExcluir
  93. Cara eu uso o template Minima Black e não estou conseguindo deixar as postagens entre as duas colunas, meu blog é o translucidorock.blogspot.com se poder me ajudar, ate consegui adicionar outra coluna porem ela fica abaixo das postagens !

    ResponderExcluir
  94. Puts! MUITO BOM!!! VALEU MESMO!!! Graças a vocês não precisei baixar template!! Não gosto de templates, acho falta de criatividade, prefiro personalizar do meu jeito!! VALEU!!

    ResponderExcluir
  95. Gracias por tener un blog genial, es muy interesante.

    ResponderExcluir
  96. Oi eu não consigo, a terceira coluna aparece embaixo e não do lado. Tentei várias vezes e quando não aparece do lado aparece nos gangster. Ai, devo estar parcendo uma burra.... Mais por favor entra em contato comigo, quero mt colocar uma 3º. coluna. Beijos
    Email: vcrdvc@gmail.com

    ResponderExcluir
  97. Olá pco

    muito bom seu blog. Parabéns!
    O seguinte é esse: consegui colocar a 3ª coluna, mas a coluna de postagens ficou no canto direito e eu quero ela no meio, vi que outra pessoa teve a mesma dúvida, mas pela orientação que foi passada pra mesma não resolveu meu problema. Como podes me ajudar?

    ResponderExcluir
  98. vamos fazer um novo tutorial sobre 3 colunas no blog, mas para trocar a coluna de lado precisa mudar o trecho do #main para float:right e a #newsidebar para float:left

    ResponderExcluir
  99. valeu fabiano :D consegui ajustar a largura do meu blog!

    ResponderExcluir
  100. Olá, consegui fazer seguindo seu tutorial, no entanto eu queria criar uma coluna no lado direito, mas esse tutorial acabou criando uma sidebar, ficando abaixo do banner do meu blog.

    Tem um tutorial ensinando a criar uma coluna do lado direito ?

    Exemplo:

    banner

    Coluna esq|Conteúdo|Coluna dir

    ResponderExcluir
  101. Batista
    se quiser agora é possivel fazer isso facilmente na pagina designer do modelo: Mudar template do blog - Designer do modelo

    ResponderExcluir
  102. Fabiano Roberto

    Hmm, encontrei mas acontece o seguinte, é que eu estou usando um template que baixei na net, e quando tento alterar o layout ele diz "Não é aplicável a este modelo."

    tem solução ? ou tenho mesmo que mudar de template ?

    muito obrigado por ter respondido.

    ResponderExcluir
  103. dependendo dos codigos utilizados seria necessário modificar muitas coisas no html do seu blog, talvez seja melhor trocar de modelo

    ResponderExcluir
  104. e se eu quiser criar 3 colunas em uma só postagem, é possível, como? eu peguei um código noutro site, usando float, mas o que era pra ser a terceira coluna sempre vai para baixo. duas eu consigo colocar, mas três não. conhece algum código pra isso?

    ResponderExcluir
  105. Vládia Queiroz
    você fala fazer colunas dentro de uma postagem? se for isso pode usar esse código:

    <div style="float:left; width:32%">conteudo aqui</div>
    <div style="float:left; width:32%">conteudo aqui</div>
    <div style="float:right;width:32%">conteudo aqui</div>

    mas se estiver falando do layout do blog acho que não é possivel

    ResponderExcluir
  106. é isso sim, é dentro da postagem. agora já usei esse código, mas não consegui, ficou como te falei: duas colunas e a terceira desceu. tem algum outro código ou alguma manha pra fazer dar certo? quero colocar 3 telas de streaming uma ao lado da outra, mas não fica. e esse código deveria funcionar pra tudo, né?

    já tentei também em vez de usar o float nas duas primeira usar o margin-left e na terceira usar o float, mas também não fica.

    na verdade já fiz inúmeras combinações.

    ResponderExcluir
  107. diminua um pouco o valor 32%, talvez as margens da postagens estejam dando problema, use 30

    ResponderExcluir
  108. já usei 30, já usei até menos. o meu modelo é do formato que não tem as colunas laterais, ou seja, o espaço para postagem toma toda a tela. visivelmente cabe o tamanho de cada tela que estou colocando, inclusive a da direita que deveria ficar alinhada com as outras e desce, ela não fica abaixo das outras, ela fica à direita, só que não fica alinhada, algo assim

    tela 1 tela 2
    tela 3

    não sei o que fazer...

    ResponderExcluir
  109. para dividir a postagens em colunas você precisa ver a largura das imagens ou video se colocar, não adianta usar uma largura se o conteudo da coluna for maior

    ResponderExcluir
  110. percebi agora quando recebi sua resposta que o exemplo que dei não ficou como realmente fica na tela, porque o comentário é alinhado à esquerda. mas o que queria dizer é que as telas ficam cada uma em uma coluna, como se tivesse realmente dividido, só que a da direita fica uma linha abaixo, mas fica à direita. Eu testei agora aquele código que você me passou do jeito que estava, ele funciona, ficam as três colunas alinhadas, mas não ficam na largura da postagem inteira. Apesar do meu modelo não ter a coluna lateral, a largura do blog ser inteira, é como se não aceitasse dividir na largura inteira as três colunas alinhadas. com o seu código, sem incluir nenhum outro dado, somente como teste eu percebi que as 3 colunas ficaram divididas como se o modelo tivesse a coluna lateral. deu pra entender? porque será isso? tem como mudar no template para que ele reconheça a largura inteira da página?

    ResponderExcluir
  111. encontrei no meu tamplate os seguintes dados:






    isso quer dizer que apesar de ter escolhido o formato nos novos modelos de designer para não ter a coluna da direita ele continua interpretando que tem? ou seria necessário avaliar todo o código do template para ter certeza?

    aguardo

    ResponderExcluir
  112. é estranho ficar assim, normalmente ficam todas alinhadas, se tiver algum texto ou imagem antes da divisão da pagina isso pode causar o desalinhamento

    ResponderExcluir
  113. Amigo, nao consigo de forma nenhuma fazer com que os comentarios existentes no meu blog apareçam no final da pagina inicial como o seu por exemplo. Como posso fazer os comentarios aparecerem e tambem ter uma caixa de comentarios como essa? Obrigado.

    ResponderExcluir
  114. Oi, como todos sou fã do seu blog. Estou com um problema, pois não gostaria de mudar para meu blog para "layout". Gosto do modelo clássico e não tenho problemas em trabalhar com o HTML. Gostaria de saber como colocar mais uma coluna, sem alterar o modelo. Estou trabalhando para melhorar o layout do blog/site. Vc pode me ajudar?

    ResponderExcluir
  115. o código html para colocar mais uma coluna é o deste tutorial...

    mas acho que deveria mudar para os novos modelos... eu pretendo fazer isso em breve... só não fiz ainda porque sempre que estou quase pronto aparece um imprevisto (o ultimo foi problemas com o computador)

    ResponderExcluir
  116. eu qero saber como colocar uma coluna igual a sua que estar escrito ajuda para blogs me respode ae . meu email e ronan_estilodog@hotmail.com

    ResponderExcluir
  117. ronan
    aquela lista são os marcadores do blog, veja aqui como Personalizar gadgets do Blog

    ResponderExcluir
  118. olá, eu já baixei vários template para meu blog mas dá a seguinte mensagem: Ajustar larguras, Layout (Nao aplicável a este Modelo.)
    como posso modificar como posso ajustar o html para quebrar essas limitações?
    desde já obrigada :)

    ResponderExcluir
  119. Equipe Maluco Humor
    esses templates que baixou devem ser do modelo antigo (antes da pagina design do modelo) por isso não funcionam os recursos da pagina para alterar a largura e outras coisas

    precisa mexer diretamente no html

    ResponderExcluir
  120. oi, depois de criar as 3 colunas no Mínima a atribuição 'tecnologia blogger' ficou à direita, como faço para que fique centralizado? no css do footer há o atributo: text-align=center. obrigada.

    ResponderExcluir
  121. tente arrastar o gadget do atributo para o rodapé... ele deve estar em outra parte

    ResponderExcluir
  122. Sempre com ótimos posts. Parabéns e obrigado!

    ResponderExcluir
  123. Olá,

    O meu blog tem tres colunas:

    /* Outer-Wrapper----------------------------------------------- */
    #outer-wrapper{width:950px;margin:0px auto 0px;padding:0;text-align:$startSide;font:$bodyfont;}
    #content-wrapper{background: #FFFFFF url(http://2.bp.blogspot.com/_5UzqrQjtYEQ/TZLzCM1IjgI/AAAAAAAAB4c/yMyVLRz9E8U/s000/contetwrap.png) center top repeat-y;}
    #main-wrapper{width:520px;padding-left:20px;padding-right:15px;float:left;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 */
    }
    #lsidebar-wrapper{width:175px;float:left;margin-left:10px;margin-right:5px;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 */
    }
    #rsidebar-wrapper{width:px;float:right;margin-left:5px;margin-right:10px;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 */
    }

    como eu faço para remover a esquerda?

    esse é o template que estou usando:
    http://btemplates.com/2011/blogger-template-gamedude/demo/

    Obrigada

    ResponderExcluir
  124. retirar um coluna do blog é um pouco complicado... talvez seja mais facil achar outro template já no formato para a pagina design do modelo que permite esse tipo de alteração em um clique.


    você poderia apagar o trecho #rsidebar-wrapper...... e depois ajustar a largura das colunas restantes, mas antes disso remova os gadgets desta coluna

    faça um backup antes de começar esse é um processo que as vezes gera erros e também precisa fazer testes até ajustar o blog como você quer. Então ter o seu modelo atual salvo é algo importante e durante os testes que fizer salve também assim não correrá o risco de no final do trabalho perder tudo (já aconteceu comigo rsrs).

    ResponderExcluir