28 junho 2015

Tutorial como colocar o Gadget "Mude o fundo"

Oii lindinhas

Primeiramente quero saber se gostaram do novo visual do blog ? (comente ou vote na enquete)  voltando ao post vou ensinar  a vocês como colocar o Gadget mude o fundo


1- Vá em Layout e adicione um Gadget do tipo HTML/Java Script.
2- Cole esse código e faça as substituições

---------------------------------------------------------------------------------------------------------
<h2 class='title'>Mude o Fundo!!</h2>
<div class='widget-content'>
<style>

#backgrounds a img{
width:40px;
height:40px;
display:inline;
margin-right:10px;
margin-top:15px;
border:2px solid #FFFFFF;
}

#backgrounds a:hover img{
border:2px solid #FFEC8B;
}

</style>

<div id="backgrounds">

<script src='http://code.jquery.com/jquery-1.6.2.min.js' type='text/javascript'></script>

<script>
$(document).ready(function(){
 $("#background01").click(function(){
 

$("body").css({"background":"url(URL DO FUNDO 1)"});
 });
});
$(document).ready(function(){
 $("#background02").click(function(){
 

$("body").css({"background":"url( URL DO FUNDO 2)"});
 });
});
$(document).ready(function(){
 $("#background03").click(function(){
 

$("body").css({"background":"url( URL DO FUNDO 3)"});
 });
});
</script>

<center><a href="javascript:void(O)" id='background01' title="1"><img

src="URL DO FUNDO 1" /></a>

<a href="javascript:void(O)" id='background02' title="2"><img

src="URL DO FUNDO 2" /></a>

<a href="javascript:void(O)" id='background03' title="3"><img

src="URL DO FUNDO 3"

/></a></center></div>

</div></div>

------------------------------------------------------------------------------------------------------

Onde está rosa você vai colocar o URL das imagens que você quer, o mesmo URL que você colocar no "URL do fundo 1" que está em cima você vai colocar no "URL do fundo 1" que está em baixo. A parte que está azul você vai ajustar a largura das imagens o meu e 70px


Agora e só salvar, viu como é facil ;)