Kom ihåg de tider när vi behövde skapa sidor för alternativ för våra teman? Självklart gör du det, för att vi fortfarande behöver dem! När Customizer of WordPress blir kort att hantera är du tematets funktionalitet, du måste skapa en extra Options-sida för att ge en bättre upplevelse för dina användare.
Medan det alltid är ett alternativ att skapa dessa alternativpaneler från början, är det bättre att använda de redan uppfunna hjulen. I den här delen av "Toolbox of the Smart WordPress Developer" -serien ska vi gå igenom Vafpress, en solid WordPress-ram för teman för ditt nästa temaprojekt.
Tid för lite kontrovers: Jag tror inte att Customizer är redo för teman - än.
Även om jag erkänner att Customizer är helt enkelt en grymt bra verktyg, jag kan också se att det bara inte är det kvalificerad att tjäna all funktionalitet till och med ett enkelt mångsidigt tema. Jag vet, jag vet att mångsidiga teman är själsliga, kapitalistiska teman som förstör WordPresss värld ... eller är de? Jag menar att det skulle vara bättre om enstaka teman var mer populära, men kan vi ignorera det faktum att mångsidiga teman är det allra första valet av de flesta designbyråer, frilansare och till och med nybörjare WordPress-användare som vill bygga en webbplats för sina företag?
I slutet av dagen måste vi fråga oss för att förstå behovet av temainställningsramar mot Customizer: WordPress för WordPress skull eller WordPress för människors skull? Medan jag stöder WordPress blir mer och mer standardiserad i olika aspekter tror jag också att vi inte kan ignorera kraven från användargemenskapen i WordPress. Om vi utvecklarar ignorerar användarnas krav, skulle WordPress inte ha vuxit så stort som det är nu.
Dessutom tror jag inte att Customizer skulle vara tillräckligt för enstaka teman antingen (ännu). Vi har inte ens ett standardiserat och centraliserat sätt att bygga innehållsdelar (till exempel skjutreglage, menyer och så vidare) och vad du än säger mot detta, gör WordPress-användare (och kommer alltid) ett enda gränssnitt för att styra deras teman.
Jag håller det här avsnittet kort, eftersom ämnet är Vafpress som ett WordPress-utvecklingsverktyg och jag kan prata om "Customizer versus teman options framework" för ett tusen ord. Men låt mig inte klippa den kort, håll dig från att kommentera: Jag skulle gärna höra din ta på det här!
Det är oundvikligt att säga just nu, men det är vanligt att öppna varje avsnitt med en enkel introduktion: Vafpress är en temainställningsram. Och en mycket bra, jag borde säga. Skapat av Vafour, ett indonesiskt webbutvecklingsteam, påstår Vafpress att Att bygga ett WordPress-tema har aldrig varit enklare och snabbare.
Hämta bara Vafpress från dess officiella nedladdningssida eller dess GitHub-arkiv, och låt oss snabbt komma till de bra delarna.
Från och med den dag jag skriver denna handledning har Vafpress 19 kontrollfält uppdelade i två kategorier som heter "Fields" och "Multifields".
textruta
: Genererar en textinmatning.textarea
: Genererar en textarea
fält.toggle
: Genererar en ja / nej växel.reglaget
: Genererar en radreglage.ladda upp
: Genererar ett uppladdningsfält med WordPress Media Manager.Färg
: Genererar en färgplockare.datum
: Genererar en datumväljare.codeeditor
: Genererar en kodredigerare.wpeditor
: Genererar en WYSIWYG-redigerare.fontawesome
: Genererar en ikonplockare med hjälp av Font Awesome.notebox
: Genererar ett fält som du kan använda för att informera ditt tema användare.html
: Gör att du kan visa anpassad HTML-kod.Välj
: Genererar en enkel
fält.flera val
: Genererar en flervalsmeny.checkbox
: Genererar en grupp av kryssrutor.checkimage
: Genererar en grupp valbara bilder, som fungerar som kryssrutor.Radio knapp
: Genererar en grupp radioknappar.radioimage
: Genererar en grupp valbara bilder, som fungerar som radioboxar.sorterare
: Genererar ett sorterbart multiselektfält.Det skulle inte vara rätt om jag inte avslutade det här avsnittet utan ett exempel - låt oss göra en enkel, enkel. Följande kodkoder skapar ett fält för färgväljare:
array (array ('typ' => 'färg', 'name' => 'example_color_picker', 'label' => 'Color Picker', 'description' => 'Ange en färg för dina rubriker här!', 'default '=>' rgba (255,255,255, .75) ',' format '=>' hex ',), array (// annat fält)
Denna del kan vara knepig först, men den har en smidig inlärningskurva.
Alternativpanelen som vi kan skapa med Vafpress består av ett par byggstenar:
Låt oss börja med att se konstruktionen av "options page builder":
false, // namnet på inställningarna i databasen 'option_key' => 'vpt_option', // släkten på din options sida 'page_slug' => 'vpt_option', // sökväg till mallfilen eller matrisen '=> get_template_directory (). '/options-template.php', // föräldra menysida 'menu_page' => 'themes.php', // avgör om man automatiskt ska namnge menyer eller inte 'use_auto_group_naming' => true, // show (som standard) eller göm "Exportera / Importera" sidan "use_exim_menu '=> true, // minsta användarroll för att visa alternativpanelen' minimum_role '=>' edit_theme_options ', // typ av layouten (standard som standard)' layout '=> 'fixed', // titel på optionsidan 'page_title' => __ ('Temaalternativ', 'vp_textdomain'), / / Huvudmenyalternativets titel 'menu_label' => __ ('Temaalternativ', 'vp_textdomän '),)); // koppla den till after_setup_theme action add_action ('after_setup_theme', 'my_options')?>
En bra sak om "options page builder" är att du kan peka på en separat fil där du håller alla dina menyer (och sektioner i menyerna och fält i sektionerna). I exemplet ovan pekade vi på en mallfil kallad alternativ-template.php
. Låt oss se vad du ska fylla den filen med:
__ ('Vafpress Option Panel', 'vp_textdomain'), 'logo' => "," menyer "=> array (array ('title' => __ ('Special Controls', 'vp_textdomain'), 'name' > 'menu_2', 'icon' => '/icon/special.png', 'controls' => array (// ... samling av sektioner och eller kontrollfält ...),),));
Om du vill kan du också göra några "nestade menyer":
__ ('Vafpress Option Panel', 'vp_textdomain'), 'logo' => ", 'menyer' => array (array ('title' => __ ('Standard HTML Controls', 'vp_textdomain'), => 'menu_1', 'icon' => 'font-awesome: ikon-magic', 'menyer' => array (array ('title' => __ ('Regular', 'vp_textdomain'), 'name' = > 'submenu_1', 'icon' => 'font-awesome: ikon-th-large', 'controls' => array (// ... samling av sektioner och eller kontrollfält ...), array > __ ('Image', 'vp_textdomain'), 'namn' => 'submenu_2', 'icon' => 'font-awesome: ikon-bild', 'controls' => array (// ... samling av sektioner och eller Kontrollfält ...),),),),));?>
Och inuti matrisen av 'kontroller'
argument, vi använder något som följande:
array (array ('title' => __ ('TextBox och TextArea', 'vp_textdomain'), 'name' => 'section_1', 'description' => __ ('TextBox och TextArea Showcase', 'vp_textdomain') 'fields' => array (// ... samling av kontrollfält ...),),)?>
Igen kan det här ta lite övning först, men det är en promenad i parken när du vinner dig.
Alla dessa funktioner borde räcka för ett ramverk som Vafpress, men Vafpress slutar inte där-det har ett par fler knep upp på ärmen:
Det finns mycket du kan uppnå med Vafpress-mer än vad vi har täckt här i denna handledning. Var noga med att kolla in Vafpress-dokumentationen för att lära dig mer om det.
Vad tycker du om Vafpress? Tror du att du kommer att ge det en chans i ditt nästa temaprojekt? Berätta vad du tycker i kommentarfältet nedan. Och om du gillade artikeln, glöm inte att dela den med dina vänner!
Vi ses i nästa del där vi ska gå över CMB2, en metabox, anpassade fält och formulär bibliotek för WordPress.