Hvordan bruke Ajax i WordPress
AJAX står for Asynchronous Javascript og XML (eXtensible Markup Language). Selv om det ikke er et nytt programmeringsspråk av seg selv, representerer AJAX Javascript teknikker utviklet for å gjøre websider laste innhold raskere og uten å oppdatere hele siden. AJAX fungerer ved å gjøre forespørsler til en server og plassere innhold nylig lastet inn i eksisterende webside. Du kan bruke AJAX i WordPress som du ville bruke Javascript programmering ved å legge den på innsiden av skriptkodene i header.php fil.
Bruksanvisning
1 Åpne header.php filen for temaet du bruker med din WordPress blog. Bruk en kode editor eller Notisblokk til å åpne filen, slik at du kan arbeide med koden. Finn "<php wp_head ();?>" Like over ending "</ head>" tag og opprette en ny linje over "wp_head ()" -funksjon. Du bør også skrive et kall til "wp_head ()" hvis det ikke allerede finnes.
2 Legg et sett av skriptkodene der du opprettet en ny linje over "wp_head ()" -funksjonen og sette sin "type" attributt til "text / javascript" hvis koden er i XHTML eller HTML 4. Hvis du ikke vet, så legge til "type" attributt for å være trygg. Innstilling av "type" attributt vil ikke skade noe når koding et HTML 5-dokument, men det er ikke nødvendig. Her er et eksempel på koden så langt:
<Script type = "text / javascript">
// Din AJAX kode vil gå her
</ Script>
3 Start AJAX kode mellom skriptkodene. Lag en variabel på den første linjen i koden som vil holde XMLHTTP objekt. XMLHTTP objekt håndterer forespørsler til serveren for HTML og XML-filer, samt tekst, PHP og ASP-filer.
<Script type = "text / javascript">
Var XMLHTTP;
</ Script>
4 Lag en betinget "hvis-så" statement å sjekke om nettleseren er Internet Explorer (IE) 6 versus en annen nettleser, for eksempel Firefox eller Chrome. Å gjøre dette sikrer at IE 6 brukere kan fortsatt bruke nettstedet, men at nettleseren ikke støtter objektet "XMLHttpRequest."
<Script type = "text / javascript">
Var XMLHTTP;
if (window.XMLHttpRequest) {
xmlhttp = new XMLHttpRequest();
} Else {
xmlhttp = new ActiveXObject("Microsoft.XMLHTTP");
}
</ Script>
5 Skriv en funksjon for å kontrollere at XMLHTTP objektet er klar. Dette betyr at siden er lastet, og serveren returnerte ingen feil.
xmlhttp.onreadystatechange = function () {
if (xmlhttp.readyState == 4 && xmlhttp.status == 200) {
}
}
6 Skriv inn koden for å hente informasjon fra filen i "if-then" statement som sjekker for XMLHTTP objektets beredskap. Du kan angi en del av nettstedet ditt for å få respons tekst som sendes av en forespurt fil, for eksempel. Her er et eksempel:
document.getElementById ( "oppdateringer") innerhtml = xmlhttp.responseText.;
Koden ovenfor vil sette innholdet i XMLHTTP objekt inne i et par av HTML-koder som har navnet ID "oppdateringer".
7 Skriv din kode for å få innholdet fra en bestemt fil. Dette forteller serveren der for å se etter innholdet du ønsker å plassere på siden gjennom AJAX. Her er et eksempel:
xmlhttp.open ( "GET", "myupdates.txt", true);
xmlhttp.send ();
Endre "myupdates.txt" til filen navnet på dokumentet fra der du ønsker å trekke dine data. I dette tilfellet "myupdates.txt" inneholder informasjon du ønsker å plassere på siden din. Den "ekte" forteller serveren du ønsker en asynkron forespørsel.
8 Etter å ha skrevet Javascript og AJAX-kode, lagre header.php filen og andre filer du for å redigere. Last opp filene til serveren din, inkludert eventuelle filer som inneholder data som AJAX kode referanser.
Hint
- Installer Firebug-utvidelsen i Firefox eller trykk "Ctrl-Shift-J" i Chrome for å feilsøke AJAX skript.
- Sikkerhetskopier tema filer WordPress før redigere dem. Hvis du får en "hvit skjerm" feil som låser deg ut av WordPress, re-laste den opprinnelige tema filer.