cambiar el color del blog ò pagina web con un click

cambiar el color del blog con javascript con un click

bueno he mirado en otro blog como cambia el color del blog con un script pero ese script lo tiene muy largo o con fallas yo lo edite borrandole algunos codigos inecesarios

bueno para ver como funciona miren











solo den click en cualquier color y cambia el blog de color.

para instalarlo en su blog hacen lo siguiente:

para instalarlo en un gadget
vamos a

Diseño > Elementos de la página > Añadir gadget > HTML/Javascript, y ahí pega esto:

<center>

<a href="#" onclick="javascript:document.body.style.backgroundColor='#ff0000';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhn23l6g-HxfHcJMjBkjonLWNdmgI5TKd-jF1GX6v1vdqjh8THf8ABaQP573dGBtIcuhqTB4n2_Pihrpys3wsi8KX3WcI4O9a-bgc0imhv9efFiZdEyQnhsl3nqj_U0uQOW-jOD65JpCyox/s200/body-rojo.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#fff000';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijn5_m_L7KbWP4eqOpm_ziIuod2uo2fEpL_VItzHwj7B7V-_9w8KiR4xs3vo3neXnTiNaXiPXGtkpLnIX-oooUx6DXeKxeK_tTiqrFcvrOLaFMwJ11t8GPELzK9GH-5yW0i2-CyDkWRfBx/s200/body-amarillo.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#04B404';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGBID79y-mSuEylnxP8idNqv1RuRb0NQY43BuafVHgtAGr3Csa5aNag_lWZjZ-ft8mFNKFX71R3mXtfEO9uSKqol9Qw1qc6vADdFleZBKYQaeLgj0jKTXJNcIgULDMOUfLE2KHkvML6ZF0/s200/body-verde.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#0080FF';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAmB-AsNRHzDUHJAluslLWHdzJBLPMQZS_TS9qj_MAzg9xGyT1wI3UJS2pwPp2aXyTRlTqk3uMqFnJl_YvKxcK5JklXnaUNzlMz2kiiow8P3j-aDeDT2MrFrKBPPzh9QNjjp2TJT5P5th1/s200/body-azul.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#CC00FF';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMz9XSD0gFi8WxeIDbs9wLq-KZIAbzoTKige9w6-hlpMX3WaV5EwoPUlLW0UCTwglEZ1R3IDJM_aTJEaUe93jSnubnDTVF_LZBX2mb7GrJZjtD4sur8DHpkADY2Z4ga07kRJH-jFnHY5C_/s200/body-morado.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#F781BE';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg98tDqw_ISyqrgpr0jMKxYtt8FKVTytUOqhKka53sqtVcht6yS3JfSqMAEO1F4wnNAulUsbcv-U_OW4P7XS4CNFPIey8LWqzka9HPVXqfWdYk6mj6l39gcJYQh5_DxqKekcHGYB95e4stE/s200/body-rosa.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#000000';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdpdCBi-IqVsAxzaM17EA5JWkmT5ldSgbQMT_Qcm4nsEVFZhtLt6sOO0K-lQcXxqNFkPVGrgrlTYcI3RRHwa-_Kl-DVPDpchlyIBIa8K5H6QV3vFvPM_mv0OyC3p0XOhyphenhyphenYXdhZR36B2Qic/s200/body-negro.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#FFFFFF';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7bxX4UARUfqN8TV6caLKMqUCXswOLoXVWtrgLjkNoacg5n9hKWxLnLD72QIV93_Dg1_HBxIZXfMZyr5kvC2pqSQDpAfomDq3w5k2Y1ns1HCnIL2k5gjhw-Wmz_yLj6dHVBpPusAL6kus5/s200/body-blanco.png" /></a>
</center>

y listo guardan y miran como quedo.

ahora si quieren este codigo en las entradas de los post , que aparesca la opcion de cambiar el color del blog en las entradas de los post con este javascript debemos hacer lo siguiente:

vamos diseño --> edicion html--> y buscamos la siguiente etiqueta:

<data:post.body/>

justo despues de esta etiqueta agregan este codigo:

<center>

<a href="#" onclick="javascript:document.body.style.backgroundColor='#ff0000';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhn23l6g-HxfHcJMjBkjonLWNdmgI5TKd-jF1GX6v1vdqjh8THf8ABaQP573dGBtIcuhqTB4n2_Pihrpys3wsi8KX3WcI4O9a-bgc0imhv9efFiZdEyQnhsl3nqj_U0uQOW-jOD65JpCyox/s200/body-rojo.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#fff000';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEijn5_m_L7KbWP4eqOpm_ziIuod2uo2fEpL_VItzHwj7B7V-_9w8KiR4xs3vo3neXnTiNaXiPXGtkpLnIX-oooUx6DXeKxeK_tTiqrFcvrOLaFMwJ11t8GPELzK9GH-5yW0i2-CyDkWRfBx/s200/body-amarillo.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#04B404';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhGBID79y-mSuEylnxP8idNqv1RuRb0NQY43BuafVHgtAGr3Csa5aNag_lWZjZ-ft8mFNKFX71R3mXtfEO9uSKqol9Qw1qc6vADdFleZBKYQaeLgj0jKTXJNcIgULDMOUfLE2KHkvML6ZF0/s200/body-verde.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#0080FF';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEhAmB-AsNRHzDUHJAluslLWHdzJBLPMQZS_TS9qj_MAzg9xGyT1wI3UJS2pwPp2aXyTRlTqk3uMqFnJl_YvKxcK5JklXnaUNzlMz2kiiow8P3j-aDeDT2MrFrKBPPzh9QNjjp2TJT5P5th1/s200/body-azul.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#CC00FF';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEgMz9XSD0gFi8WxeIDbs9wLq-KZIAbzoTKige9w6-hlpMX3WaV5EwoPUlLW0UCTwglEZ1R3IDJM_aTJEaUe93jSnubnDTVF_LZBX2mb7GrJZjtD4sur8DHpkADY2Z4ga07kRJH-jFnHY5C_/s200/body-morado.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#F781BE';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg98tDqw_ISyqrgpr0jMKxYtt8FKVTytUOqhKka53sqtVcht6yS3JfSqMAEO1F4wnNAulUsbcv-U_OW4P7XS4CNFPIey8LWqzka9HPVXqfWdYk6mj6l39gcJYQh5_DxqKekcHGYB95e4stE/s200/body-rosa.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#000000';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEjdpdCBi-IqVsAxzaM17EA5JWkmT5ldSgbQMT_Qcm4nsEVFZhtLt6sOO0K-lQcXxqNFkPVGrgrlTYcI3RRHwa-_Kl-DVPDpchlyIBIa8K5H6QV3vFvPM_mv0OyC3p0XOhyphenhyphenYXdhZR36B2Qic/s200/body-negro.png" /></a>
<a href="#" onclick="javascript:document.body.style.backgroundColor='#FFFFFF';"><img src="https://blogger.googleusercontent.com/img/b/R29vZ2xl/AVvXsEg7bxX4UARUfqN8TV6caLKMqUCXswOLoXVWtrgLjkNoacg5n9hKWxLnLD72QIV93_Dg1_HBxIZXfMZyr5kvC2pqSQDpAfomDq3w5k2Y1ns1HCnIL2k5gjhw-Wmz_yLj6dHVBpPusAL6kus5/s200/body-blanco.png" /></a>
</center>

y listo eso es todo