När det gäller att utveckla WordPress-teman och plugins finns det ett antal olika sätt att utvecklare skapar sina menyer, alternativ och valideringsfunktionalitet. Saken är det finns egentligen bara ett sätt att ordentligt göra detta inom WordPress: Settings API.
Denna serie syftar till att vara den slutgiltiga guiden för hur du utnyttjar WordPress Settings API så att du har en enda referenspunkt för att korrekt utveckla dina teman och plugins.
I den första artikeln i denna serie tog vi en bred titt på inställnings API och varför det spelar roll. Här ska vi börja dyka in i API: n och hur vi kan utnyttja allt som det erbjuder.
Vi tar en titt på de grundläggande enheterna i WordPress-alternativen - sektioner, fält och inställningar - och hur du kan inkludera dem i det inbyggda WordPress Dashboard.
Innan vi skriver in någon kod, är det viktigt att förstå de tre huvudkomponenterna i WordPress Settings API.
Oroa dig inte om du fortfarande är oklart om någon av huvudkomponenterna. Vi ska ta en djupgående titt på varje komponent tillsammans med exempelkodskoden som binder samman allt.
För att komma igång med programmering mot inställnings API, låt oss konfigurera ett grundläggande tema som kan användas i hela den här artikeln och resten av serien. Allt källkod finns också på GitHub.
I din lokala installation av WordPress, navigera till "teman" -katalogen och skapa en ny, tom katalog och kalla den "WordPress-Settings-Sandbox". Lägg till följande tre filer:
Lägg till följande kod i style.css:
/ * Tema Namn: WordPress Inställningar Sandbox Tema URI: DIN URI Beskrivning: Ett enkelt tema som används för att visa WordPress Settings API. Författare: DITT NAMN Författare URI: DIN WEBBPLATS Version: 0.1 Licens: Copyright 2012 DITT NAMN (DIN E-POSTADRESS) Detta program är fri programvara; Du kan omfördela det och / eller ändra det enligt villkoren i GNU General Public License, version 2, som publicerad av Free Software Foundation. Programmet distribueras i hopp om att det kommer att vara användbart, men UTAN NÅGOT GARANTI. utan ens den underförstådda garantin om SÄLJBARHET eller EGNETHET FÖR ET SÄRSKILT SYFTE. Se GNU General Public License för mer information. Du borde ha fått en kopia av GNU General Public License tillsammans med det här programmet. om inte, skriv till Free Software Foundation, Inc., 51 Franklin St, Fifth Floor, Boston, MA 02110-1301 USA * /
Lägg sedan till följande kod på index.php:
Den fullständiga guiden till inställnings API | Sandbox Tema Sandbox Header
Detta är temat innehåll.
© Alla rättigheter förbehållna.
Observera att ovanstående markering är utomordentligt enkel och jag gör det inte rekommendera att använda detta som grund för temat utveckling. Den är skräddarsydd för denna serie artiklar och tillhandahåller helt enkelt de medel som vi kommer att läsa värden från inställnings API.
I teman administrationsskärm, uppdatera sidan och du bör se det nya Sandbox-temat visas. Gå vidare och aktivera det.
Vid den här tiden är vi redo att komma igång.
Observera i indexmallen ovan, vi har definierat tre specifika innehållsregioner: rubrik, innehåll och sidfot. Med hjälp av inställnings API, låt oss skapa en "Allmänt" -avdelning som innehåller tre fält, som var och en motsvarar ett av de specifika innehållsregioner som vi just definierat.
Innan jag skriver någon kod, tycker jag alltid att det är bra att lista exakt vad jag behöver göra. I det här fallet måste vi göra följande:
För att undvika massiva block av kod och för att se till att vi täcker alla våra baser tar vi var och en av de ovanstående punkterna punkt för punkt.
För att hitta vårt avsnitt "Allmänt", måste vi använda funktionen add_settings_section i inställnings API. Enligt WordPress Codex kräver add_settings_section tre argument:
Med det, låt oss gå vidare och definiera vår del. Ta en titt på följande kommenterade kod. Vi lägger till detta i vår functions.php-fil.
Ett ord om kodproverna i denna serie: Kopiera inte och klistra in den här koden. Ta dig tid att läsa varje rad, se hur argumenten motsvarar varje API-funktion som vi täcker och följ motsvarande kommentarer för att du ska hänga på vad vi gör:
Välj vilka innehållsområden du vill visa.'; // slut sandbox_general_options_callback?>
Vettigt? Generellt sett ser det inte ut som mycket men navigerar till din inställningar menyn och klicka på Allmän. Bläddra till undersidan av sidan och du bör se din nya del av alternativen.
Du kan lägga till det här avsnittet på någon av sidorna under inställningar meny. I ovanstående exempel har vi passerat "generellt" som den sista parametern till add_settings_section, men om du vill lägga till den på en annan sida kan du ge en annan sidtitel. Här är en referens för var och en av inställningar sidor och deras motsvarande nyckel:
Nu när vi har en sektion definierad, kan vi introducera några alternativ. Minns att i vår indexmall vi definierade tre specifika behållarelement: rubrik, innehåll och sidfot.
Även om vi kommer att introducera fler alternativ under hela serien, kommer vi idag att presentera ett sätt att växla synligheten för var och en av de ovanstående elementen.
I likhet med vad vi gjorde med inställningsdelen, tycker jag om att lista ut exakt vad vi behöver göra innan du skriver någon kod. Eftersom vi kommer att byta till var och en av innehållsområdena ...
Vid denna tidpunkt är vi redo att presentera det första inställningsfältet. För att göra detta använder vi funktionen add_settings_field. Denna funktion tar sex parametrar (fyra krävs, två valfria). De är som följer:
Med det sagt, låt oss gå vidare och definiera vårt första inställningsfält. Specifikt introducerar vi ett alternativ för att växla upp synligheten för rubriken.
Först gör vi ett samtal till add_settings_field strax under add_settings_section funktionssamtalet i den initialiseringsfunktion som vi skrev i den första delen av handledningen. Granska varje rad och kommentarer för varje alternativ:
// Nästa kommer vi att introducera fälten för att byta synlighet av innehållselement. add_settings_field ('show_header', // ID som användes för att identifiera fältet under temat 'Header', // Märken till vänster om alternativgränssnittselementet 'sandbox_toggle_header_callback', // Namnet på funktionen som ansvarar för att göra alternativgränssnittet 'General', // Den sida på vilken det här alternativet kommer att visas 'general_settings_section', // Namnet på den sektion som detta fält hör till array (// En rad argument som ska skickas till återuppringningen. I det här fallet bara en beskrivning. 'Aktivera denna inställning för att visa rubriken.'));
Därefter definierar vi den återuppringning som avses i ovanstående funktion. Den här återuppringningen används för att göra kryssrutan och beskrivningen på administrationssidan:
/ ** * Den här funktionen gör gränssnittselementen för att växla synligheten för huvudelementet. * * Den accepterar en rad argument och förväntar sig att det första elementet i arrayen är beskrivningen * som ska visas bredvid kryssrutan. * / funktion sandbox_toggle_header_callback ($ args) // Observera ID och attributets namn ska matcha det för ID i samtalet till add_settings_field $ html = ''; // Här kommer vi att ta det första argumentet i arrayen och lägga till det i en etikett bredvid kryssrutan $ html. = ''; echo $ html; // slut sandbox_toggle_header_callback
När det gäller kryssrutan, var uppmärksam på kommentarerna, men oroa dig inte för mycket om några attribut som du inte känner igen (till exempel ett samtal till funktionen kontrollerad). Senare i denna serie ska vi titta på varje inmatningselement och deras motsvarande hjälparfunktioner.
Nu ska din functions.php-fil se ut så här:
Välj vilka innehållsområden du vill visa.'; // slut sandbox_general_options_callback / * ------------------------------------------- ----------------------------- * * Fältuppringningar * ---------------- -------------------------------------------------- ------ * / / ** * Den här funktionen gör gränssnittselementen för att byta synlighet för huvudelementet. * * Den accepterar en rad argument och förväntar sig att det första elementet i arrayen är beskrivningen * som ska visas bredvid kryssrutan. * / funktion sandbox_toggle_header_callback ($ args) // Notera ID och attributets namnbeteckning matchar ID-numret i samtalet till add_settings_field $ html = ''; // Här kommer vi att ta det första argumentet i arrayen och lägga till det i en etikett bredvid kryssrutan $ html. = ''; echo $ html; // slut sandbox_toggle_header_callback?>
Uppdatera nu den här Allmänna Inställningar sida. Du bör se din kryssruta med etiketten "Header" och en beskrivning bredvid kryssrutan.
Tyvärr lagrar det faktiskt inte värdet till databasen ännu.
För att få våra fält att faktiskt spara till databasen måste vi registrera dem med WordPress. Att göra detta är relativt enkelt - vi behöver bara dra nytta av register_setting funktionen.
Den här funktionen accepterar tre argument (två krävs, en valfri):
Låt oss nu registrera inställningen som vi just har skapat. Ta en titt på koden nedan. Lägg till den här koden direkt under samtalet till add_settings_field i initialiseringsfunktionen som vi definierade tidigare i artikeln. Det är utan tvekan det enklaste att följa av alla utdrag i den här artikeln:
// Slutligen registrerar vi fälten med WordPress register_setting ('general', 'show_header');
Prova det - markera kryssrutan, klicka på "Spara ändringar" och märk att när sidan uppdateras har alternativet ändrats. Avmarkera kryssrutan, spara och kolla på det spara.
Lätt nog, höger?
Vi behöver fortfarande presentera alternativen för att skicka synligheten för innehållsområdet och sidfoten. Det är nästan exakt detsamma som hur vi ställer in alternativet för att växla rubriken.
Låt oss först definiera fältet för att visa innehållsområdet. Detta kommer att gå under det första samtalet till add_settings_field:
add_settings_field ('show_content', 'Content', 'sandbox_toggle_content_callback', 'general', 'general_settings_section', array ('Aktivera denna inställning för att visa innehållet.'));
Och låt oss konfigurera återuppringningsfunktionen:
funktion sandbox_toggle_content_callback ($ args) $ html = ''; $ html. = ''; echo $ html; // slut sandbox_toggle_content_callback
Låt oss sedan definiera fältet för visning av sidfältet:
add_settings_field ('show_footer', 'Footer', 'sandbox_toggle_footer_callback', 'general', 'general_settings_section', array ('Aktivera denna inställning för att visa sidfoten'));
Och ställ in återuppringningen för det här fältet också:
funktion sandbox_toggle_footer_callback ($ args) $ html = ''; $ html. = ''; echo $ html; // slut sandbox_toggle_footer_callback
Till sist, låt oss registrera dessa två nya fält med WordPress. Dessa två funktionssamtal går längst ner i initialiseringsfunktionen som vi definierade tidigare i artikeln.
register_setting ('general', 'show_content'); register_setting ('general', 'show_footer');
Den slutliga versionen av functions.php ska se så här ut:
Välj vilka innehållsområden du vill visa.'; // slut sandbox_general_options_callback / * ------------------------------------------- ----------------------------- * * Fältuppringningar * ---------------- -------------------------------------------------- ------ * / / ** * Den här funktionen gör gränssnittselementen för att byta synlighet för huvudelementet. * * Den accepterar en rad argument och förväntar sig att det första elementet i arrayen är beskrivningen * som ska visas bredvid kryssrutan. * / funktion sandbox_toggle_header_callback ($ args) // Notera ID och attributets namnbeteckning matchar ID-numret i samtalet till add_settings_field $ html = ''; // Här kommer vi att ta det första argumentet i arrayen och lägga till det i en etikett bredvid kryssrutan $ html. = ''; echo $ html; // slut sandbox_toggle_header_callback funktion sandbox_toggle_content_callback ($ args) $ html = ''; $ html. = ''; echo $ html; // slut sandbox_toggle_content_callback funktion sandbox_toggle_footer_callback ($ args) $ html = ''; $ html. = ''; echo $ html; // slut sandbox_toggle_footer_callback?>
Uppdatera nu Allmänna Inställningar sida och märker att du har alla tre funktionella kryssrutor.
Vad bra är alternativ om vi inte kan utnyttja dem genom vårt tema eller plugin? Vi måste kunna läsa värdena för att kunna hantera våra nya alternativ.
För att göra detta måste vi använda get_option-funktionen. Den här funktionen accepterar två argument (en krävs, en valfri):
Låt oss först försöka ändra siktens synlighet. I den indexmall som vi skapade tidigare i den här artikeln, leta reda på elementet med sidhuvudets ID. Det ska se ut så här:
Sandbox Header
Låt oss nu ringa till get_option i samband med en villkorlig. Om villkoret utvärderar till sant (det vill säga alternativet har kontrollerats på Allmänna Inställningar sida), så kommer elementet att visas; annars kommer inte elementet att visas.
Sandbox Header
Efter det hoppas över till Allmänna Inställningar sida, kolla alternativet för att gömma rubrikelementet och uppdatera startsidan. Rubrikelementet ska inte längre visas.
Vid det här laget är det en enkel fråga om att upprepa processen för innehållet och sidfoten. Vi behöver lägga in innehålls- och sidfotelementen med villkor som utvärderar resultatet av get_option-samtal.
Ta en titt:
Detta är temat innehåll.
© Alla rättigheter förbehållna.
Revisit Allmänna Inställningar sida, välj varje kryssruta och uppdatera temasidan. Dina delar borde vända sig oberoende av varandra.
Det är det för nu! Vi har tittat på alla funktioner som krävs för att införa nya avsnitt, fält och inställningar i WordPress. Självklart finns det mycket mer att täcka.
I nästa artikel tar vi en titt på hur man lägger till anpassade menyalternativ på WordPress-menyn och hur vi kan introducera våra egna sidor till WordPress Dashboard.
Vi täckte mycket material i den här artikeln. Här är en referens till allt som vi använde i hela denna artikel.