Doriți să aveți un mini-chat pe site-ul dvs.? Cred că mulți vor spune "DA". Astăzi ne vom uita la mini-chat-ul minunat al Shoutbox, funcționează pe php, mysql și jQuery. Înainte de a începe, să ia un demo aspect (după ce Consiliul, înainte de sfârșitul lecției de citire, pentru a nu trage concluzii pripite)
Nu e chiar așa de cool? Acum, cum să implementați un astfel de lucru.
Scriptul pentru lucru utilizează baza de date Mysql. Să creăm o tabelă de shoutbox în baza de date pentru a simplifica sarcina pentru dvs. și pentru a vă aduce o interogare SQL gata:
Elaborează mesaje cu fișierul shoutbox.php. Găsiți următoarele rânduri în el și editați:
Cred că acest lucru nu ar trebui să fie complicat :) Un alt set de setări în același fișier:
header - Aici trimitem utilizatori neglijenți care încearcă să sune direct fișierul, shoutbox.php pe pagina index.html.
getContent ($ link, 50) - numărul de mesaje pe pagină. În acest exemplu, vor fi selectate ultimele 50 de mesaje.
Acum, în locul potrivit introducem formularul de trimitere a mesajului și div-container-ul care va conține ultimele mesaje de chat:
Un formular comun cu trei intrări. După ce forma merge div # container, nu fi confundat de prezența unei singure etichete p. Toate mesajele sunt afișate ca
Nume - mesaj
(vedeți fișierul shoutbox.php). Și în cele din urmă conectăm jQuery și scriptul shoutbox.js (puteți face acest lucru și în mod tradițional între capul etichetelor)CSS aici este responsabil doar pentru apariția chat-ului. Prin urmare, nu vom lua în considerare în detaliu această lecție. Nu uitați să includeți stilurile din fișierul css / general.css pe pagina dvs. sau, chiar mai bine, să faceți un design individual. Singurul lucru care ar trebui să fie amintit, id și clasă din codul de mai sus utilizează script-ul și shoutbox.js. astfel încât dacă schimbați id-ul și clasa de nume pe propriile dvs., nu uitați să o faceți și în shoutbox.js
P.S. Pentru cei care doresc să obțină o conversație mai completă de la acest script, vom modifica puțin scriptul original:
everyTime (30000) este timpul în milisecunde prin care conținutul ferestrei va fi actualizat. În exemplu, costă 30 de secunde.
Descărcați pluginul cu shoutbox.js corectat aici. Demo lucrează la versiunea originală, dar puteți testa cu ușurință scriptul actualizat de pe site-ul dvs. Web.
P.P.S corectați problema literelor "AND" și "sh"
Am decis să înlocuiesc aceste litere cu simbolurile lor din "tabelul de caractere Unicode". Găsiți linia "insert": (linia 66) în fișierul shoutbox.php și înlocuiți conținutul cazului cu acest cod: scrieți următoarea regulă:
Soluția este destul de simplă: înlocuim doar noul mesaj cu un mesaj nou în baza de date, înlocuiți literele de problemă cu aceleași, dar în versiunea simbolică
Prin obținerea de informații imediat prin două canale (vedere și auz), eficiența predării este mult mai mare decât învățarea din cărți. Și temele și testele online vă vor permite să gândiți în mod constant în limba pe care o învățați și să vă verificați imediat cunoștințele!
Dacă doriți să învățați HTML mult timp, atunci am o veste bună pentru dvs.!
Dacă ați învățat deja HTML și doriți să treceți mai departe, următorul pas este să învățați tehnologia CSS.
Dacă doriți să înțeleagă conceptele de domeniu si hosting, învață cum să creeze o bază de date, încărca fișiere pe un site web prin intermediul unui server FTP, crea subdomenii, configurați cutiile poștale pentru site-ul și să monitorizeze participarea, acest curs este conceput special pentru tine!
Articole similare
-
Ajutăm Yandex și Google să indexeze site-ul, pentru wordpress, cum să facă bani pe Internet
-
Cum se compune un kernel semantic pentru un site - un ghid complet de la analiza rush
Trimiteți-le prietenilor: