Share
Välkommen till den andra delen av "Toolbox of the Smart WordPress Developer" -serien! I den här delen ska vi gå igenom Kirki, en bra anpassningsverktyg för WordPress-temaprojektorer.
Låt oss börja!
WordPress version 3.4 introducerade ett nytt API kallat API för temanpassning och skärmen "Tema anpassare". (I version 4.1 släpptes ordet "Theme", eftersom det inte är enbart "teman anpassare".) Det låter oss lägga till anpassningsalternativ i Utseende> Anpassa menyn, med möjlighet att ändra temainställningar samtidigt som du förhandsgranskar webbplatsen.
Det skapade inte mycket hype först, men samhället antog det med tiden, och vi blev gradvis allt mer upphetsad över det här praktiska API: n. Under två år efter det att den släppts har Customizer API utvecklats till ett underbart verktyg som även låter oss publicera inlägg och anpassa inloggningsskärmen.
Det är inte en överstatement att säga att Customizer är en av de mest värdefulla API-erna för WordPress på grund av dess förmåga att helt ändra användarnas erfarenhet.
Om du vill lära dig mer om detta ämne, kolla in vår serie på Customizer, skriven av Lee Pham.
Kirki är ett utmärkt verktyg för att förbättra upplevelsen av ett temas användare. Det fokuserar enbart på temanpassning och utökar standard Customizer-kontrollerna med växlar, intervallinmatningar och bilder som radioknappar.
När du väl vet hur det fungerar kommer det att bli enklare än någonsin att bygga en temanpassningsskärm.
Ett samtal till handling: Kirki är översättningsklar och behöver din hjälp att översätta detta open source-projekt till olika språk. Jag ska hantera den turkiska översättningen, och det skulle vara bra om du kunde hjälpa till att översätta Kirki till ditt språk. Om du vill bidra, kontakta Aristeides Stathopoulos, författare till Kirki, för detaljer.
Bundling ditt tema med Kirki är väldigt lätt, faktiskt. Du behöver bara hämta den senaste versionen från GitHub, extrahera innehållet till en mapp i ditt tema och inkludera huvud pluginfilen (genom att använda include_once () funktion) i ditt tema functions.php fil.
Här är ett exempel:
Piece of cake, eller hur? Nedanför kan du skapa en konfiguration för att undvika konflikter med andra teman eller plugins som även använder Kirki:
'edit_theme_options', 'option_type' => 'option', 'option_name' => 'my_theme',))); ?>
Gjort!
Nu har vi lärt oss hur man integrerar och konfigurerar Kirki i våra teman, det är dags att se några exempel på hur man bygger vår temanpassningssida.
Låt oss börja med grunderna. Här är koden för en grundläggande installation med vissa paneler och sektioner men utan några kontrollfält:
Accentsconagua
10, 'title' => __ ('Min titel', 'textdomän'), 'description' => __ ('Min beskrivning', 'textdomän'))); / ** * Lägg till avsnitt * / Kirki :: add_section ('custom_css', array ('title' => __ ('Custom CSS'), 'description' => __ ('Lägg till anpassad CSS här'), 'panel' => "// Inte vanligtvis behövs." Prioritet "=> 160," kapacitet "=> 'edit_theme_options', 'theme_supports' =>", // Sällsynt behövs.)); ?> Nu ska vi se om de kontrollfält som Kirki tillhandahåller.
Efter att du har skapat dina paneler och sektioner kan du fylla i sektionerna med "kontrollfält". Här är koden för att lägga till ett fält i ett avsnitt:
'text', 'setting' => 'text_demo', 'label' => __ ('Detta är etiketten', 'kirki'), 'description' => __ ('Detta är kontrollbeskrivningen', 'kirki' ), 'help' => __ ('Det här är lite extra hjälptext.', 'kirki'), 'section' => 'my_section', 'default' => __ ('Detta är standardtext', 'kirki '),' prioritet '=> 10,)); ?> Som jag sa tidigare, Kirki sträcker Lista över standard kontrollfält med nya. För att skriva en mer "komplett" handledning kommer jag att inkludera kärnkontrollfälten samt Kirkis ytterligare kontrollfält.
text kan du lägga till en enkel textinmatning.textarea kan du lägga till en textarea.redaktör kan du lägga till en WYSIWYG-redigerare.radio kan du lägga till radioknappar.checkbox kan du lägga till kryssrutor.Färg och färg-alfa (stöds genomskinlighet) kan du välja en färg med en fin färgplockare.bakgrund kan du lägga till en komplett CSS-bakgrunds anpassare.palett kan du lägga till en färgpalett.Välj kan du lägga till en rullgardinsmeny.Select2 tillåter dig att lägga till en "bättre" valmeny, som skiljer sig från standardvärdet Select2-multipel låter dig lägga till en urvalsmeny med flera val. (Wild gissning: Detta kan sammanfogas med Select2 fält i framtiden.)dropdown-pages kan du lägga till en rullgardinsmeny som anger sidorna i databasen.ladda upp kan du lägga till den ursprungliga uppladdaren.bild låter dig lägga till den inbyggda bildväljaren / uppladdaren.radio-bild låter dig lägga till bilder som fungerar som radioknappar.radio ButtonSet kan du lägga till en knappsats som fungerar som radioknappar.siffra kan du lägga till en HTML5-nummeringång.reglaget tillåter dig att lägga till en HTML5-seriereglage.multicheck kan du lägga till en lista med flera inmatningar i kryssrutan.växla låter dig lägga till en "switch" -knapp som fungerar som en kryssruta, men prettigare.toggle kan du lägga till en "växla" -knapp som också fungerar som en kryssruta.sorterbara kan du lägga till en sorterbar lista med kryssrutan kontroller.beställnings- tillåter dig att lägga till ett anpassat kontrollfält, vilket i princip är ett valfritt HTML-kodfragment.Kirki har några ganska coola inställningar för att du ska kunna göra en anpassad anpassningsanordning för ditt tema. Du kan visa en logotyp ovanför kontrollfälten, ange ett annat färgschema för anpassaren och så vidare.
logo bild: Anger logotypens bildadress.beskrivning: Anger en beskrivningstext som kommer att visas när du klickar på logotypen.color_active: Anger "aktiv" färg för menyalternativ, hjälpknappar och så.color_light: Anger "sekundär" färg för inaktiverade och inaktiva kontroller.color_select: Anger den "valda" färgen för, väl valda saker.color_accent: Anger "accent" -färgen som används på skjutreglage och bildval.color_back: Anger bakgrundsfärgen för anpassaren.url_path: Anger webbadressen för Kirki, som används för att ladda CSS-filer i dess /tillgångar/ mapp.stylesheet_id: Stilarkorts-ID som ska ställas in som handtaget i CSS-processer.För att ställa in dessa stilalternativ måste du använda Kirki / config filtrera. Här är ett exempel på hur du konfigurerar Kirki:
Du måste använda värdena i ditt tema som Kirki butiker, eller hur? Här är hur:
Enkelt som det. Självklart kan du fortfarande använda kärnan get_option () och get_theme_mod () funktioner.
Verktyg som detta gör WordPress ännu mer användarvänliga och lätta att utveckla, tycker du inte? Som sagt i serien introduceras kraften i WordPress från dess samhälle, och verktyg som detta är nyckeln till gemenskapens tillväxt. Kirki erbjuder mer än jag skrev i denna handledning, och Ari (författaren) lovar att han kommer att fortsätta att utveckla Kirki för, i hans ord, så länge som det tar.
Vad tycker du om Kirki? Skjut dina tankar i avsnittet Kommentarer 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 täcker temakontroll-plugin.
