Largura do Blog

Mudar a largura do blog, do menu ou das postagens são coisas fáceis de fazer e muito úteis, pois nem sempre o formato padrão atende nossas necessidades, para fazer tais mudanças precisamos encontrar no html do blog o código “width:” do que desejamos mudar a largura,

Usarei como exemplo o blog Frases Curtas que foi alterado a partir do modelo padrão Son of Moto (Mean Green Blogging Machine variation).

Mudando a largura total do blog:

#outer-wrapper {
margin: 0 auto;
border: 0;
width: 750px;
text-align: left;
background: url(http://i55.photobucket.com/albums/g138/robertojd/corpo.jpg);
font: normal normal 100% tahoma, 'Trebuchet MS', lucida, helvetica, sans-serif;
}

Esta parte definirá a largura do blog para deixar do tamanho que você deseja mude o numero 750, mas lembre-se que a maioria das pessoas usa resolução de tela 800x600, portanto não é recomendável usar um tamanho maior de 780, dependendo do contador de visitas do seu blog é possível ver a resolução de tela dos seus visitantes (no caso do Sitemeter na pagina de estatística clique em resolução, na parte de baixo da pagina tem Web Browsers e embaixo disso tem Monitor Resolution clicando você saberá qual a resolução de tela que seus visitantes mais usam).

Largura das postagens e do menu:

#main {
width: 395px;
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 */
}

#sidebar {
width: 255px;
float: right;
color: #000000;
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 */
}

O procedimento é o mesmo, altere os valores 395px(postagem) e 255px(menu) para a largura desejada para as postagens e menu respectivamente. Outra coisa que podemos fazer aqui é trocar o lado que as postagens e o menu aparecem, para isso basta mudar onde está float: left; e float; right; simplesmente trocando as palavras left e right de lugar. O resultado disso será a troca de lado entre as postagens e o menu. Veja também como altera o espaço entre as colunas do blog

Link desta página

Comentários

131 Comentários

131 Comentários:

caco disse...: tudo bem Fabiano? gostei das tuas dicas,tava pesquisando algo,por acaso vim para tua página,vou ver se dou uma arrumada no meu blog,que fiz a uns dois meses,e tambem gostaria de fazer uma parceria com tigo,se for do teu interesse,passa lá no meu blog,qualquer coisa entra em contato comigo,abraços

http://matematica-na-veia.blogspot.com/; 28 de agosto de 2007 13:51
Gabriela disse...: Meu caro...preciso da sua ajuda...acabei de criar um blog, quero torná-lo privado...qdo eu envio mail para convidar, esse amigo para além de ter de colocar o login e a password tem em cima o link do meu blog..basta clicar e tem acesso, ao meu blog, sem ter de fazer login...
como posso resolver isto?; 29 de agosto de 2007 15:12
Fabiano Roberto disse...: Caco
Já coloquei seu link neste blog, é sempre bom ter novos parceiros

Gabriela
Cadastro, login e senha precisa ter uma pagina somente para o login e ter banco de dados e os servidores de blog geralmente não dão suporte para tudo isso. Mas vou pesquisar mais um pouco e se encontrar algo que funcione, mandarei para você.; 31 de agosto de 2007 13:37
Anônimo disse...: cara adorei o seu blog.
mas nao percebi como metes aquele "quadrado" com os códigos (de banners por exemplo) por favor contactame o meu mail é este:
luisramalho_18@hotmail.com
parabens pelo blog!!!; 19 de fevereiro de 2009 19:51
Fabiano Roberto disse...: o "quadrado" com códigos chama textarea.

o código dela é
<textarea cols='25' name='yourForm' onfocus='this.select()' onmouseover='this.focus()'
rows='3'>
</textarea>

o numero 25 é a largura e 3 o numero de linhas

veja essa postagem sobre como colocar mudar a cor, bordas e outras coisas na caixinha
http://dicasparablogs.blogspot.com/2008/12/caixa-de-texto.html; 20 de fevereiro de 2009 13:44
Cláudio disse...: Fala meu brother!tenho uma dúvida aqui gostaria de uma ajudinha,tenho um blog de 3 colunas,queria colocar mais uma coluna do lado direito,p/ficar com 4 colunas/uma esquerda,uma principal e 2direta,será que vc poderia me ajudar?abração e sucesso!!o blog é show,informação nota 1000...continue assim sucesso!; 24 de março de 2009 11:25
Fabiano Roberto disse...: vou preparar um template de 4 colunas e logo colocarei aqui no blog a explicação de como fazer.; 24 de março de 2009 15:27
Zazmoze disse...: Li o artigo como você sugeriu, mas não consigo resolver,pois o texto da coluna do meio continua colado com o texto da primeira [nova coluna]. Crie a largura do blog com 780px e as colunas: 300+200+180px. Diminuindo o tamanho da primera coluna, o texto da coluna do meio vem junto e vice-versa.; 19 de maio de 2009 17:57
Zazmoze disse...: Problema resolvido:

#main-wrapper {
width: 370px;
float: $startSide;
padding: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 */
}
...acrescentei a linha: padding:10px e beleza!; 19 de maio de 2009 20:09
Davi disse...: Não funcionu e agora meu blog está doido oque eu faço?; 31 de maio de 2009 20:15
Fabiano Roberto disse...: Davi

qual o link do blog que está mexendo?

se você baixou o template de algum site provavelmente é um pouco diferente, mas as regras são as mesmas, o que você precisa é encontrar onde é a largura total do blog, das colunas e postagens; 31 de maio de 2009 21:05
Rodolfo Espinosa Bueno disse...: Tudo bem?
Eu tenho um blog (www.cienciainteressante.blogspot.com) e vc me ajudou muito a atualizá-lo.

Gostaria de pedir um favor, se vc puder colocar o link do meu blog no seu eu agradeceria, pois gostaria de uma parceria, muito obrigado.; 12 de junho de 2009 10:49
Ézio Pereira da Silva disse...: Oi Fabiano, tudo bem?
Muito boas dicas.
Você poderia, por favor, me conceder duas ajudazinhas?
1)Como faço para interagir (perguntas e respostas)com os leitores (visitantes) do meu blog?
2)como compartilhar com várias pessoas, com um comunicado só, as novas postagens que faço?
Pode responder aqui mesmo ou pelo meu email.
Agradeço, desde já.
Ézio; 2 de julho de 2009 15:16
BASQUETEIROS disse...: Muito interresante seu blog tem tudo que precisamos meu blog está
começando mas espero atingir aluns visitantes com o tempo

http://www.comopersonalizaroblog.blogspot.com; 14 de julho de 2009 08:44
Carros de Madeira disse...: Fabiano,
preciso de sua ajuda:fiz um blog há poucos dias e eu coloquei o meu blog com três colunas, mas as colunas estão meias desorganizadas não está dando pra ver e onde eu posto fica muito só pro canto esquerdo queria que fosse centralizado , gostaria que você desse uma olhada nele e me diser o que eu faço pra poder ajustá-lo.

Muito Obrigado; 19 de julho de 2009 18:48
Fabiano Roberto disse...: altere os valores de padding e margin para ajustar a posição da coluna central ou também é possivel acertar isso mudando a largura total das colunas ou do blog; 19 de julho de 2009 20:07
Carros de Madeira disse...: eu tentei mais não consegui ficou do mesmo jeito

entra ai e ver o que tenho que fazer : http://carros-de-madeira.blogspot.com/; 19 de julho de 2009 21:58
Fabiano Roberto disse...: se alterar os valores que estão na frente da palavra width vai mudar a largura das colunas e a distancia entre elas

#outer-wrapper {
width: 760px;
margin:0 auto;
padding:10px;
text-align:left;
font: normal normal 100% 'Trebuchet MS',Trebuchet,Verdana,Sans-serif;
}
#main-wrapper {
width: 440px;
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 */
}
#sidebar-wrapper {
background-color: #00BFFF ;
width: 150px;
float: right;
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 */
}
#newsidebar-wrapper {
background-color: #00BFFF ;
width: 150px;
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 */; 19 de julho de 2009 22:09
Fabiano Roberto disse...: Carros de Madeira
escreva para nosso email e vamos tentar resolver seu problema; 20 de julho de 2009 13:42
Gabriel Nascimento disse...: CADA VEZ MELHOR O SEU SITE. PARABÉNS E PARABÉNS E NÃO CANSO DE DAR PARABÉNS.
GENIAL A FORMA COMO VOCÊ (E MAIS NINGUÉM NA REDE MUNDIAL DE COMPUTADORES) TIRA AS DÚVIDAS DE PESSOAS LEIGAS NO ASSUNTO.
EU O SOU. ESPERO MANTER MAIS CONTATO COM VOCÊ, OU PELO MEU BLOG LITE´RÁRIO- www.omusicoeopoeta.blogspot.com OU PELO MEU E-MAIL gabrielnasciment.eagle@hotmail.com.
ESPERO REALMENTE QUE FABIANO SEJA UM SER HUMANO!; 20 de agosto de 2009 16:24
hard.team # Lucas disse...: Muito Bom =D; 27 de agosto de 2009 16:31
Vinicius Colares disse...: Oi Fabiano,
Eu tentei no meu blog, a coluna do post esticou, só que o os posts não esticaram juntos, continuaram do mesmo tamanho, aí ficou um espaço em branco entre os posts e a coluna do menu, como é que faz para aumentar o post junto?; 1 de outubro de 2009 01:56
Fabiano Roberto disse...: essa postagem fala da largura das colunas o comprimento de cada uma é em outra parte do código, precisa remover o fundo das colunas e usar uma cor ou imagem de fundo no estilo #content-wrapper; 1 de outubro de 2009 15:20
Vinicius Colares disse...: como eu faço para remover o fundo das colunas?; 2 de outubro de 2009 09:57
Adriano Santos disse...: como faço para retirar uma das colunas? a coluna da direita do meu blog não é utilizada e não axei no cod a parte onde eu excluo ela !
obrigado; 14 de outubro de 2009 18:24
Fabiano Roberto disse...: Adriano Santos
você pode usar essa postagem que mostra como colocar mais uma coluna no blog para retirar a sua
http://www.dicasparablogs.com.br/2007/12/blog-com-3-colunas.html

mas salve um cópia do modelo atual antes de começar pois isso é um pouco complicado de fazer e pode haver erros.; 15 de outubro de 2009 15:58
Cristhiam disse...: Poque as minhas letras fikaram grandes??

e porque naum tem + a linha quii separa os posts??; 26 de outubro de 2009 18:55
Eu Amo Cães... disse...: Olá, Fabiano, como vai?! Voltei aqui, rs. Estou com uma cruel dúvida! Segui todos os passos, mas entre a coluna do meio e a coluna do canto fica um espaço branco terrível(principalmente em monitores maiores). Queria "centralizar" essa coluna do meio, para diminuir o espaço mas, quando faço isso, a outra desce. Você pode me ajudar?

Obrigado desde já!; 3 de novembro de 2009 21:37
Fabiano Roberto disse...: veja se não tem padding ou margin junto com o código das colunas ou postagens isso faz um espaço vazio entre elas.

outra coisa a coluna vai para o final do blog quando o espaço entre elas não é suficiente.; 4 de novembro de 2009 16:04
Eu Amo Cães... disse...: Obrigado pela ajuda! Mudei as coisas, só não deu certo em monitores wide.; 13 de novembro de 2009 12:16
Fabiano Roberto disse...: é impossivel achar o template para todos os tipos de monitores.

você pode usar as larguras em porcentagem, mas sinceramente não gosto porque altera demais a aparência do blog; 13 de novembro de 2009 13:20
Anônimo disse...: Fabiano, não sei como dizer de outra forma: tuas dicas são muito legais, mas um leigo continua boiando. Vc pede para "encontrar tal coisa no html". Como posso fazer isso? O único html que conheço no blog é o de postar mensagens, e esse não tem qualquer referência ao tal "width".

A coluna onde posto meus textos no blogspot é muito estreita (acho até que devo ter cometido algum erro quando me registrei, porque meu irmão tb usa o blogspot e a coluna dele é maior) e gostaria de aumentá-la. Só o que posso fazer é te pedir um tutorial passo a passo. Porque me pedir para encontrar tal coisa e escrever tal coisa é impossível. Preciso saber onde está tudo e onde tenho que escrever, que botões apertar e assim por diante.

Peço desculpas pelo incômodo, mas a vida dos anjos da net, como vc, é dura, mesmo. Se puder me ajudar, te agradeço.; 22 de novembro de 2009 04:07
Fabiano Roberto disse...: esse html é na pagina editar html que aparece numa aba junto com a pagina layout do blog; 22 de novembro de 2009 07:37
ғ0rgəт▬mə▬n0t, disse...: Eu não sei o que há de errado com meu blog, pq, ao lado da sidebar, fica um espaço de uns 10cm até chegar na barra de rolagem.
Como eu retiro isso? Tentei arrumar na largura, mas só afinou a sidebar, o espaço continua lá e o mesmo.
A width em #header-wrapper tá 980px e em #outer-wrapper tá 990px.
Tive que colocar esses valores pra dividir o cabeçalho em 2 e colocar o título do blog alinhado à direita.
aaaaa, chega, rs, me ajuda por favor!!!; 14 de dezembro de 2009 16:59
Fabiano Roberto disse...: é normal sobrar algum espaço nas laterais do blog, não dá para acertar para todas as resoluções de tela.

se quiser pode trocar esses valores que citou por %, ou seja 100%, mas quando alguém com uma resolução muito baixa entrar no seu blog uma das colunas pode ir para o final da pagina; 15 de dezembro de 2009 12:32
fat212 disse...: Consegui colocar 3 colunas, mas como mudo as cores delas?
E as cores de fundo? E essa linha no meio???; 16 de dezembro de 2009 13:26
Fabiano Roberto disse...: fat212, coloque junto com o código de cada uma das colunas

background-color: #F08080;

claro que usando a cor que gostar mais

http://www.dicasparablogs.com.br/2009/02/codigo-das-cores.html; 16 de dezembro de 2009 15:13
Fabiano Roberto disse...: fat212, coloque junto com o código de cada uma das colunas

background-color: #F08080;

claro que usando a cor que gostar mais

http://www.dicasparablogs.com.br/2009/02/codigo-das-cores.html; 16 de dezembro de 2009 15:13
Haroldo Escritor disse...: Fala aí amigo, beleza??

gostei muito do seu blog, vc é um fera no assunto ne?

Eu sou novato faz tres semanas que criei meu blog para colocar meus textos la pois sou escritor e meu primeiro livro vem aí...

eu gostaria de saber se tem como a gente incluir mais uma coluna no blog spot, pois só tenho duas, que sao as das postagens e a outra ao lado direito onde fica os assessorios...
Queria uma do lado esquerdo tambem pra por uma foto, ou algo mais...

Sera que tem jeito isso??

obrigado!! bom 2010!!!

Haroldo C de Souza; 28 de dezembro de 2009 23:15
Fabiano Roberto disse...: Haroldo Escritor

aqui mostra como colocar mais uma coluna no blog
http://www.dicasparablogs.com.br/2009/11/colocar-mais-uma-coluna-no-blog.html; 28 de dezembro de 2009 23:55
Prof. Monica Ramalho disse...: Tenho um blog e hoje ao postar vi que a coluna lateral desceu ,ficou abaixo do post.Procurei por ajuda,li seus textos fui tentando...Resolvi criar outra coluna,vai que assim corrigia o erro.Tá bom,ficaram as duas colunas lá em baixo.Socorro,estou aprendendo na marra sobre esse bendito html,apanho mas vou tentando,mudei a largura da outer-wrapper,aumentei,da main-wrapper,fiz a sominha e não muda nada.Me ajude!!!!; 6 de janeiro de 2010 19:21
Licitações Sustentáveis disse...: Prezado editor do blog,
Peço que me ajude: o cabeçalho de minha página em monitor wide aparece normal, mas para CRT há um pulo da barra de links para baixo. Gostaria de saber como deixá-lo uniforme. Desde já agradeço pela atenção; 7 de janeiro de 2010 01:16
Fabiano Roberto disse...: Prof. Monica Ramalho

aumente um pouco mais a largura do #outer-wrapper {
width: 730px;

a soma das colunas mais a postagem está dando mais que 730, tente como 750.

isso porque o padding 10px que está no código dá uma margem de 10 de cada lado. por isso sempre é bom deixar o valor da largura total sobrando um pouco

Licitações Sustentáveis

reduza um pouco a largura do cabeçalho ou aumente a largura do blog; 7 de janeiro de 2010 16:14
marcia disse...: oi Fabiano,adoro seu blog,sempre dou uma olhadinha,estou montando o meu,na verdade estou engatinhando rsrs... por isso vou estar sempre contigo. parabéns Marcia pontosencantos.blogspot.com; 13 de janeiro de 2010 11:28
Robson disse...: O meu não dar certo de jeito nenhum, o que pode estar acontecendo?; 19 de janeiro de 2010 13:59
Fabiano Roberto disse...: Robson, na pagina editar html vai encontrar duas vezes width: 980px;

isso é a largura do seu blog; 19 de janeiro de 2010 15:07
Web Rike® disse...: Bom dia! Primeiro gostaria de agradecer pelas dicas do seu blog! Estão me ajudando e muuuuito você nem imagina! Estou começando meu blog recentemente, e hoje postei o primeiro video do youtube nele (Também lendo sua dica de como postar videos do youtube), porem, quando visualizei a postagem, o video está ocupando espaço em cima do menu esquerdo =/ Eu ja escolhi o menor tamanho possivel la no youtube na hora de gerar o código, e mesmo assim ele ficou grande demais... ja tentei alterar o tamanho manualmente, digitnado outro valor sem ser esse predefinido pelo youtbe, e mesmo assim não deu... pode me ajudar por favor? Meu blog é: http://www.blogsimsvicio.blogspot.com/; 23 de janeiro de 2010 09:55
Fabiano Roberto disse...: as larguras do video aparecem duas vezes no código

veja aqui
http://www.dicasparablogs.com.br/2008/05/ajustar-largura.html; 23 de janeiro de 2010 11:17
Henrique Gil disse...: ok... como faço para aumentar a vertical das caixinhas de resumo do meu blog?
o template, ao que parece, foi feito com base no Mínima White; 26 de janeiro de 2010 14:38
Fabiano Roberto disse...: Henrique Gil, depende do tipo de caixa de resumo que instalou no seu blog, precisaria ver isso no tutorial que usou para colocar essa função no seu blog

olhei seu html procure por
summary_noimg = 500;
summary_img = 350;
img_thumb_height = 150;
img_thumb_width = 150;

e altere os valores esses 150 são os tamanhos das miniaturas e 500 e 350 são a quantidade de caracteres mostrados; 26 de janeiro de 2010 17:50
Anônimo disse...: eu fis um site no webnode e escolhi um templante + queria alongar ele + ñ conciguo sera q vc poderia mim dizer onde eu alargo ele; 14 de fevereiro de 2010 04:47
Fabiano Roberto disse...: Anônimo, cada lugar usa as proprias tags, tem que entender um pouco de CSS para mexer nisto, não sei dizer exatamente onde é pois nunca usei esse site que falou.; 14 de fevereiro de 2010 18:22
Ricardo disse...: Nossa MUITOOOOO bom esse blog

Parabens msm

É muito bom saber que tem alguém disposto a ajudar o pessoal com os blogs sem cobrar nada.

adorei de verdade e obrigado

depois se quiser da uma olhada no meu blog
http://musicanuncapara.blogspot.com; 14 de fevereiro de 2010 20:52
Ricardo disse...: Ahhhh.... depois q comentei e coloquei o link do meu blog q vi q nao podia... desculpa... se quiser pode repostar meu comentario sem o link e com o meu nome.; 14 de fevereiro de 2010 20:55
Adriana * disse...: Fabiano eu sei que não tem nada a ver mais eu queria saber como eu posso ter um dominio personalizado grátis !!!
tipo www.fansrihanna.com.br
em vez de blogspot.
desde já obrigada pela ajuda.
admiro muito o seu blog.
me ajuda bastante.
valeu !!!; 15 de fevereiro de 2010 21:15
Dan disse...: Fabiano...! venho visitando seu blog, mas ainda continuo com algumas duvidas!
gostaria q observasse essa postagem:
http://idanou-se.blogspot.com/2010/02/loira-vs-google.html
infelismente a imagem q eu postei! ficou cortada!
não posso diminuir-la ou não dará pra ler!
o blog tem espaço pra imagem! mas ela fica cortada do mesmo jeito!
já tentei aumentar os espaço entre as colunas e mesmo assim não consegui solucionar o problema!
será q poderia me ajudar?; 16 de fevereiro de 2010 02:56
Fabiano Roberto disse...: Dan
não tem como ajudar a resolver isso, a imagem será reduzida mesmo.

acho que não vale a pena alterar a largura do blog por causa de uma postagem, isso você que decide, se quiser neste tutorial mostra como aumentar a largura do blog; 16 de fevereiro de 2010 14:47
Paulo Henrique disse...: Muito obrigado, vocês me ajudam demais! Sempre dou uma passada por aqui para ver as novidades...
Já utilizei várias dias no meu blog e pretendo usar muito mais!
Muito obrigado.

http://semgracas.blogspot.com/; 28 de fevereiro de 2010 02:09
denis disse...: Como posso dizer você salvou a minha vida!!!! Muito obrigado seu blog é 10; 21 de março de 2010 21:03
Maria Lúcia Marangon disse...: Como faço para deixar o meu blog: http://mlmarangon.blogspot.com/ da mesma largura deste que eu vi: http://nadyart.blogspot.com/
Tem jeito? Você pode me ajudar? Eu não entendo nada de html, ok?; 17 de abril de 2010 16:44
Fabiano Roberto disse...: Maria Lúcia Marangon, precisa alterar as larguras como mostramos nesta postagem; 17 de abril de 2010 19:04
Maria Lúcia Marangon disse...: Ok. Vou tentar.; 17 de abril de 2010 19:48
Xiquinho-GT disse...: Bem claro, Gostei; 17 de maio de 2010 05:43
Anônimo disse...: Olá Fabiano, boa tarde,

Estava navegando na internet e achei o seu site sem querer, mas que é legal pra caramba.
Tenho um bloguizinho que fiz apenas como curtição, porém gostaria de dar uma melhorada nele. Não tenho muita habilidade
Se possível gostaria que vc. me ajudasse. Estava tentando aumentar as mergens de ambos os lados, ´pois as colunas são bastante esteitas, gostaria de preencher mais a tela.
vc. poderia me ajudar.
Caso queira visitar o endereço é:
www.blogalvinegrosdavila.blogspot.com. aceito sugestões também.
Se quiser contato comigo peço que envie e-mail para: rogerio@rodrimar.com.br ou
rfoliveira.1971@hotmail.com ou pelo próprio blog.

agradeço antecipadamente pela atenção.

Rogério Oliveira; 29 de maio de 2010 16:29
Fabiano Roberto disse...: as larguras são nos trechos que falamos nesta postagem, se quiser ver sobre espaço entre as colunas aqui tem
Espaço entre as colunas do blog; 29 de maio de 2010 18:57
Tuma disse...: eu gostaria de saber como ajustar a largura entre as imagens desse meu blog:

http://esseblognaoeseu.blogspot.com/; 17 de agosto de 2010 15:18
Fabiano Roberto disse...: Tuma, qual largura, de quais imagens? não entendi sua pergunta; 17 de agosto de 2010 15:58
Tuma disse...: a largura ENTRE as imagens das sidebars, fica sempre um expaço bem grande entre elas e eu nunca consigo colocar uma do lado da outra por menor que seje a imagem.

http://esseblognaoeseu.blogspot.com/; 17 de agosto de 2010 17:19
Fabiano Roberto disse...: você precisaria diminuir a largura da coluna inteira, mas sinceramente acho melhor usar imagens maiores.

ou colocar no código do #sidebar text-align:center;

assim as imagens ficam centralizadas; 17 de agosto de 2010 17:51
Tuma disse...: Não, acho que já descobri o erro mas não sei como arrumar.

qualquer imagem com link que eu coloque no blog fica com o a área do link maior que a área da imagem (acho que é sepre 25px maior) dando um espaço maior entre elas.; 22 de agosto de 2010 18:04
Fabiano Roberto disse...: então deve ter alguma coisa usando padding ou margin no estilo da imagem.

procure img{.... } no html do seu blog e veja se tem padding ou margin nele se tiver apague.; 22 de agosto de 2010 18:16
Tuma disse...: CONSEGUI!
valeu Fabiano!
você e seu blog são demais!
valeu, valeu mesmo!; 22 de agosto de 2010 21:21
Anônimo disse...: Tentei aumentar a coluna do meu blog (modelo Josh Peterson.) e diz que não existe a linha #outer-wrapper
procurei também por #main-wrapper e diz que não existe.

Como posso alterar uma coisa se dentro do html não existe?

Dá uma luz ai Fabiano, por favor!

Chico; 22 de setembro de 2010 10:06
Anônimo disse...: onde eu encontros aqueles codigos e essas palavras >> left; e float; right;; 25 de fevereiro de 2011 21:15
Fabiano Roberto disse...: na pagina editar html do seu blog encontrará esses códigos; 26 de fevereiro de 2011 11:58
αиαнi яєiиα Bя disse...: putz kra vlw msm tu é d+++; 14 de abril de 2011 09:20
José Luiz disse...: Fabiano! Eu criei aquele menu de marcadores em menu suspenso que você deu uma dica. Mas quando fui tirar o número de postagens não consegui, oque eu faço?; 28 de abril de 2011 15:03
Fabiano Roberto disse...: veja aqui como retirar os numeros
Retirar Numero de Postagens dos Arquivos e Marcadores; 28 de abril de 2011 16:04
Cariina disse...: Nossa adorei as dicas...
Só tenho uma duvida: estou editando o meu template e pare isso eu precisava da largura das postagens, mas no meu template não tem #main nem #sidebar ...

Desde já agradeço, tem me ajudado muito =D; 10 de maio de 2011 15:19
Heavy Metal Download disse...: olá amigo gostaria de tirar uma dúvida, em meu blog la no editar HTML não tem #outer-wrapper {
nem as outras opções como faço para ajustar a largura do meu blog pois gostaria de colcoar duas colunas uma na direita e outra na esqerda e uma no meio, só que o espaço para as postagens ficam pequenos, teria como você me ajudar a ajusta a largura do meu blog? agradeço des de já; 13 de maio de 2011 16:41
Fabiano Roberto disse...: Heavy Metal Download
os novos modelos tem opção de adicionar colunas só trocando o modelo de layout

veja aqui: Designer de modelo - Layout e Configurações Avançadas; 13 de maio de 2011 19:50
Heavy Metal Download disse...: opa! rs bom... obrigado por me responder só que é o seguinte, meu blog gostaria de usar ele com 3 colunas duas laterais e uma central no meio só que se eu for lá em Designer do modelo e selecionar lá um que tenha exatamente as 3 colunas sou obrigado a diminuir completamente uma das duas larguras não posso deixar elas iguais se não o espaço para a postagem no meio fica pequeno axo que menor que essa linha azul que passa aqui no seu | | fica assim +/-; 14 de maio de 2011 00:22
Fabiano Roberto disse...: nas configurações tem como mudar o tamanho de cada coluna...

se estiver fazendo pelo html é só mudar o trecho float:.....

troque left por right ou vice e versa, dependendo de como queira organizar; 14 de maio de 2011 00:44
PROFESSOR MEIER F. C. disse...: eu tenho blogspot e hoje quando entrei as laterais ficaram maiores, as postagens ficaram mais apertadas na tela, e as publicações laterais ficaram maiores, você tem ideia do que pode ter acontecido?
aconteceu com todos meus blogs, mas um deles é esse http://profdefilosofia.blogspot.com/; 10 de junho de 2011 12:22
Fabiano Roberto disse...: todos seus blogs mudaram de largura? se não alterou os códigos na pagina editar html isso não tem explicação

não foi alguma configuração do navegador ou pc?

resolução de tela, zoom ou algo parecido...; 10 de junho de 2011 13:59
Rafa disse...: Olá Fabiano.

Gostaria de saber como centralizo gadeget dos comentários do facebook abaixo do meu blog.

rafaineurope.blogspot.com

Obrigado desde já,
Rafael; 15 de junho de 2011 11:38
Fabiano Roberto disse...: Rafa
se for a caixa de comentário inteira pode usar esse código:
<div style="width:400px;margin:auto; text-align:center">codigo aqui</div>

claro colocando o código dos comentarios no lugar indicado e alterando o valor 400 para a largura da caixa.; 15 de junho de 2011 15:20
Rafa disse...: Boa noite,

tenho o blog abaixo e gostaria de saber como diminuir os espaços entre o comentário do facebook (abaixo do post) e o post? e também entre o mapa eo gadget acima. obrigado

http://rafaineurope.blogspot.com/; 17 de junho de 2011 21:30
Fabiano Roberto disse...: o facebook trabalha com iframe... não tem como alterar os espaços dentro deles...

pode mexer no codigo height mas isso pode gerar barra de rolagem dentro da pagina ou ocultar alguns comentarios; 18 de junho de 2011 00:12
Jurassik Dark disse...: tenho um blog há anos e já mexi nele até ficar como eu queria. Agora resolvi fazer outro (simples)e quero aumentar a área do texto/post. Esse é o 4º blog que visito, mas é impossível encontrar esse 'outer wrapper' e 'main wrapper'.Já expandi modelos de widget e voltei ao original. Não acho de jeito algum. As coisas devem ter mudado, pois esse #main e #sidebar não existem no html do blogger.; 29 de julho de 2011 15:15
Fabiano Roberto disse...: você criou um novo blog... então ele deve usar os templates com a pagina design do modelo, veja aqui sobre as larguras:
Designer de modelo - Layout e Configurações Avançadas; 29 de julho de 2011 16:46
Natália disse...: Fabiano... como saber, qual a resolução de tela do meu pc?; 4 de setembro de 2011 03:51
Fabiano Roberto disse...: Natália
clique com o botão direito na area de trabalho do windows depois em propriedades e configurações, isso se usar o windows xp, no vista ou 7 é diferente, mas basicamente é nas configurações de tela ou video.

mas se quiser saber isso por causa do blog é melhor ver no google analytics qual a resolução da maioria dos seus visitantes e fazer o blog pensando neles e não na sua tela.; 4 de setembro de 2011 14:08
Natália disse...: Então me diga qual a largura do seu Blog, pois ele se encaixa certinho no meu monitor... Não seria uma boa solução eu ajustar o meu apartir do seu?; 4 de setembro de 2011 22:32
Fabiano Roberto disse...: o melhor é saber qual a resolução das pessoas que visitam sua pagina....

atualmente a maior parte de nossos visitantes tem monitor 1024x768 (ou mais) por isso usamos neste blog 990px de largura; 4 de setembro de 2011 23:37
Natália disse...: Ok...
Segui o que vc me disse e constatei que o meu monitor é de 1024x768 e o meu blog está com 1000.
Tenho que mexer na sua largura?; 5 de setembro de 2011 00:00
Fabiano Roberto disse...: não precisa mexer na largura... apenas se aparecer a barra de rolagem na parte inferior da tela; 5 de setembro de 2011 15:20
Val Araujo disse...: Fabiano quero parabenizálo pelo seu blog e sua paciência! Agradeço muito avocê porque foi no Dicas para blog que aprendi tudo que sei sobre blogs. Comecei a blogar em fevereiro desse ano, não sabia nada!!! Hoje já sei tanta coisa, e foi graças a seu blog(e a minha curiosidade) que aprendi a personalizar templates! Hoje tenho meu blog de templates personalizados e vou começar a ganhar dinheiro com isso. Sou muito grata a você por seus tutoriais super explicadinho e a vc que tem muita paciencia.
Parabéns! Sucesso sempre!

http://valaraujodesign.blogspot.com/
http://cantinhotudoaver.blogspot.com/; 13 de setembro de 2011 22:04
Anônimo disse...: como faz pra botar as postagens mais pro lado?; 14 de setembro de 2011 15:22
Fabiano Roberto disse...: anonimo, isso depende de qual é o seu template... você pode diminuir o valor de padding ou margin no seu template, mas os códigos variam muito conforme o modelo

ou pode até mesmo ser necessário alterar a largura do blog.; 14 de setembro de 2011 17:02
kako disse...: Fabiano, tem como aumentar ou diminuir só um gadget inves de todos ? Espero resposta. Obrigado; 20 de setembro de 2011 13:04
Fabiano Roberto disse...: kako

veja aqui Personalizar gadgets do Blog

mas o que está querendo fazer? por exemplo você pode diminuir a largura dele, mas não pode aumentar senão o espaço da coluna onde está o gadget será insuficiente...; 20 de setembro de 2011 16:29
William disse...: Tenho uma duvida !
È o seguinte estou querendo aumentar o espaço do meu blog sidebar post e tal, mas quando alguem tiver um monitor com resolução menor ??? O que faria para ficar dentro ???; 22 de setembro de 2011 23:18
Fabiano Roberto disse...: William
o melhor a fazer é ajustar a largura do blog em pixels (px) que é uma medida exata, assim ele aparece igual em todas as telas...

se o monitor de quem acessar o blog for menor aparece a barra de rolagem no final da pagina(horizontal) igual quando você não usa a janela maximizada.

sei que pode parecer pouco caso com as pessoas que usam uma resolução de tela menor, mas você tem que pensar no seu para a maioria dos visitantes; 23 de setembro de 2011 15:25
Ramon disse...: Fabiano;
Estou com dois problemas:
1° Não consigo 'balancear' o tamanho dos videos de forma que fiquem com o tamanho padrão(sempre ficam pequenos).
2°Quero trocar o 'retangulo' em branco por um banner.

Fiz o blog hj,e já aprendi mt coisa com vc,se possivel me ajuda ae :D.

http://panemental.blogspot.com; 3 de dezembro de 2011 16:20
Fabiano Roberto disse...: no proprio youtube tem o lugar para colocar o tamanho que deseja para exibir o video; 3 de dezembro de 2011 22:33
Ramon disse...: @Fabiano Roberto

Não Fabiano,eu falo tamanho pra colocar no blog,quando copio o endereço do youtube no compartilhar,nao tem opçao de tamanho pra colocar no blog.

As opçoes sao 'começar em' e 'link longo'.; 4 de dezembro de 2011 17:17
Fabiano Roberto disse...: clique em compartilhar e depois no botão incorporar, lá tem a opção de tamanho; 4 de dezembro de 2011 23:04
Blog da Educação Física disse...: Como faço pra mudar a largura da barra lateral? estou perdendo muito espaço com o fundo... gostaria de aumentar a barra lateral das propagandas.

Desde já agradeço.; 11 de dezembro de 2011 22:26
Fabiano Roberto disse...: se o seu template for dos novos modelos é só entrar na pagina layout do desiner e alterar a largura; 12 de dezembro de 2011 00:21
Blog da Educação Física disse...: o link do blog ai: http://edfisicaalagoas.blogspot.com/

Não tem a opção... pq n é modelo da blogspot; 14 de dezembro de 2011 13:15
Daniel Fiedler disse...: Oi Fabiabo...
Estou com um probleminha no meu blog que quando coloco uuma imagem no cabeçalho do meu blog ela fica cortada no meio me ajuda por favor...
vou deixar o link do blog de testes pra voce ver como fica a imagem quando eu coloco.
http://jogolanielandiatestes.blogspot.com/
obrigado pela atenção...; 17 de dezembro de 2011 11:26
Fabiano Roberto disse...: @Daniel Fiedler entrei no seu blog e a imagem apareceu completa; 17 de dezembro de 2011 12:37
Daniel Fiedler disse...: vlw é que eu mandei ontem de madrugada ai hj eu consegui mas vlw pela atençao...; 17 de dezembro de 2011 12:42
Wellington Oliveira disse...: cara to querendo aumentar meu cabeçalho nao consigo de jeito nenhum so falta isso pra eu add um banner de 1000px, quando coloco o de 1000px ele reduz automatico o que faço?

http://hotbikesemlimites.blogspot.com/; 30 de dezembro de 2011 19:23
Fabiano Roberto disse...: na hora de mandar a imagem para o cabeçalho do blogger tem a opção reduzir a imagem, então desmarque

mas claro vai depender da largura do seu template; 31 de dezembro de 2011 00:32
Alexandre disse...: Fabiano,
Mudei o template do meu blog recentemente e fui editando pelo html tudo.
Agora, na minha conclusão descobri que a sidebar esta MUITO pequena, fazendo com que a maioria dos gagets ficassem com problema.
Bom, fui ali e alterei a largura da sidebar e sabe o que aconteceu? nada. Ela não se move.

Pensei então que fosse por causa do tamanho do blog, mas quando procurei por #outer-wrapper (cntrl+f) NADA apareceu, sendo que o expandir modelos de widget estava selecionada.

Então não sei como resolver meu problema. Pode ajudar?
Obrigado. Alexandre; 16 de janeiro de 2012 14:31
Fabiano Roberto disse...: Alexandre
alguns templates são mais complicados de mexer.

em alguns casos se tiver erros é mais facil trocar o template.

veja se tem float: right; e float: left no seu html como mostramos na postagem; 16 de janeiro de 2012 15:09
DrikaBello disse...: Olá Fabiana tudo joinha??
Meu querido gostaria de sua ajuda,como eu posso deixar o nome do meu blog no meio do banner?
Consegui cetralizar pelo html mas ele ficou em cima do banner..
Poderia me ajudar??
Aqui está o link do meu blog:
http://drikabello.blogspot.com/

PS:Tentei achar algo relacionado aqui mas não achei..
Beziquinhos docess...; 18 de janeiro de 2012 14:07
Fabiano Roberto disse...: DrikaBello
no caso de imagem no lugar do titulo do blog é melhor entrar na pagina layout e clicar para editar o cabeçalho e escolha a opção para usar a imagem em vez do titulo.

mas claro você precisa fazer a imagem já com o nome do seu blog nela. só precisa de um programa para editar imagens; 18 de janeiro de 2012 15:21
DrikaBello disse...: Ai Fabiano me desculpe ter te chamado de Fabiana :(..
Nossa eu nem imaginava que era simples assim...rsrsr..Obrigada mais uma vez adoro seu blog aprendo muito aqui..
Já fiz dá uma olhada:
http://drikabello.blogspot.com/
Obrigadin mais uma vez pela atenção..
Beziquinhos docess..; 18 de janeiro de 2012 16:29
Angelo disse...: Como eu faço para editar o tamanho de uma borda ?; 12 de março de 2012 11:34
Fabiano Roberto disse...: veja aqui Colocar ou alterar as bordas; 12 de março de 2012 13:11
Lucas de Almeida disse...: Estou testando uns modelos de templates, mas em um que gostei muito fica sobrando um espaço em branco na lateral direita mesmo com o tamanho de 980px de largura. Como resolver?; 4 de abril de 2012 15:05
Fabiano Roberto disse...: deve ter algum outro código errado ou faltando algum detalhe que está gerando esse espaço do lado.

mas é bem dificil achar, tente ver o nosso tutorial sobre Achar e Resolver Problemas com Códigos HTML no Blog; 4 de abril de 2012 17:38
Blog Família Adventista disse...: Fabiano, veja o que acontece com o template: http://ljdealmeida01.blogspot.com.br/; 7 de abril de 2012 23:52
Fabiano Roberto disse...: você pode tentar usar o Designer de modelo - Layout e Configurações Avançadas; 8 de abril de 2012 01:10
Marina disse...: Olá, boa tarde.
Eu consegui fazer isso, porém as demais páginas não se alteram. Meu blog tem o resumo das postagens na página inicial e ao clicar em “leia mais” nada novo acontece, como se minhas alterações só funcionassem para a página principal.
Você sabe me dizer o que estou fazendo errado ou o que está faltando para que todas as páginas funcionem igual?

Obrigada!; 16 de abril de 2012 14:44
Fabiano Roberto disse...: mas o leia mais só aparece na pagina inicial ou pagina dos marcadores do blog é normal isso; 16 de abril de 2012 15:44
Marina disse...: Fabiano, meu problema não é com o leia mais, é com a largura do post. Só usei o "leia mais" como uma referência: na página inicial onde os posts estão resumidos, a largura que eu alterei fica certa. Mas quando a pessoa clica em "leia mais", que abre outra página, o post está com largura pequena, como se eu não tivesse alterado. Entendeu?

Mas obrigada mesmo assim...; 16 de abril de 2012 16:32
Fabiano Roberto disse...: isso deve ser algum outro erro no html

depende de como você colocou o código para mostrar o resumo.; 16 de abril de 2012 16:45

Melhores Dicas para Blogueiros

Largura do Blog

131 Comentários:

Postar um comentário