Deixe as imagens do post com tamanho único
18.6.12
Pelo título do post já devem ter percebido que é um tutorial, né? Hoje nós vamos aprender a deixar todas as imagens do post com um tamanho único, assim quando uma imagem for maior que o campo das postagens ela não ficará para fora. Legal né?? O tutorial é curtinho e muito útil vale a pena ler! Vamos conferir juntos?
1. Painel do blogger >> mais opções >> editar html >> prosseguir;
2. Tecle F3 ou Ctrl+F e busque por body {
3. Copie o código abaixo e cole acima da tag que você acabou de buscar;
Deverá ficar assim no seu html |
.post img {
max-width: 600px; /* Tamanho das imagens */
height: auto;
}
Onde está escrito 600px de rosa será o tamanho das imagens. Lembre-se de saber a largura da sua área de postagem. Para isso, basta você subtrair o tamanho total do seu blog pelo tamanho da barra lateral. O resultado será o tamanho da sua area de postagem. Ex:
990 px - largura total
-310 px - barra lateral
----------
680 - o resultado é o tamanho da sua area de postagem
4. Visualize. Se ficou tudo ok salve.
45 Recados
Também fiz o selinho, postei hoje *o*
ResponderExcluirAmore, quando quero colocar a imagem de um tamnho só, coloco tudo como 'muito grande' q
http://vitaminadepimenta.blogspot.com.br/
Ótima dica,gostei :D
ResponderExcluirhttp://dezapaixao.blogspot.com.br/
Achei muito interresante *-* concerteza eu tenho que fazer isso ^^ obrigada pelo tuturial
ResponderExcluirSuper legal esse tutorial adorei vai ser muito util pra mim pois estava procurando esse tuto faz um maior tempão, Tu és foooo--....da mesmo hein..1
ResponderExcluirhttp://debysabetudo.blogspot.com.br/
super bacana o tutorial muittto boom messsmo.. vai ajudar noos toddoooss..
ResponderExcluirn
http://receitadakaka.blogspot.com/
q tudo esse post! adorei o tuto e a tag bem legal!
ResponderExcluirbjs
http://avidademalu.blogspot.com/ http://ohmygood-omg.blogspot.com.br/
O tutorial é ótimo. Fica tudo alinhado e organizado (:
ResponderExcluirUm beijo, http://onthefame.blogspot.com/
Post ótimo! ^^
ResponderExcluirOdeio quando a imagem passa da barra de postagem. ><
Assim é bem melhor.
BJUKU!!
Adorei esse tuto !
ResponderExcluirKisses :*
http://sweet-flower-laura.blogspot.com.br/
Volte Sempre !!
Olá querida... amei o Tutorial, mas não deu certo no meu blog não...
ResponderExcluirhttp://laudypoemas.blogspot.com/
Laudy
ResponderExcluirAs vezes não deu certo porque as imagens que tem lá já estão adequadas a area do post. Tente colocar uma imagem que ultrapasse o limite do campo de postagem e repita o tutorial : )
Caso não dê certo, comunique comigo!
Nossa que tutorial mais interessante, eu fico com muitaa raiva quando a imagem fica fora do lugar!!
ResponderExcluirMuito obrigada pela dica!!
http://www.hamster-doce-hamster.blogspot.com.br/
Tem muita gente querendo aprender como faz isso, era bom vc deixar no seu para os leitores verem que deu certo ^^
ResponderExcluirAdorei o tutorial, bem útil.
ResponderExcluirObrigada pela visita, volte sempre (:
Bezoos Nhaac :33
www.mundoo-cute.blogspot.com
muito bom o tutorial
ResponderExcluirwww.portalft.com
adorei a tuto
ResponderExcluiradorei mesmoo*--*
ResponderExcluiras dicas são mtoo boas ' ja to seguindo seu blog flor =)
tenha uma otima semana '
Lay
http://www.layanasouza.com
Olá...
ResponderExcluir♥ Ótimo tutorial, é sempre bom deixar o blog super bem oraganizadinho ;D adorei a tag.tenha um bom dia.
Pinkiss
by; Renata Princess ♥
http://my-life-pink-s2.blogspot.com
Oii linda. Bom dia!
ResponderExcluirVamos fazer parceria né?
Pega meu link lá. Onde fica o seu?
Vai ser muito legal.
Aguardo.
Beijos!
Gostei das respostas (:
ResponderExcluirontendency.blogspot.com
já conhecia o tutorial. Amei a dica
ResponderExcluirhttp://blogclubeteen.blogspot.com.br/
ih..to precisando aprender mesmo..passo muita raiva com isso..
ResponderExcluirQuero te convidar para participar do sorteio q tá rolando lá no blog!
http://poquimdemim.blogspot.com.br/2012/06/sorteioquer-ganhar-um-perfume.html
Passa lá dps! =)
Já conhecia o tutorial. Deixa o blog com certeza mais organizado :)
ResponderExcluirwww.blogmundodamoda.com
Sorteio de um cardigãn lindo com a Kawaii Shop
Ownnnnnnnt eu AMEI o cabeçalho!!!!!!!!! ta lindo!!!!!!!!
ResponderExcluirMuito obrigada mesmoo!!!!!!!!!!!!!!!!
to indo coloca AGORA!!!
Bjs
lolalinda123.blogspot.com
Como sempre, arrasando nos tutoriais né? Adorei suas respostas na tag. Também odeio falsidade, estou aprendendo a dizer não e gostaria demais de poder imortalizar quem eu amo!
ResponderExcluirBeijos.
Kika/Acessarte.
www.blogacessarte.blogspot.com
www.acessarte.com (loja virtual)
Achei o tuto que tanto procurava,mto obrigada,vou usar no próximo lay,flor amei seu blog,mto perfeitão,to com inveja,kkk brinks,seguindo (como não seguir ?!) espero ansiosamente sua visitinha em meu blog e quem sabe até uma nova seguidora ? kissus!
ResponderExcluirhttp://blog-garotaambulante.blogspot.com.br/
Eu já conhecia esse tuto! Muito útil, né?
ResponderExcluirBeijinhos, http://momamoraes.blogspot.com
Oww Yasmin que bom qe gostou : )
ResponderExcluir-----
Que bom que gostou Lorena =)
ooi flor ! Obrigada por comentar e seguir meu blog ^^ Fico feliz que tenha gostado. Pena que disse que só participaria do concurso se fosse uma etapa só . Bom mesmo assim agradeço o carinho *-*
ResponderExcluirbeijiinhos
---> www.clarinha-piink.blogspot.com
O tutu é otimo! e gostei da tag foi bom conhecer mais sobre você!
ResponderExcluirhttp://kelly-club.blogspot.com.br
Ja sabia essa rsrs :D
ResponderExcluir*---------*
BEIJUXX
http://ianapaulinhaaaa.blogspot.com.br/
Ei, que ótimo tutorial *-*
ResponderExcluirDe nada flor :D Vi que temos coisas em comum não? Sobre os grupos de escola, e com certeza sobre o Show do Nirvana s2
Um beijo!
Amanda - Doce Diário
É mesmo Amanda : )
ResponderExcluirsuper útil o tuto :)
ResponderExcluire se eu pudesse voltar no tempo, tbm queria ter ido no show do Nirvana haha'
bjs
www.crazyggirls.tk
Hoy lindinha!
ResponderExcluirAmo seu blog de paixão!
Seguindo ,se puder retribuir;
beijinhos ♥
http://day-princess.blogspot.com.br/
Gessi ótimo tutorial, acho que vai ajudar muito!! E realmente me identifiquei com muitas das coisas que você escreveu na tag, por exemplo não sou muito fã de revista teen e adoraria ir em um show do nirvana se pudesse voltar no tempo <3
ResponderExcluirhttp://lehdadicas.blogspot.com
Nunca tinha visto esse tuto, é ótimo :)
ResponderExcluirSeguindo aqui, viu? Adoraria te ver lá no meu blog. E se gostar não esqueça de seguir ><
Beijos ♥
Blog Refugio Teen - Fan page do blog, curte ;)
Adorei o tutorial!SEmpre fico perdida com html e tals.Busco o caminho mais facil.rs.Adorei!
ResponderExcluirBjs!
Que tutorial útil, ás vezes da muita raiva quando se acha a imagem certa para o post,mas ela fica maior que a área do post e pula para fora.
ResponderExcluirhttp://i-teenbr.net.tc
Achei muito interessante a dica, ajuda bastante agente que tem blog. Gostei do questionário *-* estou seguindo. Se puder me dar uma mãozinha agradeço >< http://encomendascomcathe.blogspot.com.br/
ResponderExcluirAh, adorei essa dica hein. Se bem que quando eu coloco alguma foto, eu escolho a opção Muito Grande e fica boa também ^^
ResponderExcluirAdoro essas Tags. Bom que a gente pode conhecer melhor a dona do bloguito!
Achei seu blog através do da Kika (AcessArt) e já estou seguindo. Adoraria que me seguisse tb ^^
BEIJO!
Realmente é o que eu precisava. O blog fica mais organizado com as imagens do mesmo tamanho.
ResponderExcluirMuito obrigada.
bjbj
Oi! Gosto do muito do seu blog e, justamente por isso, vou tirar uma dúvida. Eu tenho esse código no meu lay e funciona muito bem, obrigada ahaha, mas em uma das minhas páginas eu coloquei dois gifs e eles ficaram do tamanho do post. É. haha
ResponderExcluirTeria como invalidar o código para somente algumas imagens?
Obrigada desde já! :)
Perfeito, simples e objetivo, obrigado, era exatamente o que estava procurando e precisando...
ResponderExcluirDeu muito certo, obrigado.
ResponderExcluirgarotainsubstituivel.blogspot.com.br
Deixe aqui sua opinião a respeito do post ou do blog ♥
Você pode comentar através do Facebook também! É rápido, simples e prático!