"Alterar a cor do fundo ("background") do blog ...sendo à escolha do leitor de seu blog "...?...como?

"Alterar a cor do fundo ("background") do blog

...sendo à escolha do leitor de seu blog "

 

 

    .

...a escolha também , pode dar-lhe a opção de alterar a cor de fundo para o o fundo de seu blog.

...isso faz com que   o blog mais interativo e que o leitor não só de ler o conteúdo, mas você pode brincar com o visual do blog.

A maneira de fazer isso é através de uma função JavaScript que fará um clique a cor de fundo do blog (corpo) mudanças, e funciona mesmo se você tiver uma imagem de fundo.

Você pode vê-lo trabalhando, clicando em qualquer uma das cores.
 


Para colocar esta opção em seu blog entra em design> Elementos da página> Adicionar um Gadget> HTML / Javascript e cole o seguinte:

   

<div style="text-align:center;">¿No te gusta el color de fondo?
¡Cámbialo por otro!</div><br /><center>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#ff0000'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiPVyyK7t2tAIVI22lHLLjt7Pjags88_VYSd8qSKi9hSUmrUMJZ-S0OztPZIotgk0hvSlUhyphenhyphenf2tc88kcugn4pNXC6QcYjviv5rzRXtPYrUu0X3ep7hgRbCM7depxGuntIN2ZhVTkkFXVS_0/s200/body-rojo.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#fff000'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhuWG4s2vvXd6TtoddbxFJ9X9pXwdZV4rm7O9ZqbxJUHL4wEoF04GPS4i0EYovENkeyRo4ZEzgtXVnTEyqDiZFGgoqedMewubBfTEynX4oBLu_x9DP48771FX0QRtK56jeTJ70dZr7fTpfi/s200/body-amarillo.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#04B404'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi27jndNdF57CL05lsDyUPL7GMX4dfLFTznhd-yZOdxqEWXckh4LMaGHue4vtTyL0-HGlqArhNnckTQhdmYMpMMMPmAtuIgfiqLwKoLEPtI5x0itq1HZdpp58jKCr5G_M3pPYAhXA3AXpn3/s200/body-verde.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#0080FF'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg9AItIp38zR9REerzaFVl06d8_KZWaq5q8g7mhSncgZvUHGIP_vlFAvinH8Hawr7_hQx8AJd6bigL_IhMW6Ae20i5mSzrd061DZoE3Z42ITvxWbRwV6Rwv5nO1N805n-LQBptkwO03lg8h/s200/body-azul.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#CC00FF'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgK84_MGWQsYdpRwNGj42TNGZPNHuEYFW6PsrmmemSQSiDbp4m8MdByX0OF-mz52nETUxEAGkNaRv72q-m6q1UbxhbotsDoJ3QTFhVLspq4QSGm8tg_pzjlTOT4bHh99x8P_RT6uzuxebGi/s200/body-morado.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#F781BE'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEi6HIsLBgXiWdWv39IMy3H1FtMp2-2xGJOlM1CkEOSmLbETRrxMnTX1uZL4qiK4r3ircPvAdvmUtszfxVjtnf8dRUJI97-EAVu30hnK-EDjGjeU18hQa1l0pnX8abcEDfoqkAD8Lh4EzuWD/s200/body-rosa.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#000000'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjeSm9RpTs6LlRdzy9jHGDYQp381apjmrdrAC7SB40P5F0D-NpiipgWpIG46w8lgnToY66IISMg2rwWL-OY2r-Fxuqy2nrmG2NbzwGly-ZmnSIoqLqPzE1Z1wth8B7Q_8sb4YZM-y8fhzhc/s200/body-negro.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#FFFFFF'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg45Z5dtigbcfGeF7w3w9UH6fOre4qL1itK7__N_yd0OKFXOfIhE9bMtcuC2gWNOsDzaI-cmK7AjsVNkaZWZyc-sgQUu-Q42dO8tUkicYSeVqQv0enIaf9Ck1ddlITpfnSR44K99nZamL8N/s200/body-blanco.png" /></a>
</center>

Se você não gostar das imagens a cores também pode colocá-lo como texto simples:Vermelho | Amarelo | Verde | Azul | Roxo | Rosa | Preto | Branco


Nesse caso, o código para colar é a seguinte:

   <div style="text-align:center;">¿No te gusta el color de fondo?
¡Cámbialo por otro!</div><br /><center>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#ff0000'; document.body.style.backgroundImage='none';">Rojo</a> |
<a href="#" onclick="javascript:document.body.style.backgroundColor='#fff000'; document.body.style.backgroundImage='none';">Amarillo</a> |
<a href="#" onclick="javascript:document.body.style.backgroundColor='#04B404'; document.body.style.backgroundImage='none';">Verde</a> |
<a href="#" onclick="javascript:document.body.style.backgroundColor='#0080FF'; document.body.style.backgroundImage='none';">Azul</a> |
<a href="#" onclick="javascript:document.body.style.backgroundColor='#CC00FF'; document.body.style.backgroundImage='none';">Morado</a> |
<a href="#" onclick="javascript:document.body.style.backgroundColor='#F781BE'; document.body.style.backgroundImage='none';">Rosa</a> |
<a href="#" onclick="javascript:document.body.style.backgroundColor='#000000'; document.body.style.backgroundImage='none';">Negro</a> |
<a href="#" onclick="javascript:document.body.style.backgroundColor='#FFFFFF'; document.body.style.backgroundImage='none';">Blanco</a>
</center>

para cada cor que deseja adicionar:

...você pode alterar as cores de que você gosta, ou adicionar mais cores, basta adicionar outra linha como esta :

 <a href="#" onclick="javascript:document.body.style.backgroundColor='#ff0000'; document.body.style.backgroundImage='none';">Color</a>

Basta alterar o que está em vermelho pelo código da cor que quiser e colocar o nome da cor onde indicado.(color)

O mesmo pode ser feito para mudar as cores do acima, basta localizar o código de cores, alterá-lo e ir embora.

fonte e créditos:
ciudadblogger