Se você é daqueles que gosta de personalizar o seu blog, deixando do seu gosto, com uma cara mais elegante e até mais atraente ao olhar dos seus visitantes. Aqui vai uma dica que você poderá gostar muito. Em vez de você personalizar os lados, topo e cores em geral do seu blog, porque não personalizar o fundo das postagens de seu blog, com uma imagem relacionada ao post, e assim deixando o post muito mais interessante. Hoje você vai aprender passo a passo como fazer isso.
Primeiramente vá ao editor do blogger, em seguida selecione a aba “Editar HTML”. Insira o pequeno código HTML abaixo no editor.
<div id=”fundo”>
Em seguida escreva o que você deseja escrever depois do código acima.
Depois de escrever, basta fechar a tag. Para isso, basta adicionar a tag de fechamento
logo após o que você escreveu.
Exemplo:
<div id=”fundo”>
Como colocar uma imagem de fundo nas postagens do blog.
</div>
Agora vamos ao CSS, que aonde vamos colocar o link da imagem.
Coloque o código abaixo logo acima do código HTML
<style>
</style>
Depois coloque o css abaixo entre <style> e </style>:
#fundo{
background:url(coloque o link da imagem );
padding:5px;
}
Só é você colocar o link da imagem onde está pedindo no CSS, e pronto, a imagem já foi adicionada como plano de fundo do post.
Se você quiser que o post fique com uma aparência mais agradável ainda, basta arredondar as bordas da imagem, para isso, só é você colocar no código CSS os códigos abaixo:
-moz-border-radius: 12px;
border-radius: 12px;
-webkit-border-radius: 12px;
Veja outras formas de bordas aqui.
Exemplo para o CSS:
<style>
#fundo{
background:url(http://wallpapers-diq.net/wallpapers/42/Lush_Summer%2C_Louisville%2C_Kentucky.jpg );
padding:5px;
-moz-border-radius: 12px;
border-radius: 12px;
-webkit-border-radius: 12px;
}
</style>
Você pode adicionar um plano de fundo em quantas postagens você quiser.
Bom pessoal é isso ai, espero que tenha gostado. Qualquer duvida deixe um comentário que estarei respondendo a sua duvida o mais rápido possível.
Gostou?quer saber o que vem depois?então se escreva no feed desse blog ou receba atualizações por e-mail, é gratís






















16 comentários:
Muito bom valew
Cara muito bom, mas em que parte do código eu coloco "div id="fundo"" e os demais códigos. Tipo antes de "body" antes de "head"....????
<div id="fundo"> você coloca dentro do editor, onde você escreve o post, em modo html e o css você pode colocar diretamente no html do template do seu blog, antes da tag </styte>.
Valeu parceria, agora tá tudo funcionando!
Vlw aí pelo Tuto... Muito Bom e Simples.
Me ajudou muito, há tempos procurava por isso.
Vlw mesmo! Abraço!
não funcionou nada!!!
onde coloca os codigos css???
em qualquer lugar???
não deu não
Não consegui por esse passo a passo
ola amigo gostei de seus postes ,continue assim,vou colocar seu blog como preferidos,olha gostaria de uma ajudinha sua ,como colocar submenus nas minhas paginas igual vc colocou ?e outra coisa antes eu tinha no meu pc todos os adobs cs5 mas depois que formatei eu nao consigo mais fazer downlodas dos mesmos pq?obrigado http://googlerei.blogspot.com/
amigo Você tem que ensinar ser mais detalhado tipo o código "tal" Você coloca em "tal lugar" o outro código em outro "tal" lugar e assim sucessivamente porque ninguém vai saber usar a sua dica o template/layout é grande e cheio de códigos como vamos adivinhar onde por! bjsss espero correção...
seu blog è ate bom o problema è que vc nao responde a gente ,nao tira as duvidas da gente,mas gostei do seu blog legal
Não Funcionou no meu blog
?????????????????
que merda nao deu nada certo (nao sei onde colocar as porcarias dos codigos) sua prestatividade é zero meu amigo. assim vc nao vai pra frente.
não dá pra colocar imagem no fundo do TÍTULO DA POSTAGEM??????????
GALERA QUANDO ELE FOI DIGITAR O CÓDIGO ELE TROCOU ' POR ".
NESSA PARTE: (div id=”fundo”)
O CORRETO É: (div id='fundo')
OBS: SUBSTITUAM () POR <>
será que tem como você disponibilizar uma base do tamanhã da imagem que tem que usar como fundo
Postar um comentário
Sua opinião é muito importante,deixe-aqui...