♥ Jak wstawić chat na Bloga? ♥

 

 

Zauważyłam, że wiele osób nie wie jak wgrać chat na bloga :D Tak na marginesie to ja tez niedawno nie wiedziałam jak go wstawić, aby wyglądał tak jak chcę :).


Na początku musimy wygenerować nasz chat, a do tego posłuży nam strona xat.com.

Jak wygenerować chat?

Wybieramy sobie tło (jeśli chcesz mieć chat przezroczysty, to pomiń ten punkt) oraz wymiary. Standardowy blog ma szerokość 960.

Dla nieogarniętych:
Width - Szerokość
Height - Wysokość

Klikamy "Update & Get Code"

Chcesz mieć przezroczyste tło?

To po kliknięciu na "Update & Get Code" zjeżdżamy w dół. Będzie tam kilka opcji. Zaznaczamy "Transparent background (No background image)" Jest to ostatnia opcja.

Teraz zjeżdżamy jeszcze niżej i klikamy na "Update these options"

Teraz wracamy na górę i jeszcze raz kilkamy na "Update & Get Code". 

Trochę niżej będzie taka ramka.

To jest kod naszego chatu. Kopiujemy go.


Jak wstawić chat na bloga?

W zależności od bloga są 2 sposoby wstawiania.

a) Jesli mamy jeden z szablonów oferowanych przez blogspot.

Wchodzimy w układ naszego bloga.
Klikamy "Dodaj gadżet".
W liście gadżetów szukamy "HTML/Javascript".

Wyskoczy nam okienko, w które wklejamy nasz kod, zapisujemy i gotowe (chyba wszystko jasne i nie muszę dawać obrazków?).


b) Jeśli mamy wgrany inny szablon, np. z btemplates.

Tym sposobem wgrywałam chat na tego bloga, gdyż sposobem "a" się nie dało.

Otwieramy worda lub dowolny dokument tekstowy.
Wklejamy nasz kod.

Z kodu usuwamy :

<br><small><a target="_BLANK" href="http://xat.com/web_gear/?cb">Get your own Chat Box!</a> <a target="_BLANK" href="http://xat.com/web_gear/chat/go_large.php?id=192206188">Go Large!</a></small><br>

 Oraz :

<img style="visibility:hidden;width:0px;height:0px;" border=0 width=0 height=0 src="http://c.gigcount.com/wildfire/IMP/CXNID=2000002.0NXC/bT*xJmx*PTEzNjI4NjgyOTcyMDQmcHQ9MTM2Mjg2OTMzMzMwMSZwPTUzMTUxJmQ9Jmc9MSZvPTc*OWQyNWU*Mzk*MTQ5OTlhZDZj/Mzk5YmRkY2RlNjMx.gif" />

Po usunięciu zostaje nam mniej więcej taki kod (nie kopiujcie go, nie zadziała wam, musicie mieć swój):

 <embed src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" width="960" height="405" name="chat" FlashVars="id=192206188" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" />

Dodajmy na początku kodu  <div id='chat-wrapper'> a na końcu </div>

Nasz kod wygląda teraz tak:

<div id='chat-wrapper'><embed src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" width="960" height="405" name="chat" FlashVars="id=192206188" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" /></div>

 Teraz zajmiemy się wstawieniem naszego chatu.

Otwieramy kod HTML naszego szablonu i zaznaczamy "Rozszerz szablony widżetów".

Odszukujemy w kodzie taki fragment:

<div style='clear:both;'/><div id='content-wrapper'><div id='crosscol-wrapper' style='text-align:center'>

Szybko znajdziecie te fragment wciskając na klawiaturze CTRL + F i wklejając tam ten fragment.

Kod naszego szablonu wklejamy zaraz po <div style='clear:both;'/>.

Będzie to wyglądało tak:

<div style='clear:both;'/><div id='chat-wrapper'><embed src="http://www.xatech.com/web_gear/chat/chat.swf" quality="high" width="960" height="405" name="chat" FlashVars="id=192206188" align="middle" allowScriptAccess="sameDomain" type="application/x-shockwave-flash" pluginspage="http://xat.com/update_flash.shtml" /></div><div id='content-wrapper'><div id='crosscol-wrapper' style='text-align:center'>

I gotowe. Zanim zapiszesz sprawdź na podglądzie, czy wyszło. Jeśli nie, spróbuj jeszcze raz.


UWAGA! JEŚLI CI NIE WYCHODZI napisz tutaj komentarz w czym problem, a ja postaram się pomóc.