Mudar a cor de fundo com um clique

Um efeito interessante é permitir que o visitante do blog escolha a cor de fundo da pagina apenas clicando na cor que mais gosta, dependendo do publico do seu blog essa é uma boa maneira para despertar a curiosidade das pessoas sobre o blog e o melhor de tudo o código para fazer isso é muito simples e fácil de usar.

Entre na pagina layout, adicionar gadget, html/javascript e coloque esse código:

<a href="#" onclick="document.bgColor='#0000ff'">Azul</a><br />
<a href="#" onclick="document.bgColor='#FFFF00'">Amarelo</a><br />
<a href="#" onclick="document.bgColor='#000000'">Preto</a><br />


Veja que as três linhas são basicamente iguais, portanto para usar outras cores ou dar mais opções só precisa alterar o texto com o nome da cor e o código da cor de fundo, no caso da primeira linha #0000ff e azul, cuidado para não apagar as aspas nem outros sinais do código senão ele não funcionará.

Outra coisa que você precisa alterar é na pagina editar html, procure por: body{....} se dentro das chaves do body tiver algo definindo a cor de fundo você precisará apagar senão o código para mudar a cor de fundo não funcionará, veja se tem background-color ou background-image: url(......) e se encontrar apague.

Infelizmente para usar esse efeito no seu blog ele sempre aparecerá com o fundo branco, pois se definir outra cor de fundo não conseguirá fazer o código que indicamos funcionar e alterar a cor da pagina.

Você também poderá fazer isso com imagens usando o código abaixo:

<a href="#" onclick="document.body.background='imagem 1'"><img src="imagem 1" border="0" /></a><br />

<a href="#" onclick="document.body.background='imagem 2'"><img src="imagem 2" border="0" /></a><br />

<a href="#" onclick="document.body.background='imagem 3'"><img src="imagem 3" border="0" /></a><br />

Se preferir salve uma miniatura da imagem para usar como link para troca de imagem de fundo, isso é util dependendo do tamanho da imagem de fundo original que for utilizar no seu blog.