Plano de fundo aleatório para o Blogger

Tem blogueiro que vive trocando de template, não aguenta ver o blog com a mesma cara por muito tempo. Fazer a troca de template é um processo um pouco chato, toma tempo, alguns gadgets precisam ser salvos manualmente, etc. Ter um fundo aleatório no blog seria uma boa opção para quem quer ver o blog sempre de um jeito diferente.

O fundo aleatório funciona da seguinte forma: a cada atualização ou mudança de página o fundo é trocado automaticamente. Isso acontece após termos instalado um código indicando as imagens que devem aparecer no fundo e com o comando aleatório. Confira a seguir um passo-a-passo ensinando como instalar esse código.

Vá na aba Design > Editar HTML e encontre o seletor body. Adicione um fundo  para ser o fundo padrão, pode ser uma imagem ou uma cor. Exemplos:

Cor	Imagem
body { background: #000000; }	body { background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfsHjxaI3AQ6DTb6CoTy1zRPFx0fSbG1KW8n9tEGe7OGOMcgeCPgar4y6BuMB3QV1Q8a3Cu9LzRMWy2e2iQAi70gYTxXYw3VQu4gLbdb01gSbCUw8silm6tcdUp9v5orFnjRxC1H45_T0/s1600/glitter_backg round_02.gif); }

Para a imagem ir se repetindo por todo o fundo do blog adicione o comando repeat. Para a imagem não se repetir, ou seja, aparecer uma vez só, adicione o comando no-repeat acompanhado da posição. Exemplos:

Se repetir

body {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfsHjxaI3AQ6DTb6CoTy1zRPFx0fSbG1KW8n9tEGe7OGOMcgeCPgar4y6BuMB3QV1Q8a3Cu9LzRMWy2e2iQAi70gYTxXYw3VQu4gLbdb01gSbCUw8silm6tcdUp9v5orFnjRxC1H45_T0/s1600/glitter_background_02.gif) repeat;
} 

Não repetir

 body {
background: url(https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjfsHjxaI3AQ6DTb6CoTy1zRPFx0fSbG1KW8n9tEGe7OGOMcgeCPgar4y6BuMB3QV1Q8a3Cu9LzRMWy2e2iQAi70gYTxXYw3VQu4gLbdb01gSbCUw8silm6tcdUp9v5orFnjRxC1H45_T0/s1600/glitter_background_02.gif) no-repeat top center;
}

Você também pode querer que a imagem se repita apenas na horizontal, para isso use o comando repeat-x. Porém se desejar que a imagem se repita na vertical use repeat-y.

Salve o modelo e vá na aba Design > Elementos da página. Clique em Adicionar um gadget e escolha o elemento HTML/JavaScript. Não coloque nenhum título. Em Conteúdo cole o seguinte código:

<script type="text/javascript">
var banner= new Array()
banner[0]="AQUI O ENDEREÇO DE SUA IMAGEM"
banner[1]="AQUI O ENDEREÇO DE SUA IMAGEM"
banner[2]="AQUI O ENDEREÇO DE SUA IMAGEM"
banner[3]="AQUI O ENDEREÇO DE SUA IMAGEM"
banner[4]="AQUI O ENDEREÇO DE SUA IMAGEM"
banner[5]="AQUI O ENDEREÇO DE SUA IMAGEM"
banner[6]="AQUI O ENDEREÇO DE SUA IMAGEM"
banner[7]="AQUI O ENDEREÇO DE SUA IMAGEM"
banner[8]="AQUI O ENDEREÇO DE SUA IMAGEM"
banner[9]="AQUI O ENDEREÇO DE SUA IMAGEM"
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>

Você pode inserir até 10 fundos diferentes para serem trocados de forma aleatória. Insira os endereços das imagens em seus devidos lugares. A parte destacada de vermelho é a posição que as imagens ficarão no fundo, elas irão se repetir centralizado tanto na vertical, quanto na horizontal.

Salve o gadget e visualize seu blog. Carregue a página várias vezes para ver o efeito.

Via fulaninhaentretenimentos