Blogger - Como mudar o plano de fundo do blog

Muitas pessoas usam os templates disponibilizados pelas plataformas de blog e é muito simples trocar as imagens com recursos natos da mesma. Mas substituir imagens de plano de fundo em templates de terceiros já é mais complicado; pois a própria plataforma não aceita estes templates.

Neste artigo ensinaremos como trocar, editar e ajustar seu plano de fundo, caso não tenha gostado do atual. Essa dica é muito boa para se colocar imagens mais a ver com o tema abordado em seu blog e também torna possível aquela personalização pessoal ou para sua empresa.

Depois de experimentar a dica pessoalmente neste mesmo blog, onde atualizei o template para responsivo; decidi compartilhar estas informações com meus leitores que sempre estão ligados no Processo Blogs e acompanhando nosso conteúdo sempre que possível.

Mudando o plano de fundo no Blogger

Essa dica não é fácil, mas se seguir as dicas corretamente, tudo sairá perfeitamente e terá seu blog personalizado como deseja. Existem várias possibilidades de edição e estarei passando uma a uma para você.

Antes de qualquer movimento de risco, salve sempre um backup de seu template para caso aconteça alguma coisa errada, possa restaurar pelo backup.

Basicamente você editará somente um código em todo o template para obter resultados diferentes. Para isso é preciso que entre em sua conta no Blogger > Coloque no modo de edição HTML do blog (Não das postagens) e dentro do código do template, segure CTRL + F para acionar a ferramenta de busca.

Digite: body {background:#000000;}

A tag aparecerá marcada no template. Agora basta seguir as seguintes dicas para cada alteração.

1. Mudança de Cor

Para mudar a cor de seu template, basta apenas mudar o seguinte trecho do código: #000000. Esse código hexadecimal define a cor do plano de fundo de seu plano de fundo; no caso de estar usando apenas cor no mesmo. Para ver todas as cores que pode usar nesse caso, clique aqui.

Basta apenas copiar o código desejado e colar substituindo o que esta sendo usado no momento. Depois salve e já poderá visualizar a outra cor.

2. Imagem de Fundo

Se seu template não possui imagem de plano de fundo, basta apenas adicionar o seguinte código ao mostrado anteriormente lá em cima:

background:#000000 url (url da imagem) repeat;



No caso acima, apenas adicione a código em vermelho e onde está "url da imagem"; coloque a URL da imagem que deseja usar de plano de fundo. Você pode copiar diretamente de imagens da web, como também pode salvar em seu computar; armazenar a mesma no próprio Blogger por segurança no editor de publicações e copiar a URL. Entenda porque é melhor armazenar as imagens na plataforma:

• Como evitar erros e defeitos no template

Uma dica importante é saber qual o tamanho ideal de uma imagem para o plano de fundo de seu blog. Não existe um tamanho específico, mas para se preencher todo o fundo do blog, o tamanho 1024 x 850 é excelente. Mas passaremos alguns códigos para se criar mais opções com sua imagem de fundo.

Outra dica é não exagerar na resolução de sua imagem, pois isso afetará o carregamento do mesmo. 

3. Controlar Imagem

Existem alguns códigos que podem ser ainda adicionados a este para se controlar a imagem usada no plano de fundo. Mas nesse caso, terá que substituir apenas a última parte do código em vermelho por qualquer dos códigos da lista.

background:#000000 url (url da imagem) repeat;

repeat; – Se você quiser que a imagem se repita

repeat-y; – A imagem repete na vertical

repeat-x; – A imagem repete na horizontal

no-repeat; – Se você não quer que a imagem se repita

top; – Imagem somente no topo

bottom; – Imagem somente abaixo

right; – Imagem a direita

left; – Imagem a esquerda

No caso de não repetir a imagem, é necessário ainda alguns códigos para se controlar o posicionamento da imagem no blog. São eles:

background: #000 url(url da imagem) no-repeat top left; - neste exemplo a imagem não se repete e se apresenta no topo à esquerda.

Para que a imagem fique fixa na tela:

background-attachment: fixed;

Para que a imagem role com a tela:

background-attachment: scroll;

Mas e se a imagem for menor? Nesse caso sempre sobra espaço no plano de fundo e para isso use o seguinte código para mostrar simultaneamente a imagem e cor onde ela não cobrir:

background: #000000 url(http://url-da-imagem/) no-repeat bottom left; - Fundo preto e imagem não repete e se apresenta somente abaixo e à esquerda. 

Se você ou qualquer outro leitor usar Internet Explorer para acessar seu blog, pode acontecer que a imagem nem apareça na tela; mas é porque o Explorer tem dificuldade de interpretar certos códigos e para isso basta aplicar a seguinte correção:

background:++#000000++url(http://endereço-da-imagem)++no-repeat++bottom++left;

Notou? Insira os sinais "++" nos locais mostrados e o problema estará resolvido. Depois de todas as alterações desejadas feitas, basta apenas salvar e ver como ficou seu blog. 

Estas dicas foram baseadas em um artigo do Mundo Blogger. Gostou? Comente, compartilhe e complemente este artigo com mais informações sobre como alterar, editar e lidar com o plano de fundo no Blogger. 

Ricardo F.S é administrador da empresa Ricardo Arts em Valparaíso e dos blogs Blog Ricardo Arts,Dinheiro sem Limite e Processo Blogs na internet. Possui curso completo de informática e internet e possui anos de conhecimento com blogs. Atualmente trabalha como letrista, desenhista e pintor; prestando serviços também na web com design. Para saber mais clique aqui.