Criando um xat personalizado

Comece entrando no site xat.com e clique em make chat a box como mostra a seguir:

Então faça uma imagem de 600 x 600 transparente não adicione nenhuma imagem nem nada deixe ela transparente e hospede ela no Tinypic.com, pegue o link direto e coloque em background:

Agora vá em update e get code
Copie o código que aparece embaixo da pagina!

E cole em Html/javascript, que esta em layout no seu blog!
Coloque na posição que quiser!

Agora vamos personalizar esse xat

Primeiro baixe a imagem de base (Clique aqui!) e a edite como quiser! e depois a hospede no tinypic.com.

Abra o bloco de notas, e cole esse código:

<center>
<div style="background-image: url(LINK DA IMAGEM); line-height: 13px; width: 590px; height: 780px;"><span style="color: rgb(255, 255, 255);">
<br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br /><br />
<embed wmode="transparent" src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" width="540" height="405" name="chat" FlashVars="id=ID DO XAT&rl=Brazilian" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" /></embed></span></div></center>

Onde está "Link da Imagem" cole o código direto da imagem que você acabou de hospedar!

Agora vá onde você colocou o Html/javascript do xat e Procure essas palavras "id = Muitos números"
Copie só os números que estão lá, e cole onde esta no bloco de notas "id do xat"

Agora que você ja fez tudo o que devia no código que está no bloco de notas troque o code do xat que está no html/javascript do seu xat pelo o que está no bloco de notas e está pronto.