Clique na imagem para visualizar melhor
Aparecerá um botão na lateral do blog, então quando clica no botão XAT automaticamente o seu xate será aberto e ele aparecerá deslizando na lateral esquerda do blog, e o mesmo botão serve também para fixar o XAT.
Então para colocar o XAT flutuante vamos adicionar o código no HTML do blog.
Se você não sabe onde é que fica o HTML vou mostrar:
Primeiro vá no painel do seu blog, em Modelo >> depois Editar HTML
Clique na imagem para visualizar melhor
Depois vai abrir uma nova janela, lá você vai clicar em Prosseguir, e logo abrirá a HTLM do seu blog.
Então você vai apertar Ctrl + F do seu teclado para pesquisar este Tag: ]]></b:skin>
E a cima de ]]></b:skin> você vai colocar esse código:
#gb { position:fixed; top:150px; z-index:+1000; left:-610px; } * html #gb { position:relative; } .gbtab { height:161px; width:47px; float:right; cursor:pointer; background:url('http://i.imgur.com/WoBz0.png') no-repeat; margin-top:20px; } .gbcontent { float:left; border:2px solid #8c00c1; background:#fff; opacity:0.80; -moz-opacity: 0.80; filter: alpha(opacity=80); -webkit-border-radius: 20px; border-radius: 20px; -khtml-border-radius: 20px; padding:8px; }<br /> <br />
E agora procure por </body> e acima dele cole este segundo código:
<script type='text/javascript'> function showHideGB(){ var gb = document.getElementById("gb"); var w = gb.offsetWidth; gb.opened ? moveGB(0, 47-w) : moveGB(20-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.left = x.toString() + "px"; if(x0!=xf){setTimeout("moveGB("+x+", "+xf+")", 10);} } </script> <div id='gb'><div class='gbtab' onclick='showHideGB()'></div><div class='gbcontent'><div style='line-height:0;background-position:center;width:590px;height:310px;'><embed align='middle' allowscriptaccess='sameDomain' flashvars='id=171627818' height='310' name='chat' pluginspage='http://xat.com/update_flash.shtml' quality='high' src='http://www.xatech.com/web_gear/chat/chat.swf' type='application/x-shockwave-flash' width='590' wmode='transparent'/> </div></div></div>
Neste segundo código Altere o ID id=171627818 pelo o do seu XAT.
OBSERVE:o id fica no código do seu XAT.
E por final clique em Visualizar e veja se tudo ocorreu certo e depois Salve o modelo.
valeu amigão eu estava a proucora disso ao tempão
ResponderExcluirsegue la o meu blog
link = http://tudoparafacebook2012.blogspot.com.br/
Muito Obg!
ResponderExcluirEi você poderia dar mais alguma dicas, como eu deixo eu na parte de baixo em vez da do lado?
http://aeriumplay.com
Olá em primeiro lugar eu quero parabenizar a vc pelo seu blog, graças a vc eu consegui personalizar o meu blog com as suas dicas parabéns ! Eu quero lhe perguntar algo se vc puder responder ? eu coloquei o xat flutuante no meu blog, que ficou bem legal, só que o meu blog as cores dele é marrom e rosa, no caso onde clica para abrir o xat está escrito em roxo, teria como mudar a cor para rosa ? desde já obrigada .
ResponderExcluirOlá, Estava com o mesmo problema Mas com alguns conhecimentos básicos de Web designer e Html consegui, posso lhe ajudar dessa forma :
Excluir1º Clique com o botão direito na fotinho que abre o xat, depois em "Inspecionar elemento"
2º Na janela equena do Lado Direito Ache Algo Parecido com isso "http://i.imgur.com/WoBz0.png"
3º Hospede uma Imagem nesse Site www.imageshack.com (é muito simles da até com o facebook)
4º Coie o Link da Imagem que voce hospedou e Cole No Lugar daquele "http://i.imgur.com/WoBz0.png"
Pronto, Mais Informações : http://www.youtube.com/watch?v=v-46uZdKQM8
Atenciosamente Equipe DowmBown
muiiiiito obg msm entrem ae www.transformicepiratiado.blogspot.com.br
ResponderExcluirComo encontrar esse código do meu XAT?
ResponderExcluiré muito Fácil!!
Excluiro ID do seu Xat está no código que você utiliza pra colocar o Xat no blog...
o Id é uma numeração com "Nove Número" Exemplo: 188064924
Valeu! consegui! só que o blog ficou mas lento com o xat. Tem como deixar com formato mais leve?
Excluirna verdade eu não tenho essa resposta, pra deixar o Xat mais leve no seu blog...
Excluirmais eu acho que não tem como, apesar que o Xat já é pesado pra carregar no blog.
nao deu -.-
ResponderExcluiroba olha o chat ficou no canto esquerdo ,como fasso para ele flutuar ???
ResponderExcluire aí DJ cordeiro!
ExcluirSim o Xat ficará posicionado na lateral esquerda do blog, irá aparecer um botão com o nome "XAT" você irá clicar nesse botão, e ao clicar o Xat abrirá deslizando como se estivesse flutuando... Valeu
não deu certo,o xat ficou no canto esquerso do blog,e o botão não apareceo
ResponderExcluirvlwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwwww por me ajuda entrem http://jorrandodownloads.blogspot.com
ResponderExcluircomo muda aquela borda roxa do chat responde ai pf
ResponderExcluirn deu certo
ResponderExcluirOlá Kelven no meu n deu certo pq eu coloquei tudo direitinho.
ResponderExcluirSó funciona com BLOGGER???
ResponderExcluirnão tem como eu colocar no meu site da minha web rádio??
djrodrigo.15@hotmail.com
Tem sim ...Mas voce devera esquisar no google de outra maneira ois isso ira alterar o Html....!
ExcluirAtenciosamente Dowm Bown
Tem sim ...Mas voce devera esquisar no google de outra maneira ois isso ira alterar o Html....!
ExcluirAtenciosamente Dowm Bown
Pegou, mais o meu xat fico transparente :( como faço prá arrumar isso ????? alguém me ajuda pfv.
ResponderExcluirEste comentário foi removido pelo autor.
ExcluirKRONOS BASTA MEXER NA OPACIDADE (FAÇA UM BACKUP ANTES OK)
Excluiroi poso te ajuda no próprio código trem escrito 'transparent ai você tira esse nome que ta ai e poen no
Excluirola coloquei no meu blog pcogames.blogspot.com porem porem ta grande de mais tem como muda o tamanho ?
ResponderExcluirEu tirei Do blog Motivo:quase ninguém entrava mais nele dexei o tradicional mesmo XD
Excluirmuiiito bom cara, valeu mesmo em ! XD já favoritei seu blog
ResponderExcluirEste comentário foi removido pelo autor.
ResponderExcluirEste comentário foi removido pelo autor.
ResponderExcluirmuito bom essa postagen já coloquei no meu
ResponderExcluirblog visiteo! para ser meu(a) parceiro(a)
http://herykwilliam.blogspot.com.br/
amigo eu coloquei mais eu nao fico adm no blog fica verde com uma estrela preta mais nao fica amarelo por q ?
ResponderExcluirOI, pffff, como fasso para colocar uma imagem, tipo regras do xat em baixo do xat?
ResponderExcluirPFFFFF
Responde em blogsmeh@gmail.com
valeu msm bom tutorial mano
ResponderExcluirsegue meu site ai
http://www.baixandotorrentgratis.com
CARA ME AJUDA AI EU FIZ ALGUMAS MUDANÇAS AQUI NA MINHA RADIO E TOCO COM DIFICULDADE NO BOTÃO DO XAT POIS ELE COMEÇA DIREITINHO DEPOIS QUANDO VC CLICA EM VOLTA O BOTÃO QUASE SOME E TEM COMO TIRA ESSA OPACIDADE RESPONDE AI MEU FACEBOOK.COM/FABIOKAUA
ResponderExcluirCARA ME AJUDA AI EU FIZ ALGUMAS MUDANÇAS AQUI NA MINHA RADIO E TOCO COM DIFICULDADE NO BOTÃO DO XAT POIS ELE COMEÇA DIREITINHO DEPOIS QUANDO VC CLICA EM VOLTA O BOTÃO QUASE SOME E TEM COMO TIRA ESSA OPACIDADE RESPONDE AI MEU FACEBOOK.COM/FABIOKAUA
ResponderExcluirtem como tira essa cor roxa diz ai
ResponderExcluirpessoal achei um jeito de vocês muda a cor da borda esta aqui faça o seguinte segure contro+f e copia e cola isso #8c00c1 a cor roxa mude para qual quer uma se tive duvida vai la no minha radio www.radionyx.blogspot.com.br
ResponderExcluirhttp://webradiosupernatural.blogspot.com.br/
ResponderExcluirMeu site.
E valeu pelos tutoriais são muitos uteis.
^_^
FICOU SHOW CARA VLW
ResponderExcluirhttp://tendtudo190.blogspot.com.br/
Muito bom essa dica, estava a procura!!
ResponderExcluirhttp://noscaminhosdopai.blogspot.com.br
vlw
ResponderExcluirEste comentário foi removido pelo autor.
ResponderExcluirola to com um problema no meu xat, ele ta certinho no lado esquerdo do meu blog mais o problema é que nao ta aparecendo o nome do xat (a imagem que abre o xat ) min ajuda pf ja troquei a imagem pra outra e nada min ajuda pf da uma olhada http://gaming-pop.blogspot.com.br/
ResponderExcluirOlá Cleydson!
ExcluirEu acessei seu Blog, e a "imagem que abre o Xat" está aparecendo normalmente...
Olá eu gostaria de colocar o código somente para uma pagina do meu blog e não todo o blogo como faço?
ResponderExcluirEste comentário foi removido pelo autor.
ResponderExcluirEste comentário foi removido pelo autor.
ResponderExcluirColoquei o chat no meu blog, e mudei o id, só que não dá pra escrever nd, dá pra clicar nos botões como ''get xat box''.. e afins, mais não dá pra escrever mensagens nem clicar nos emoticons, pode me ajudar pvf, obg.
ResponderExcluirisso é coisa linda de Deus rsrs obrigado ajudou muitoooooooo
ResponderExcluirEste comentário foi removido pelo autor.
ResponderExcluirQueria saber como coloca em site, queria desse mesmo geito, más para o meu site. Num achei no Google =(
ResponderExcluirtem como eu colocar um vide-o do youtube flutuante desta forma ?
ResponderExcluirObrigado pelo gadget!
ResponderExcluirhttp://android-lider.blogspot.com.br/
DEU CERTO cstvsat.blogspot.com
ResponderExcluirFicou ótimo, Acesse: http://portaln9.blogspot.com.br/
ResponderExcluirEste comentário foi removido pelo autor.
ResponderExcluirAnuncie Agora nos Melhores Classificados Sem Limites de Anúncios e Grátis
ResponderExcluir→ Visitar website classificados24horas.blogspot.com