-->
Botones para cambiar el color del fondo del Blog

Botones para cambiar el color del fondo del Blog

Hay veces en las que el blog no es de gusto de todos, por el diseño o por los colores, para ello, se puede añadir la opción de cambiar fácilmente el color de fondo mediante un sencillo script.
Este script tiene la particularidad de permitir al lector cambiar el color de fondo del blog a su preferencia seleccionando el color y presionando en él.

Vista previa del script:








¿Cómo añadirlo a Blogger?

Primero, vamos a ''Diseño | Elementos de la página'', en donde añades un gadget ''HTML/Javascript'':


En él añade el siguiente código:
<td><span onclick="javascript:document.body.style.backgroundColor='#f6f4c1'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhw1niZbkCBk6ZgCKfPcwTkcAprYXjbNRnDen6TDbbN_Xiy4drWaqKZKDB1BPo4DySRJSVe0jhZJEibMBuY8VjHQlty2E1G9G00VpWquZCmwlUuh4RM7cvpyUpBuFHxULADeJ7pSM4p1XjJ/s320/blfondoamarillo.png" style="cursor: pointer ! important;" border="1" /></span></td>
<td><span onclick="javascript:document.body.style.backgroundColor='#c1c9f6'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjem06z-xPfwSAkJLL7Q1pBzuvnH7fHoPuh8V6NE4KLpHF1hX2Tq5O1VqHCzyEAGTmc9O04kMcF90WIQ7OL5ZpY5pTQLhR3mUaMwd56mnSzQ2ISPSJ1uxSv2XMnyTM9uOiz_AfVVSOjMSEW/s320/blfondoazul.png" style="cursor: pointer ! important;" border="1" /></span></td>
<td><span onclick="javascript:document.body.style.backgroundColor='#f6eac1'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgc3FHuBYCLqa6MvM1xkUMAChxUvw1FMNCiCJbd0FsAoElIZVPxwZkYUq3K9PR_raUvlozrGCjoKv1Tpgw0aP2cnzLas8zm8i9fCcX4M19ahOg-rdvLGuse4Kmxiyvu2PjpFpjp0kafWFOV/s320/blfondonaranja.png" style="cursor: pointer ! important;" border="1" /></span></td>
<td><span onclick="javascript:document.body.style.backgroundColor='#cccccc'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg6zPYezOG_OM06Z-DmAc4q69_ntzIFc8XUDy_azmNmP1TNxCG-VxTikeIlAmr3jON4h3mPzUiMD2oHV9H-acpgCVYr1fXCBgAaLR5qUt1cS0O1X46HCfFFLmEkS_HS6HvVa1fdEtN9PKNT/s320/blfondogris.png" style="cursor: pointer ! important;" border="1" /></span></td>
<td><span onclick="javascript:document.body.style.backgroundColor='#ffffff'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiUDBZbG_WVdm6l3jjcJiV6S6hmRQQV1xmr45hZl_1t_6pDDvyzUBwiVRWxQRFpYGu5_6W-AqdjJA0GxPITMwyCfPDKqIHZXyUh2Hkl3SjMQ6nqTqrVwQRXlhaZLnj56jf0ktVL2Yi-iRo5/s400/blfondoblanco.png" style="cursor: pointer ! important;" border="1" /></span></td>
<td><span onclick="javascript:document.body.style.backgroundColor='#e4dbb9'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEiCBmtWDprwYT3GoJOLxKwsK82Uhbx5r_KvQK8or_hafd_DCSVQjwFqs-GnjvO3vpDnLtS2fugSptnMwWkpXKPbYJ7QvbgqjTG70X8ga3dvve-xY_N9PL_zFIfFyZlB74qZGhjPCP0wj1pv/s320/blfondomarron.png" style="cursor: pointer ! important;" border="1" /></span></td>
<tr>
<td><span onclick="javascript:document.body.style.backgroundColor='#e6f9e6'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdMKOmeIefUvvidc9BWqGgAtFi2YDP8p7_eqQLJlmThFWJ_9r9RZjeieDZyQYcU1EWmsXjfuVZQRe-ONKbdaHDrEEAanwphBteREoS2AcALE-USG-RYGx8RrxmwZQo0dcUeqG98MyQ5_ZU/s320/blfondoverde.png" style="cursor: pointer ! important;" border="1" /></span></td>
<td><span onclick="javascript:document.body.style.backgroundColor='#f6c2c1'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEientc-TILzqI-AjPZFLEsAJA7i1PqCLefahcL9mP-Tst3QphGzR-CmNHMX7JYZiSsmDeN5M2fqEhx7fPWi3a-PFldudJhByVtEmY1E_WEavlmLVhdZYtRM7uh6lLmHR6FMvXiaWAd9uHTH/s320/blfondorojo.png" style="cursor: pointer ! important;" border="1" /></span></td>
<td><span onclick="javascript:document.body.style.backgroundColor='#f9e6e9'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhouRmg5N-DZDLtBDak9ACpPbsG3KFghUpzT3c8iKaCVaAsSrz7ltH-AUSWc-dAn4mV3di3EQayfN_HfX5QJOm3OWL2vODXVeL7SOix_bqLNWG3uPaNKpN_fPQ-FsqQeRchQ5fW3OWPWnC5/s320/blfondorosa.png" style="cursor: pointer ! important;" border="1" /></span></td>
<td><span onclick="javascript:document.body.style.backgroundColor='#d1b9e4'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgwcR2N-5K-B3tVI7kYyJEEUjUtWKzGCQ5Y3EuYyZ5tEnBYggpVux4WFTcN2XFaN2EJ7OoZQaqrxcDQstWaK_Tim6oYatSESz6-Je-i6dVlNAIgILvoGZa-cIL_WlI9ucK3Ba9PTkgfv2DV/s320/blfondomorado.png" style="cursor: pointer ! important;" border="1" /></span></td>
<td><span onclick="javascript:document.body.style.backgroundColor='#000000'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhV__MGJjqvIVolqLNt70spuLOYSC-iqp2wy157MGzVdHJ4jgPSL4SEf5I4QiZb9JDlYH-incGP8AMdQ9B-fLnbs88Gj-G11ay1fYm41TXPgKYXzQE0mSFB1eJt9Tj0bD8QaV656hrfxofU/s320/blfondonegro.png" style="cursor: pointer ! important;" border="1" /></span></td>
<td><span onclick="javascript:document.body.style.backgroundColor='#ECEEF3'; document.body.style.backgroundImage='none';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjevrzcYVOTOkiIyk1DHf4uqz831Z73mY6_a3sNG9vfH7bCqKwNchSxj6-VUZzTY3vx6k-BbMahfFeKugtbThCPRiVTZIYi9LePuQYi6UabyxYZe5nQF1hWCN9YJUwq5d6A_N_KadpyfcQW/s400/blfondoazul2.png" style="cursor: pointer ! important;" border="1" /></span></td></tr>
 Guardas los cambios y listo:
Artículo aleatorio
BuySellAds
BuySellAds
BuySellAds
BuySellAds
BuySellAds
Artículos destacados
Bordes con CSS # - Bordes con CSS
Nueva Herramienta SEO: Generador de MetaTags # - Nueva Herramienta SEO: Generador de MetaTags
Ventanas modales con Shadowbox # - Ventanas modales con Shadowbox
Orbit Slider: Galería de imágenes para Blogger # - Orbit Slider: Galería de imágenes para Blogger
Conociendo CSS3 - Animaciones # - Conociendo CSS3 - Animaciones