Share
Când vine vorba de dezvoltarea temelor și pluginurilor WordPress, există o serie de moduri diferite în care dezvoltatorii își creează meniurile, opțiunile și funcționalitatea de validare. Lucrul este că există într-adevăr o singură modalitate de a face acest lucru în WordPress: API-ul Setări.
Această serie are scopul de a fi ghidul definitiv pentru modul în care puteți profita de API-ul WordPress Settings, astfel încât să aveți un singur punct de referință pentru dezvoltarea corectă a temelor și pluginurilor.
În primul articol din această serie am analizat în amănunt API-ul Settings și de ce contează. Aici, vom începe să facem scufundări în API și cum să profităm de tot ceea ce oferă.
Vom analiza unitățile fundamentale ale opțiunilor WordPress - secțiuni, câmpuri și setări - și cum să le includem în tabloul de bord WordPress nativ.
Înainte de a începe să scriem orice cod, este important să înțelegem cele trei componente principale ale API-ului pentru setările WordPress.
În acest moment, nu vă faceți griji dacă nu sunteți încă clar despre oricare dintre componentele majore. Vom analiza în detaliu fiecare componentă împreună cu un exemplu de cod sursă care leagă toate împreună.
Pentru a începe programarea în raport cu setările API, să configuram o temă de bază care poate fi utilizată în tot acest articol și în restul seriei. Tot codul sursă este disponibil și pe GitHub.
În instalarea dvs. locală de WordPress, navigați la directorul "teme" și creați un director nou, gol și numiți-l "WordPress-Settings-Sandbox". Adăugați următoarele trei fișiere:
Adăugați următorul cod în stil.css:
/ * Nume Temă: Setări WordPress URI Unei Umbre: URI-ul tău Descriere: O temă simplă folosită pentru a afișa API-ul de setări WordPress. Autor: NUMELE DUMNEAVOASTRU Autor: UTILIZATORUL VERSIUNII Versiune: 0.1 Licență: Drepturi de autor 2012 NUMELE DUMNEAVOASTRĂ (ADRESA DVS. DE EMAIL) Acest program este un software gratuit; îl puteți redistribui și / sau modifica în conformitate cu termenii GNU General Public License, versiunea 2, publicată de Fundația pentru Software Liber. Acest program este distribuit în speranța că va fi util, dar FĂRĂ NICI O GARANȚIE; fără nici măcar garanția implicită de VANDABILITATE sau de FITNESS PENTRU UN SCOP SPECIC. Pentru mai multe detalii, consultați Licența publică generală GNU. Ar fi trebuit să fi primit o copie a Licenței Publice Generale GNU împreună cu acest program; dacă nu, scrieți la Free Software Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 SUA * /
Apoi, adăugați următorul cod la index.php:
Ghidul complet al API-ului pentru setări Cutie de nisip Ștampilă cu nisip
Acesta este conținutul temei.
© Toate drepturile rezervate.
Rețineți că marcajul de mai sus este extraordinar de simplu și eu fac nu recomanda folosirea ca bază pentru dezvoltarea temelor. Este adaptat pentru această serie de articole și oferă pur și simplu mijloacele prin care vom citi valorile din API-ul Setări.
În tematică administrați ecranul, actualizați pagina și ar trebui să vedeți noua temă Sandbox. Mergeți și activați-o.
În acest moment, suntem gata să începem.
Observați în șablonul index mai sus, am definit trei regiuni de conținut specifice: antetul, conținutul și subsolul. Folosind API-ul Setări, să creăm o secțiune "Generală" care conține trei câmpuri, fiecare dintre acestea corespund uneia dintre regiunile specifice de conținut pe care tocmai le-am definit.
Înainte de a scrie orice cod, întotdeauna mi se pare util să menționez exact ce trebuie să fac. În acest caz, trebuie să facem următoarele:
Pentru a evita blocurile masive de cod și pentru a ne asigura că acoperim toate bazele noastre, vom lua fiecare dintre elementele de mai sus punct-de-punct.
Pentru a găsi secțiunea noastră generală de opțiuni, va trebui să folosim funcția add_settings_section din API-ul Setări. Conform Codului WordPress, add_settings_section necesită trei argumente:
Cu asta, să mergem mai departe și să definim secțiunea noastră. Uitați-vă la următorul cod, comentat. Adăugăm acest lucru în fișierul functions.php.
Un cuvânt despre fragmentele de cod din această serie: nu copiați și lipiți acest cod. Aveți timp să citiți fiecare linie, să vedeți cum corespund argumentele fiecărei funcții API pe care o acoperim și să urmați comentariile corespunzătoare pentru a vă asigura că vă faceți rost de ceea ce facem:
Selectați domeniile de conținut pe care doriți să le afișați.„; // end sandbox_general_options_callback?>
Are sens? În general, nu arată prea mult, ci navigați la dvs. Setări meniu și faceți clic pe General. Derulați în partea de jos a paginii și ar trebui să vedeți noua secțiune de opțiuni.
Puteți adăuga această secțiune la oricare dintre paginile de sub Setări meniul. În exemplul de mai sus, am trecut "general" ca ultimul parametru în add_settings_section, dar dacă doriți să îl adăugați la o altă pagină, puteți furniza un titlu de pagină diferit. Iată o referință pentru fiecare dintre acestea Setări pagini și cheia lor corespunzătoare:
Acum că avem o secțiune definită, putem introduce câteva opțiuni. Rețineți că în șablonul nostru index am definit trei elemente specifice ale containerului: antetul, conținutul și subsolul.
Deși vom introduce mai multe opțiuni pe parcursul acestei serii, astăzi vom introduce o modalitate de a comuta vizibilitatea fiecăruia dintre elementele de mai sus.
Similar cu ceea ce am făcut cu secțiunea de setări, îmi place să prezint exact ceea ce trebuie să facem înainte de a scrie orice cod. De vreme ce vom trece la fiecare zonă de conținut ...
În acest moment, suntem gata să introducem primul câmp de setări. Pentru aceasta, vom folosi funcția add_settings_field. Această funcție are șase parametri (patru necesare, două opționale). Ele sunt după cum urmează:
Cu asta a spus, să mergem mai departe și să definim primul câmp de setare. Mai specific, vom introduce o opțiune pentru a comuta vizibilitatea antetului.
Mai întâi, efectuăm un apel la add_settings_field chiar sub apelul funcției add_settings_section în funcția de inițializare pe care am scris-o în prima parte a tutorialului. Examinați fiecare rând și comentariile pentru fiecare opțiune:
Accentsconagua
// Apoi vom introduce câmpurile pentru a comuta vizibilitatea elementelor de conținut. add_settings_field ('show_header', // ID utilizat pentru a identifica câmpul în întreaga temă 'Header', // Eticheta din stânga elementului de interfață cu opțiunea 'sandbox_toggle_header_callback', // Numele funcției responsabile pentru redarea interfeței opțiunii 'general', // Pagina pe care va fi afișată această opțiune 'general_settings_section', // Numele secțiunii căreia îi aparține acest câmp array (// Matricea argumentelor care trec la callback.) În acest caz, doar o descriere. "Activați această setare pentru a afișa antetul.")); Apoi, definim apelul invers menționat în funcția de mai sus. Acest apel de apel este utilizat pentru a face caseta de selectare și descrierea din pagina de administrare:
/ ** * Această funcție transformă elementele de interfață pentru a comuta vizibilitatea elementului antet. * * Acceptă o serie de argumente și se așteaptă ca primul element din matrice să fie descrierea * care va fi afișată lângă caseta de selectare. * / function sandbox_toggle_header_callback ($ args) // Rețineți că ID-ul și atributul name al elementului ar trebui să se potrivească cu cel al ID-ului în apel la add_settings_field $ html = '„; // Aici vom lua primul argument al matricei și îl vom adăuga la o etichetă de lângă caseta de selectare $ html = = '„; echo $ html; // end sandbox_toggle_header_callback
În ceea ce privește caseta de selectare, acordați atenție comentariilor, dar nu vă faceți griji prea multe despre unele dintre atributele pe care nu le recunoașteți (cum ar fi un apel la funcția checked ()). Mai târziu, în această serie, vom examina fiecare element de intrare și funcțiile de ajutor ale acestuia.
Până acum, fișierul functions.php ar trebui să arate astfel:
Selectați domeniile de conținut pe care doriți să le afișați.„; // end sandbox_general_options_callback / * ------------------------------------------- ----------------------------- * * Fieldback callbacks * ---------------- -------------------------------------------------- ------ * / / ** * Această funcție transformă elementele de interfață pentru a comuta vizibilitatea elementului antet. * * Acceptă o serie de argumente și se așteaptă ca primul element din matrice să fie descrierea * care va fi afișată lângă caseta de selectare. * / function sandbox_toggle_header_callback ($ args) // Rețineți atributul ID și atributul nume al potrivirii elementului cel al ID-ului în apel la add_settings_field $ html = '„; // Aici vom lua primul argument al matricei și îl vom adăuga la o etichetă de lângă caseta de selectare $ html = = '„; echo $ html; // end sandbox_toggle_header_callback?>
În acest moment, actualizați setari generale pagină. Ar trebui să vedeți caseta de validare cu eticheta "Header" și o descriere lângă caseta de selectare.
Din păcate, nu salvează de fapt valoarea în baza de date.
Pentru ca câmpurile noastre să fie salvate în baza de date, trebuie să le înregistrăm cu WordPress. Făcând acest lucru este relativ ușor - trebuie doar să profităm de funcția register_setting.
Această funcție acceptă trei argumente (două obligatorii, una opțională):
În acest moment, să înregistrăm setarea pe care tocmai am creat-o. Uitați-vă la codul de mai jos. Adăugați această linie de cod direct sub apelul la add_settings_field în funcția de inițializare pe care am definit-o mai devreme în articol. Este, probabil, cel mai ușor de urmat din toate fragmentele din acest articol:
// În cele din urmă, înregistrăm câmpurile cu WordPress register_setting ('general', 'show_header'); Încercați-l - bifați caseta de selectare, dați clic pe "Salvați modificările" și observați că atunci când pagina se reface, opțiunea sa modificat. Debifați caseta de selectare, salvați și vizionați-o salvată.
Destul de ușor, corect?
Încă mai trebuie să introducem opțiunile pentru a comuta vizibilitatea zonei de conținut și a subsolului. Este aproape exact același lucru cu modul în care am setat opțiunea pentru comutarea antetului.
Mai întâi, să definim câmpul pentru afișarea zonei de conținut. Aceasta va merge sub primul apel la add_settings_field:
add_settings_field ('show_content', 'Content', 'sandbox_toggle_content_callback', 'general', 'general_settings_section', array ('Activați această setare pentru a afișa conținutul.')); Și să setăm funcția de apel invers:
funcția sandbox_toggle_content_callback ($ args) $ html = '„; $ html. = '„; echo $ html; // end sandbox_toggle_content_callback
Apoi, definim câmpul pentru afișarea zonei subsolului:
add_settings_field ('show_footer', 'Footer', 'sandbox_toggle_footer_callback', 'general', 'general_settings_section', array ('Activați această setare pentru a afișa subsolul.')); Și configurați și callback-ul pentru acest câmp:
funcția sandbox_toggle_footer_callback ($ args) $ html = '„; $ html. = '„; echo $ html; // end sandbox_toggle_footer_callback
În cele din urmă, să înregistrăm aceste două câmpuri noi cu WordPress. Aceste două apeluri de funcții merg în partea de jos a funcției de inițializare pe care am definit-o mai devreme în articol.
register_setting ('general', 'show_content'); register_setting ('general', 'show_footer'); Versiunea finală a funcțiilor.php ar trebui să arate astfel:
Selectați domeniile de conținut pe care doriți să le afișați.„; // end sandbox_general_options_callback / * ------------------------------------------- ----------------------------- * * Fieldback callbacks * ---------------- -------------------------------------------------- ------ * / / ** * Această funcție transformă elementele de interfață pentru a comuta vizibilitatea elementului antet. * * Acceptă o serie de argumente și se așteaptă ca primul element din matrice să fie descrierea * care va fi afișată lângă caseta de selectare. * / function sandbox_toggle_header_callback ($ args) // Rețineți atributul ID și atributul nume al potrivirii elementului cel al ID-ului în apel la add_settings_field $ html = '„; // Aici vom lua primul argument al matricei și îl vom adăuga la o etichetă de lângă caseta de selectare $ html = = '„; echo $ html; // end sandbox_toggle_header_callback funcția sandbox_toggle_content_callback ($ args) $ html = '„; $ html. = '„; echo $ html; // end sandbox_toggle_content_callback funcția sandbox_toggle_footer_callback ($ args) $ html = '„; $ html. = '„; echo $ html; // end sandbox_toggle_footer_callback?>
Acum reîmprospătați setari generale pagina și observați că aveți toate cele trei casete de selectare complet funcționale.
Ce bune sunt opțiunile dacă nu le putem profita de tema sau pluginul nostru? Trebuie să putem citi valorile pentru a gestiona corect noile noastre opțiuni.
Pentru a face acest lucru, trebuie să folosim funcția get_option. Această funcție acceptă două argumente (una obligatorie, una opțională):
În primul rând, să încercăm să comutați vizibilitatea antetului. În șablonul index creat mai devreme în acest articol, localizați elementul cu ID-ul antetului. Ar trebui să arate astfel:
Ștampilă cu nisip
Apoi, să facem un apel pentru get_option în contextul unei condiționări. Dacă evaluarea condiționată este adevărată (adică opțiunea a fost verificată pe setari generale pagina), atunci elementul va fi afișat; în caz contrar, elementul nu va fi afișat.
Ștampilă cu nisip
După aceea, sperați la setari generale , verificați opțiunea pentru ascunderea elementului antet și actualizați-vă pagina de pornire. Elementul antet ar trebui să nu mai apară.
În acest moment este o simplă chestiune de repetare a procesului pentru conținutul și subsolul elementului. Trebuie să înfășurăm elementele de conținut și subsol cu condiționalități care evaluează rezultatul apelurilor get_option.
Aruncati o privire:
Acesta este conținutul temei.
© Toate drepturile rezervate.
Reveniți la setari generale pagina, comutați cu fiecare casetă de selectare și actualizați pagina temei. Elementele voastre ar trebui să treacă independent una de cealaltă.
Atât deocamdată! Am analizat toate funcțiile necesare introducerii de noi secțiuni, câmpuri și setări în WordPress. Desigur, mai sunt mult de acoperit.
În următorul articol, vom examina cum să adăugăm elemente de meniu personalizate în meniul WordPress și cum putem introduce propriile pagini în Tabloul de bord al WordPress.
Am acoperit o mulțime de materiale în acest articol. Iată o referință pentru tot ce am folosit în acest articol.
