Lux Downs: Video aulas -

Como Colocar Xat Flutuante No Rodapé Do Blog

1 - Com esse codigo mude as palavras em vermelho :

#gb {

position:fixed;

bottom:-340px;

z-index:+1000;

right:160px;

}

* html #gb {

position:relative;

}

.gbtab {

height:48px;

width:677px;

margin-left: 45px;

cursor:pointer;

background:url

('http://img88.imageshack.us/img88/9633/34601740.jpg') << (SEU LINK DA IMAGEM) (APAGUE E COLOQUE O SEU)

no-repeat;

margin-top:0px; }

.gbcontent { float:left; border:7px solid #000;

background:#fff; -webkit-border-radius: 20px;

border-radius: 20px; -khtml-border-radius: 20px;

padding:8px; }

2 - No outro codigo abixo mude a palavra em verde

function showHideGB(){

var gb = document.getElementById("gb");

var w = gb.offsetWidth;

gb.opened ? moveGB(0, 425-w) : moveGB(425-w, 0);

gb.opened = !gb.opened;

}

function moveGB(x0, xf){

var gb = document.getElementById("gb");

var dx = Math.abs(x0-xf) > 10 ? 5 : 1;

var dir = xf>x0 ? 1 : -1;

var x = x0 + dx * dir;

gb.style.bottom = x.toString() + "px";

if(x0!=xf){setTimeout("moveGB("+x+",

"+xf+")", 10);}

}

</script>

</div> <div class='gbcontent'>

<div style='line-height:0;background-

position:center;width:735px;height:310px;'>

flashvars='id=840946751' << (MUDE PELO ID DE SEU XAT) (APGUE E PONHA O SEU)

height='310' name='chat'

pluginspage='http://xat.com/update_flash.shtml'

quality='high'

src='http://www.xatech.com/web_gear/chat/chat.sw

f' type='application/x-shockwave-flash'

width='735' wmode='transparent'/> </div> </div> </div>

3 - Para colocar seu link da imagem va nesse site > http://www.imageshack.us/ < crie ou loga na sua conta va em browse pegue uma imagem de xat q vem no codigo e coloca e aperte uploud , depois pegue o "LINK DIRETO" só copiar e colar

4 - Para colocar o ID va no seu blog clique va até seu xat "DO BLOG" e clique em "GET A CHAT BOX" depois "MAKE A GROUP" la em cima no link vai ter os uyltimos numeros copio e cole.

5 - Faça o login no blogger > http://www.blogger.com/ < escolha um blog va em modelo , e "EDITAR HTML" > "EXPANDIR MODELOS DE WIDGETS" > CTRL + F > pegue essa tag ]]></b:skin> , e pesquise depois de achar de 2enters e va para cima e cole o primeiro codigo...

6 - Pegue essa tag </body> depois de achar de 2enters e va para cima pegue o segundo codigo e cole..

7 - Depois va em visualizar se tiver bom va em salvar modelo , caso tiver algum erro me comunique "rafaduclosamadonovaes@hotmail.com"

4 SHARED : CODIGO E IMAGENS