I den forrige opplæringen i denne serien begynte vi å jobbe på vår tilpassede administrasjonsside. 

Til slutt vil målene vi arbeider for demonstrere hvordan vi kan bruke vår egen tilpassede kode og WordPress API for å lage sider som er litt mer fleksible enn det som naturlig kan være tilgjengelig via en av standard APIer. 

Dette er ikke å si at vi skal sidestep eller unngå APIene som WordPress gir. Faktisk er jeg en fan av å bruke dem så mye som mulig. Men når et prosjekt oppstår der du må introdusere ekstra funksjonalitet eller tilpasse måten noe utfører, vil utviklingen av funksjonaliteten bli overlatt til deg.

For det andre bruker vi også prinsipper som prinsippet om enkeltansvar for å demonstrere hvordan vi kan fortelle en velorganisert, objektorientert tilnærming til koden vi skriver.

Før vi går videre, skjønner vi, hva vi har dekket så langt.

For første innlegget ...

Husk at vi har gitt en arbeidsdefinisjon av enkeltansvarsprinsippet:

Samle sammen de tingene som endres av samme grunner. Separat de tingene som endres av forskjellige grunner.

Og vi brukte det til å bidra til å organisere etableringen av vår nåværende undermeny og undermeny side.

Vi så også på koden for den første versjonen av pluginet, gjorde den tilgjengelig for nedlasting, og lagt grunnlaget for arbeidet som vi skal gjøre i denne opplæringen.

Hvis du ikke har vurdert den tidligere opplæringen eller i det minste vurdert koden, anbefaler jeg det Ellers kan det hende du lurer på hvorfor vi gjør noen av de beslutningene vi lager, eller hvorfor noen av koden er organisert slik det er.

Med det sagt, la oss fortsette.

Før vi begynner

Som med mange av mine opplæringsprogrammer, liker jeg å sørge for at du har alt i gang før vi fortsetter. For denne opplæringen trenger du følgende:

• et lokalt utviklingsmiljø
• en kopi av WordPress installert og klar til bruk
• En kopi av plugin-modulen fra den tidligere opplæringen ble installert og aktivert
• en IDE med plugin lastet og klar for ekstra redigering

Hvis noen av de ovennevnte ikke gir mening, vennligst gå gjennom den forrige opplæringen eller denne serien for hvordan du konfigurerer et lokalt utviklingsmiljø.

Når det gjelder koden som kommer, går vi trinnvis gjennom det. Jeg skal forklare nøyaktig hva vi gjør, og vil gi både kodekommentarer og kommentarer i opplæringen for å sikre at du forstår alt som skjer underveis.

Opprette administrasjonssiden

Som vi fortsetter med plugin-modulen i denne artikkelen, er dette hva vi skal gjøre:

1. Lag oppmerkningen for administrasjonssiden som arver de native WordPress-stilene.
2. Sett inn et alternativ som brukeren kan samhandle med.
3. Sanitize alternativet før du lagrer det.
4. Hent verdien av alternativet og sett den tilsvarer verdien på siden.

I denne opplæringen skal vi fokusere på de neste to punktene. I neste artikkel vil vi fokusere på poeng tre og fire.

For de som er kjent med Innstillings-API, virker dette som overkill. Men som du vil se gjennom resten av denne opplæringen og denne serien, er det en grunn til at vi skal bryte den ned i mindre stykker som dette.

Med det lagt ut som vår handlingsplan, la oss komme i gang.

Merking opp siden

Når vi sist forlot denne funksjonen, så koden slik ut:

Nå er vi klare til å faktisk begynne å lage oppsettet på siden. Når jeg jobber med programtillegg for klienter, kaller jeg disse "visningene". 
Dette er ikke ment å forveksles med modell-visning-kontroller-paradigmet. Men jeg kaller dem ikke maler, heller ikke fordi i WordPress er maler det som brukes til å vise innholdet på en side på forsiden. 
Så visninger er det.
Det første vi ønsker å gjøre er å lage en visningskatalog inne i administrasjonskatalogen av pluginet vårt.
Når det er gjort, kan vi nevne dette så enkelt som settings.php eller noe mer beskrivende. Det er virkelig opp til deg og kompleksiteten til det du bygger. Siden dette er et enkelt plugin, stikker jeg med et enkelt navn.
Neste, la oss begynne å lage grunnleggende oppslag som vil gi standard WordPress-wrapper-elementet sammen med sidens tittel:
 
 
 
 
 
Merk her at tittelen blir avledet fra en funksjon som bruker verdiene som er overført til add_options_page Fungerer fra når vi først begynte å jobbe med plugin. Deretter bruker vi også admin_url funksjon å indikere hvor vi skal legge inn alternativene (som vi snakker om litt senere).
Og i begge tilfeller bruker vi esc_html sanitering funksjon for å sikre at ingen ondsinnede strenger kan gjengis på siden.
Dette er to eksempler på at når det er mulig, bruker det uansett API-funksjoner som er tilgjengelige for deres tiltenkte formål. Forutsatt at alt har gått riktig, bør siden din se slik ut:
Nå, for å koble dette til pluginet ditt, må vi gå tilbake til funksjonen ovenfor. Dette betyr at funksjonen nå skal se slik ut:
Enkelt nok, ikke sant? Forutsatt at alt er satt opp riktig, så er dette det du bør se:
Nei, det er ikke mye å se på, men vi skal endre det.
Legg til et alternativ
På dette tidspunktet er vi klare til å legge til et alternativ. I forbindelse med dette innlegget skal vi tillate brukeren å skrive inn noe i et inntastingstekstelement. Dette vil tillate oss å ta en titt på hvordan å sanitisere informasjon og til slutt vise den på fronten.
For å gjøre dette må vi ha nøkkelinformasjon. Nemlig må vi kjenne navnetattributtet vi skal ringe til inngang element. Dette er slik at vi kan lagre det i databasen på riktig måte. 
Så, for dette eksemplet, la oss si at denne meldingen vil bli brukt til ubetinget å vise øverst på hvert innlegg. Vi kommer ikke til det punktet i denne artikkelen, men vi vil se det i neste artikkel.
I din settings.php se, legg til følgende kode.
 
 
 
 
Universell melding
 
 
 Hvilken melding vil du vise over hvert innlegg? 
  
 
  
 
Hvis du skulle se siden på dette tidspunktet, bør du se nøyaktig hva du forventer: en etikett og en innboks boks.
Sikre alternativet
Normalt vil jeg vise et skjermbilde her, men vi er ikke ferdige ennå. Vi må presentere to ting.
 
En WordPress nonce
 
Send-knappen
 
La oss gjøre det nå. Hvis du ikke er kjent med nonce-verdier, anbefaler jeg at du leser denne artikkelen. Kort av det er dette:
En nonce er et "nummer som brukes en gang" for å beskytte nettadresser og skjemaer fra bestemte typer misbruk, ondsinnet eller på annen måte.
I vår settings.php fil, la oss legge til følgende kodenavn:
Til slutt bør den endelige versjonen av koden se slik ut:
 
 
 
 
Universell melding
 
 
 Hvilken melding vil du vise over hvert innlegg? 
  
 
   
 
Og den endelige versjonen av siden skal se slik ut:
På dette tidspunktet er vi klar til å lagre alternativene. Nå for å gjøre dette, må vi verifisere et par ting:
 
Har brukeren tillatelse til å lagre alternativer?
 
Er det en gyldig nonce som blir sendt fra skjemaet?
 
Videre må vi:
 
Sanitiser informasjonen for å sikre at ingen skadelige data kommer inn i databasen.
 
Vi må kunne trekke denne informasjonen ut av databasen og fylle den i skjemaet.
 
Og til slutt må vi vise dette på forsiden av nettstedet.
Konklusjon
Så i de neste to artiklene skal vi fokusere på å gjøre akkurat det.
Ikke glem at du kan laste ned pluginet i sin nåværende tilstand fra dette innlegget. Når vi går gjennom serien, vil jeg gjøre den nyeste versjonen tilgjengelig på hvert innlegg slik at du vil kunne følge med koden som er dekket i hver veiledning, tinker med den og forberede spørsmål som du kanskje vil spørre i kommentarene.
Som en side notat, hvis du leter etter andre verktøy for å hjelpe deg med å bygge ut ditt voksende sett med verktøy for WordPress eller for å kodes for å studere og bli mer kjent med WordPress, ikke glem å se hva vi har tilgjengelig i Envato Market.
Husk at du kan fange alle mine kurs og opplæringsprogrammer på min profilside, og du kan følge meg på bloggen min og / eller Twitter på @tommcfarlin hvor jeg snakker om ulike programvareutviklingspraksis og hvordan vi kan bruke dem i WordPress.
Til slutt, ikke nøl med å legge igjen noen spørsmål eller kommentarer i feedet under. Jeg gjør mitt beste for å delta og svare på alle spørsmål eller kritikk du tilbyr som det gjelder dette prosjektet.
ressurser
 
Enkelt ansvar prinsipp
 
Tilpassede administrasjonsinnstillinger 1.0
 
add_options_page
 
 admin_url
 
 esc_html
 
WordPress Nonce-verdier
 



		
			
	   
	




Kode