Fundo do seu blog a parte mais visível
Hospede as imagens
Antes de começar você deve ter as imagens de fundo que deseja colocar, você pode ver algumas imagens nesta postagem aqui do blog. Depois de escolher as imagens e salva-las no seu computador é necessário hospeda-las em um servidor se não souber onde hospedar veja o Guia das Hospedagens de imagens escolha a melhor opção e hospede.Instalando o script no blog
Depois já ter hospedado e já estar com as urls das imagens você deve inseri-las ao script, veja abaixo:1.Acesse o painel do Blogger "blogger.com"
2.Vá para "Layout"->"Elementos da página"->"Adicionar um Gadget"->"HTML/JavaScript"
3.Insira o código abaixo adaptando de acordo com a nota:
<script type="text/javascript">
var banner= new Array()
banner[0]="Image01URL"
banner[1]="Image02URL"
banner[2]="Image03URL"
banner[3]="Image04URL"
banner[4]="Image05URL"
banner[5]="Image06URL"
banner[6]="Image07URL"
banner[7]="Image08URL"
banner[8]="Image09URL"
banner[9]="Image10URL"
var random=Math.floor(10*Math.random());
document.write("<style>");
document.write("body {");
document.write(' background:url("' + banner[random] + '") repeat center center;');
document.write(" }");
document.write("</style>");
</script>Nota: A parte em azul deve ser substituída pela url da imagem que você hospedou, substitua cada parte por uma url diferente. Em vermelho você deve alterar de acordo com o número de banner que foi adicionado ao script.
4.Salve as alterações e visualize.
Referência:Tips for New Blogger
imagem:Baixaki
9 Comentários
Otima dica, vo usa-la em breve... Mas o q eu queria saber mesmo é como fazer um Header aleatório.. tipo, a cada vez que a pessoa acessa algum item do blog, ou aperta F5, o header muda aleatoriamente... Tem como fazer isso? Abraço.
Consegui fazer a imagem aleatória no Header do blog. Era tão obvio que não consegui acreditar ora que consegui. Se você quiser, lhe envio um tutorial para você colocar no maior blog de noticia e dicas, Noticia e blog. Obrigado de novo !
@Lucas Jordison , acho que sei sim é só modificar a palavra background por header ou header-wrapper . Mas obridado pelo comentário.
Salvou meu blog!!
Valeu!!!!
gostaria de saber como faço para colocar d forma que os usuarios possa escolher qual imagen quer de bakgroud
Opa amigo, parabéns pelo seu blog.
tipo eu to com probleminha, eu não tenho widget no header, dai eu hospedei o seu java e implementei no meu html, e em vêz de "background" coloquei "header-wrapper" como você falou, mais não acontece náda..
será que estou colocando no lugar errado do meu html?
tipo botei embaixo de : <*div class='header'>
ps- tentei colocar emcima de <*/head> também não funcionou!
me dá uma luz ai, só tenho vocês..
Comigo não funcionou. Provavelmente é porque não percebo nada disto. Mas não estou a conseguir pôr. Dá erro -.-'
ei amigo, fiz todos os procedimentos e deu certo, mas gostaria de saber qual o código que devo acrescentar, para que o background não repita na página, e role junto com a página ?
Cara, eu tirei o "repeat" e coloquei "no-repeat", mas no lugar que não tem a imagem ficou branco. Queria deixar preto nessa parte que não tem imagem. pode ma ajudar? obrigado
Postar um comentário
Deixe seu comentário aqui
Para exibir sua foto, escreva o seu comentário e clique em "Visualizar" e em seguida clique em "Adicionar Foto de Perfil"(Só é exibido quando o comentário é publicado como Conta do Google). Para editar seu perfil Clique aqui.