quinta-feira, 7 de outubro de 2010

Widget Cores do Blog



Esse é um Widget muito interessante, o leitor aperta em uma cor, e a cor de fundo do seu blog troca de acordo com a que o visitante escolheu.

No painel do Blogger va em Design --> Elementos de Pagina --> Adicione um Gadget HTML/Javascript e cole um dos códigos abaixo:

Estilo 1:


<center>
Troque a cor do blog
<a href="#"
onclick="javascript:document.body.style.backgroundColor='#ff0000';
document.body.style.backgroundImage='none';"><img
src="http://4.bp.blogspot.com/_dsEG33PDaHw/S32TTX4H60I/AAAAAAAAAJU/qYc4BYZclgg/s200/body-rojo.png"
/></a>
<a href="#"
onclick="javascript:document.body.style.backgroundColor='#fff000';
document.body.style.backgroundImage='none';"><img
src="http://2.bp.blogspot.com/_dsEG33PDaHw/S32TK7730eI/AAAAAAAAAIs/3v5O2GDrs1s/s200/body-amarillo.png"
/></a>
<a href="#"
onclick="javascript:document.body.style.backgroundColor='#04B404';
document.body.style.backgroundImage='none';"><img
src="http://2.bp.blogspot.com/_dsEG33PDaHw/S32TTyfDggI/AAAAAAAAAJk/9x17-Ec7Dnw/s200/body-verde.png"
/></a>
<a href="#"
onclick="javascript:document.body.style.backgroundColor='#0080FF';
document.body.style.backgroundImage='none';"><img
src="http://4.bp.blogspot.com/_dsEG33PDaHw/S32TLXeztWI/AAAAAAAAAI0/7hWfrfWsdKU/s200/body-azul.png"
/></a>
<a href="#"
onclick="javascript:document.body.style.backgroundColor='#CC00FF';
document.body.style.backgroundImage='none';"><img
src="http://2.bp.blogspot.com/_dsEG33PDaHw/S32TMB5SOXI/AAAAAAAAAJE/PRMfKVBj6fM/s200/body-morado.png"
/></a>
<a href="#"
onclick="javascript:document.body.style.backgroundColor='#F781BE';
document.body.style.backgroundImage='none';"><img
src="http://1.bp.blogspot.com/_dsEG33PDaHw/S32TTl7vW9I/AAAAAAAAAJc/GHdXgYyF4Ro/s200/body-rosa.png"
/></a>
<a href="#"
onclick="javascript:document.body.style.backgroundColor='#000000';
document.body.style.backgroundImage='none';"><img
src="http://2.bp.blogspot.com/_dsEG33PDaHw/S32TMY3FA9I/AAAAAAAAAJM/6Hx0CAagVOQ/s200/body-negro.png"
/></a>
<a href="#"
onclick="javascript:document.body.style.backgroundColor='#FFFFFF';
document.body.style.backgroundImage='none';"><img
src="http://2.bp.blogspot.com/_dsEG33PDaHw/S32TLuZ0f1I/AAAAAAAAAI8/r1AHB4GpoPQ/s200/body-blanco.png"
/></a>
</center>


Estilo 2:



<center>
Troque a cor do blog
<a href="#"
onclick="javascript:document.body.style.backgroundColor='#ff0000';
document.body.style.backgroundImage='none';">Roxo</a>
|<a href="#"
onclick="javascript:document.body.style.backgroundColor='#fff000';
document.body.style.backgroundImage='none';">Amarelo</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';">Marrom</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';">Preto</a>
|<a href="#"
onclick="javascript:document.body.style.backgroundColor='#FFFFFF';
document.body.style.backgroundImage='none';">Branco</a>
</center>


Salve e visualize.

Marcadores: , , , , ,

0 Comentários:

Postar um comentário

Se você gostou deste artigo deixe um comentário!

Duvidas ou sugestões comentem aqui! =D
*Não insultar autor ou leitores da postagens
*Não pedir parceria por comentários
*Não publicar spam ou similar.

Assinar Postar comentários [Atom]

Links para esta postagem:

Criar um link

<< Página inicial