I dag starter vi mini-serien om hvordan du legger inn innlegg via frontenden. Vi vil dekke en rekke forskjellige aspekter i denne opplæringen, begynner med skjema validering og innsetting av innlegg. Så, la oss bli klare og begynne!
Vårt mål etter å ha fullført denne mini-serien, bør tillate brukeren å sende inn innlegg via frontenden, sammen med redigering og sending av innlegget til søppelet. alt uten å være i WordPress Dashboard. Disse metodene kan brukes i enten et tema eller et plugin og være veldig tilpasningsdyktig for å oppnå svært avanserte og komplekse innleveringer.
Demoen og nedlastingsfilene er et fjernet tema som er opprettet for bare formålet med denne opplæringen.
Så åpne din favoritt tekstredigerer og la oss begynne!
Vi begynner med å lage et skjema som lar brukeren legge inn detaljene med hensyn til å lage et innlegg. Når vi bygger dette inn i et tema, la oss begynne med å opprette en ny sidemal og la oss kalle det mal-insert-posts.php. Vi vil da begynne å bygge vårt skjema, og sette inn noen etiketter og inntastingsfelter for innleggets tittel og tekstområde for kroppen:
Det vi nettopp har opprettet, er en veldig enkel form som har en tekstinngang for brukeren å skrive inn tittelen og en tekstområde for innholdet i innlegget.
Nå som vi har satt grunnlagene våre, må vi utføre noen form validering for å sikre at vi får riktig innhold og ikke har ondsinnede angrep mot våre innlegg.
Vi skal bruke to forskjellige former for validering. Vi bruker jQuery Validation Plugin, sammen med tradisjonell PHP validering. La oss starte med jQuery-siden av validering først og initialisere vårt valideringsskript. Vi vil sørge for at vi registrerer og legger inn skriptene i vår functions.php fil. Sammen med dette vil vi opprette en tom JavaScript-fil der vi skal håndtere alle våre egendefinerte jQuery; Husk å registrere og enqueue denne filen for initialisering. Dette skulle se slik ut:
// tilpasset jquery wp_register_script ('custom_js', get_template_directory_uri (). '/js/jquery.custom.js', array ('jquery'), '1.0', SANT); wp_enqueue_script ('custom_js'); // validering wp_register_script ('validering', 'http://ajax.aspnetcdn.com/ajax/jquery.validate/1.9/jquery.validate.min.js', array ('jquery')); wp_enqueue_script ('validering');
Flott, vi har registrert og enqueued alle våre nødvendige skript. Vi åpner nå vår egendefinerte jQuery-fil og begynner å initialisere vår jQuery Validation Plugin; vi åpner vår tomme JavaScript-fil og skriver følgende linje med kode for å opprette vår jQuery-validering:
jQuery (dokument) .ready (function () jQuery ("# primaryPostForm"). validere (););
Alt vi har gjort her er å få ID av vårt skjema og bruke validere
metode til dette. Nå som vi har dette på plass, vil vi gå tilbake til vår mal-insert-posts.php filen og sørg for at vi har satt nødvendig
klassen i feltene som kreves.
Alle jQuery Validation er på plass, la oss gå videre til PHP Validation.
Vår validering skal sikre at vi skriver inn en tittel, og hvis jQuery Validation mislykkes, vil den falle tilbake til PHP Validation. Vi gjør dette ved å først opprette en PHP-variabel for å lagre feilmeldingen, og deretter lage noen betingede tester.
Vi tester først om brukeren har sendt inn skjemaet, og deretter tester vi om feilfeilmeldingen vår er tom. Vi må sette inn følgende kode som gjør dette like over vår :
Vår PHP Validation er på plass, vi skal sikre at verdien vi sender er den samme verdien brukeren har skrevet inn, og vi gjør dette ved å sette inn følgende kode i vår postTitle
inntastingsfelt:
value =""
Vi må også gjøre det samme for vårt tekstområde, men det virker litt annerledes; I stedet for å sette en verdi, legger vi inn følgende kode i vår postContent
textarea tags:
Til slutt må vi sørge for at vi utarbeider feilmeldingen, og vi gjør dette ved å sjekke om feilmeldingsvariabelen er tom. Hvis vår variabel ikke er tom, sendes meldingen ellers ikke ut noe. Følgende kode oppnår dette:
Nå som vi har satt opp skjemaet med validering, kan vi flytte inn på innholdet i et innlegg. La oss gå videre…
Vi sender nå skjemaopplysningene våre til en faktisk post. Vi gjør dette ved å bruke WordPress-funksjonen wp_insert_post
. Denne funksjonen tillater oss å sette inn innlegg, så vi vil bruke dette til vår fordel.
Vi begynner med å først opprette en variabel for å holde alle våre forskjellige elementer. Du kan definere en hel masse forskjellige elementer, og du kan lese om i WordPress Codex. Sett inn følgende kode, like under skjemaets valideringskode:
$ post_information = array ('post_title' => wp_strip_all_tags ($ _POST ['postTitle']), 'post_content' => $ _POST ['postContent'], 'post_type' => 'innlegg', 'post_status' => ' '); wp_insert_post ($ post_information);
Koden vi nettopp har satt inn, oppretter en matrise og tilordner verdier til de forskjellige elementene. For POST_TITLE
element, vi postet vår postTitle
verdi, og vi postet vårt postContent
til vår POST_CONTENT
element.
Vi har også satt vår posttype til post
, siden vi sender inn standard posttype, men du er i stand til å sende noen egendefinert innleggstype til dette feltet. Endelig setter vi statusen til innlegget til vent, slik at administratoren kan bekrefte innlegget før det publiseres.
Vi kjører deretter funksjonen wp_insert_post
og passere vårt utvalg med alle våre elementer og dataene tildelt dem.
Det er det! Vi er nå i stand til å legge til innlegg via forenden, men vi er ikke ferdige ennå. Vi har noen sikkerhetsproblemer som vi må kompensere for. Vi begynner med å sette inn en wp_nonce_field
. Hvis du ikke vet hva et nonce-felt er, forklarer WordPress Codex det perfekt:
Non-feltet brukes til å validere at innholdet i skjemaet kom fra stedet på det nåværende nettstedet og ikke et annet sted.
Dette vil hjelpe oss mot eventuelle sikkerhetsproblemer og forhindre eventuelle ondsinnede angrep. Alt vi trenger å gjøre er å sette inn følgende kode rett før vår sende-knapp:
Sammen med dette vil vi redigere skjema validering for å sikre at vi bare sender inn innhold når nonce-feltet er bekreftet at vi sender innholdet fra nettstedet, gjør vi dette ved å erstatte vår betingelse for validering. Din endelige kode med validering og innlevering av data skal være som følger:
hvis isset ($ _POST ['submitted']) && isset ($ _POST ['post_nonce_field']) og&wp_verify_nonce ($ _POST ['post_nonce_field'], 'post_nonce')) hvis (trim ($ _POST ['postTitle' ]) === ") $ postTitleError = 'Vennligst skriv inn en tittel.'; $ hasError = true; $ post_information = array ('post_title' => wp_strip_all_tags ($ _POST ['postTitle']) 'post_content' > $ _POST ['postContent'], 'post_type' => 'post', 'post_status' => 'venter'); wp_insert_post ($ post_information);
Til slutt, bare for en ekstra, vil vi sette omdirigering når brukeren har sendt inn informasjonen, slik at brukerne ikke kan trykke på sende flere ganger og fortsette å legge inn de samme dataene i våre innlegg. Vi vil gjøre dette på et svært grunnleggende nivå.
Som wp_insert_post
returnerer en ID som vi vil bruke dette til vår fordel, og returnere ID til en variabel som vi skal bruke for å sikre at vi ikke omdirigeres hvis det ikke ble opprettet et innlegg.
Vi vil gjøre dette ved å tildele vår wp_insert_post
funksjon til en variabel, som følger:
$ post_id = wp_insert_post ($ post_information);
Vi vil da kjøre en betinget erklæring for å bare omdirigere hvis vi har en post-ID, så bruk WordPress omdirigere
funksjon og passere HOME_URL
til dette. Koden du vil sette inn er som følger:
hvis ($ post_id) wp_redirect (home_url ()); exit;
Ferdig…
Det er grunnleggende og grunnleggende om hvordan du legger inn innlegg via frontenden. Vi har dekket mye, ved å først lage et skjema, skjema validering og sende inn data til et ventende innlegg!
Innenfor neste del skal vi grave litt dypere inn i redigering og sletting av innlegg via frontenden, noe som blir litt vanskeligere, men det kan være veldig nyttig!
Jeg vil gjerne si en stor takk for at du har brukt tid til å lese opplæringen min, håper jeg det hjalp. Vær så snill å legge igjen kommentarer, og jeg vil prøve mitt beste for å hjelpe og svare på dem, hvis ikke, kan du alltid kontakte meg direkte via nettsiden min: www.VinnySingh.co eller Twitter @VinnySinghUK
Hold deg klar for del 2!