Postagem dividida em colunas
Este truque de dividir a postagem em duas colunas paralelas, eu encontrei no blog Templates e Acessórios, que consulto sempre.
Como achei a dica muito legal, decidí dividir com vocês. É muito fácil realmente de aplicar e você tem a liberdade de usar apenas em determinadas postagens.
Basta inserir em sua postagem o código:
<div style="float: left; WIDTH: 45%">Aqui o Texto da Coluna da Esquerda</div>
<div style="float: right; WIDTH: 45%">Aqui o Texto da Coluna da Direita</div>
<divstyle="clear: both"></div>
Lembrando que você deverá colar este código apenas nas postagens que desejar dividir.
27 comentários:
Oi Ariane. Essa dica eu tinha pego no Bloggerbuster. A Amanda ensina a fazer uma página de arquivo com colunas, eu até fiz um post sobre isso, e adaptei colocando 4 colunas, conforme você pode ver no rodapé do meu blog.
Será que rola eu colocar uma imagem dividindo os posts??
Muito útil
Valeu a ajuda
Ariane, estou há quase 24 hs tentando separar os widgets da sidebar (uso o rounders 3 ) e não consigo saber o que faço de errado, porque mesmo seguindo todas as dicas que vc postou sobre este assunto não consigo fazer aparecer espaço de separação com a cor de fundo do blog entre os blocos.
Quando e, se, vc tiver um tempo eu apreciaria muito a sua ajuda
Gina, eu te ajudo sim, mas esse template tem um porém. A sidebar tem duas imagens, no topo e na base, que criam a borda arredondada. Para separar as widgets, vc terá que abrir mão das imagens, tirar a cor da sidebar e colocar a cor só nos widgets e depois separá-los com margin, assim:
margin: 5px 5px 15px 5px;
vai ter que mexer em muita coisa, ok? qualquer dúvida deixa um comentário. Abraços!
Oi, peguei um dos seus templates e fiz um caderno digital pra minha filha. Modifiquei um pouco pra poder colocar a foto dela. Ela se envaideceu e espero que isso a motive a fazer o blog, ou seja, postando as matérias da escola diariamente. Espero também que isso a ajude a passar no vestibulinho para o ensino médio e que tenha valido as seis horas que eu estou em cima disso, rsrs. Se der certo, uma parcela da culpa será sua. Muito obrigada mesmo.Dá uma olhada:
www.cadernomel.blogspot.com
Beijoooooosss
Sol
Oi Sol, ficou muito bacana mesmo, heim? Parabéns! Só vou dar uma sugestão, ok? Ví que vc colocou um asterisco no lugar do título, já que editou o título do blog na imagem que usou, correto? Então, vc pode retirar o cabeçalho sem nenhum problema, sem precisar usar este recurso. Vá em Layout e clique em Editar no retângulo que corresponde ao cabeçalho e depois clique em Excluir. Abraços!
Oi Ariane! Tudo bem?
Acompanho sempre as postagens do seu blog! Parabéns!
Eu tenho uma dúvida: encontrei um layout MUITO lindo e minha amiga o adaptou todo bonitinho!
MAS... ele é feito em HTML!
Tem como adaptá-lo para XML? Acho tão mais prático e bem mais bonito!
Aguardo sua resposta e grata desde já!
Beeeeeeeijos!
Anne
Anne, tem como, mas não automaticamente. Você terá que modificar um template XML para que fique como o outro. De qualquer maneira, seria melhor que eu desse uma olhada no template. abraços!
Olá, primeiro, parabens!
Seu blog me ajuda muito e sempre tem novidades!
...
Normalmente eu não comento, para
não encher muito seu tempo :)
mas sempre passo aqui!
Mas dessa vez eu estou comentando porque
to com uma dúvida!
Eu não to conseguindo mudar o meu menu horizontal, quero colocar um personalizado com borda arredondadas e com plano de fundo, porem eu vi seus links e encontrei sim!
Só que eu pesquisei meu html inteiro e não encontrei se quer uma palavra "navagation" algo assim, como esta no post "PERSONALIZAR MENU HORIZONTAL" :)
Me ajuda quando possivel, obrigado !
xuxuboy.blogspot
Xuxu, no caso do seu template a ID que contém o menu se chama 'linkbar-wrapper'. Procure por ela prá editar o menu, ok? abraços
Muito obrigada. Entro de férias em 3 dias e daí vou tentar fazer as mudanças com bastante calma. Agora, com a sua resposta, é que entendi uma das dificuldades: é que já tem dois blocos na vertical. Gratíssissima.
Vou acrescentar as suas dicas na minha lista de coisas que temo perder, se o LHC produzir um buraco negro.
Oi Ariane!
Preciso de uma ajudinha! Sou muito lesa nessas coisas de blog! Eu baixei uma template que vc converteu, essa:
http://templatesparanovoblogger.blogspot.com/2008/01/template-wordpress-futuretech.html
Ela é perfeita para mim, só que eu queria tirar a busca! Na imagem eu consegui mexer, mas o código tá dificil de achar como alterar! vc pode me ajudar??
Obrigada
bjs
Bia
Bia, apaga todo o código que você pode ver nesta imagem aqui.
Eu tinha tentado isso 400 vezes e dava erro! kk
Obrigada Ariane, Só porque vc me ensinou deu certo, vai ver eu tava esquecendo de apagar algum codigo, que abria ou fechava!
Coloquei um link pro seu blog lá no Bia Series, meu blog de séries!
beijocas e mais uma vez obrigada
Oi Bia, que bom que deu certo! Qualquer coisa é só chamar, abraços!
Olá,é bem legal seu blog, consegui fazer muitas coisas no meu blog com seu teus tutoriais, mas estou com um probleminha... tento colocar uma caixinha link-me, mas a imagem não aparece, fica com um x encima, já hospedei a imagem em diversos lugares, como no picasa e imageshack, mesmo assim não abre... o que pode ser, please me dê um help!!
Beijos Beth
Beth, deixa o código, mesmo com erro, lá no seu blog, prá que eu possa ver qual é o erro, ok? Me avise qdo colocar, abraços!
Queria saber se tem que colocar isso tudo dentro de uma div???
Se puder me ajudar eu agradeço...
Olá de novo, Ariane!
O template ao qual me refiro é este aqui:
http://nathriven.blogspot.com/
Teria como modificá-lo?
Quero MUITO que ele seja adaptado >___<"
Grata desde já!
Beeeeeeeeijos!
Anne, é como expliquei anteriormente, você tem que transferir as imagens que compoem o template para o novo blogger e mudar as medidas. automaticamente não dá.
Bruno, é possível sim dividir uma div desta maneira
Ariane tem como dividir essas colunas em 3 ?
Obrigado pela dica, teste e ficou muito bom. Deixa post com cara de jornal impresso.
Valeu
Ariane só uma dica no seu post, o trecho do codigo css onde tem:
" < divstyle= " clear : both " > < / div > " está com um erro a tag div style está junta o que pode dificultar a postagem para algumas pessoas que não entendem de css então se tiver como alterar o post e separar essas tags seria melhor para evitar futuros problemas pra ti ok!
E em nome de todos que frequentão seu blog, agradeço pelas suas dicas és uma salvação para novos blogueiros!
Ariana, eu tenho um blog e eu queria um banner personalizado para mim.
Eu tenho 2 Problemas:
1- a imagem desfoca e fica com qualidade baixa(eu faço no paint)
2- Como eu sei o tamanho correto da dimensão da imagem ?
Essa irei responder por ela toda imagens feita no paint deforma tente fazer em outra plataforma tipo photo fire ou phot shop
Postar um comentário
Os comentários são moderados.