Standard WordPress-temaet i 2014 var Tyve Fifteen, en skabelon med et fast sidebjælke til venstre, der bliver til en sidehoved i mobilvisning, et minimalt sidefodsområde, god typografi og et flot fremhævet billedområde. Siden da har vi set frigivelsen af TwentySixteen, TwentySeventeen, TwentyEighteen, TwentyNineteen og det nuværende defualt gratis tema TyveTyve.
Disse temaer er fantastiske, de gennemgår en hel proces for at blive valgt som standard WordPress-tema, men vi kan forstå, at brugerne stadig vil tilpasse det og gøre det til deres eget.
Da disse temaer typisk tilbyder nogle begrænsninger, såsom et enkelt sidebjælke (som kaldes widget-klar område i WordPress), viser vi dig, hvordan du tilføjer en widget til sidefoden, eller hvordan du tilpasser koden for ethvert tema for at tilføje flere widgetområder til et tema.
Tilføjelse af et widgetområde til TwentyFifteen to TwentyTwenty footer adskiller sig ikke fra at tilføje et widgetområde i de fleste WordPress-temaer.
Hvis du er interesseret i at se andre WordPress -temaer, anbefaler vi at se på andre populære temaer som Divi from Elegant Themes. Se vores fulde anmeldelse her.
Opret et WordPress-barnetema
Når du tilpasser et WordPress-temas skabelonfiler til at oprette et widgetområde, er det god praksis at oprette en barn tema.
Konceptet med et børnetema er ret ligetil - vi ønsker ikke at bryde muligheden for at opgradere temaet til nogen nyudgivne versioner.
Når du opretter tilpasninger til et underordnet tema, tilføjes dine ændringer til underordnet tema snarere end til det oprindelige tema. Når en opdateret version af det originale tema er ude, kan du opdatere din kopi af det originale tema og lade dine ændringer være intakte i underordnet tema.
Hvis du ønsker at lære flere tips og tricks i forbindelse med WordPress, kan du besøge resten af afsnittet om CollectiveRay.
1. Opret underordnet tema-bibliotek og filer
Som et første trin skal du oprette en mappe inde i wp-indhold> temaer folder. Ring til mappen tyve femten-barn, tyveogtyve-barn. Det er vigtigt, at barnetemaet følger navngivningskonventionen for forældrene dem dog.
Så hvis forældrene kaldes tyveogtreds, skal barnet kaldes tyve femten-barn. Ligeledes, hvis det tema, du tilpasser, kaldes tyveogtyve, bør barnetemaet kaldes tgik tyve-barn.
Når du har oprettet underordnet tema, skal du oprette to ekstra filer.
Den fil, der skal bruges til at udføre ændringer i CSS-stilarter, skal kaldes style.css. Vi har også brug for functions.php fil til underordnet tema, hvor vi kan tilføje visse nødvendige funktioner.
Disse to filer går inde i mappen med XNUMX børn eller den respektive mappe, du har oprettet til barnetemaet.
2. Tilføj filen til WordPress-widgetområdet (i sidefoden eller hvor du foretrækker det)
Fordi widgetområdet skal føjes til temaet sidefod, skal du have en fil til sidefodskoden.
Den sikreste måde at kode en WordPress-skabelonfil på er at starte fra en færdiglavet skabelon og derefter tilføje det, du vil have, og / eller slette det, du ikke ønsker.
I dette tilfælde skal du tage footer.php fra Twenty Fifteen-temaet eller Twenty Twenty-temaet eller hvad det tema, du tilpasser, kaldes og indsæt det i dit barns tema.
3. Tilføj kode til barnets temafiler for at oprette widgeten
Lige nu har vi kun tomme filer, så som det er, kan barnetemaet ikke gøre noget.
For at vi skal kunne foretage ændringer, har et arbejdende barn-tema brug for nogle kommentarer øverst på style.css. Åben style.css i din foretrukne kodeditor og tilføj denne bit kode.
/*Theme Name: Twenty Fifteen ChildTheme URI: http://example.com/twenty-fifteen-child/Description: Twenty Fifteen Child ThemeAuthor: John DoeAuthor URI: http://example.comTemplate: twentyfifteenVersion: 1.0.0License: GNU General Public License v2 or laterLicense URI: http://www.gnu.org/licenses/gpl-2.0.htmlTags: light, dark, two-columns, right-sidebar, responsive-layout, accessibility-readyText Domain: twentyfifteenchild*/
Den virkelig vigtige del her er i Skabelon så i ovenstående eksempel er det Skabelon: tyveogtreds. Dette instruerer WordPress om navnet på det overordnede tema.
Sørg for, at navnet er nøjagtigt det samme som det overordnede temas mappenavn (store bogstaver eller mellemrum, bindestreger, understregninger osv. Er vigtige: alt skal matche nøjagtigt det overordnede temas mappenavn).
Åbn derefter functions.php og tilføj følgende bit kode.
Selvom dette trin ikke er strengt obligatorisk, anbefales det stærkt, fordi barnets tema med denne kode arver dets forældres udseende.
Så lad os skrive en funktion, der hænger i wp_enqueue_scripts () action hook. Inde i funktionen dig enqueue det overordnede temas stilark ved hjælp af wp_enqueue_style () funktion.
Dette sikrer, at barnetemaet arver forældrenes stilarter, mens det tilsidesætter en bestemt stilregel i sig selv style.css fil.
<?php
//Importér overordnede typografier på den rigtige måde og tilføj andre typografiark, hvis det er nødvendigt.
function twenty_fifteen_child_styles() {
wp_enqueue_style( 'parent-style', get_template_directory_uri().'/style.css' );
}
add_action( 'wp_enqueue_scripts', 'twenty_fifteen_child_styles');
Dit barns tema er for det meste færdigt!
Adgang til Temaer panel i din WordPress-installation, og du bør se dit Twenty Fifteen Child-tema klar til brug. Klik på Aktivere og besøg dit websted. Det skal se nøjagtigt ud som det overordnede tema.
Tilføjelse af widgetområdet
Nu skal vi tilføje koden for at definere sidefods-widgetområdet. Her er det uddrag, der går ind i functions.php.
/ ** * Registrer sidefod widgetområde. * * @since Twenty Fifteen Child 1.0 * * @link https://codex.wordpress.org/Function_Reference/register_sidebar * / function twentyfifteen_child_widgets_init () {register_sidebar (array ('name' => __ ('Footer Widgets', 'tyve) -fifteen-child '),' id '=>' sidebar-2 ',' description '=> __ (' Tilføj widgets her for at blive vist i dit sidefodsområde. ',' femogtyve-barn '),' before_widget ' => ' ',' after_widget '=>' ',' before_title '=>' ',' after_title '=>' ',)); } add_action ('widgets_init', 'twentyfifteen_child_widgets_init');
Koden ovenfor tilføjer en funktion, der registrerer et sidebjælke med sidebjælke-ID'et (temaet Tyve Femten har allerede et sidebjælke med ID'et for sidebjælke-2), og derefter tilslutter denne funktion til widgets_init () actionkrog.
Lad os derefter gå videre og tilføje det nye sidebjælke til sidefoden. Åben footer.php i en kodeditor, og indtast dette uddrag lige under denne kodelinje: <footer id="colophon" class="site-footer" role="contentinfo">.
Koden ovenfor kontrollerer først, om sidebar-2 har nogen widgets, og i så fald viser sidebjælken inde i en div med klassen "widget-area".
Den næste ting du skal gøre er at gå over til Widgets-panelet i din WordPress-back-end, finde sidefeltet til sidefoden Widgets og tilføje nogle widgets til det. Gem widgets, når du tilføjer dem, og kontroller resultatet.
Ovenstående viser et par widgets på sidefeltet i sidefeltet på Twenty Fifteen Child, og du kan se, at teksten var for tæt på toppen af containeren, og widgets bundmargen var for høj. Dette lille uddrag ind style.css forbedrer udseendet betydeligt.
.site-footer .widget {margin: 0; polstring: 10% 20% 0; } .site-footer .widget: sidste barn {margin-bottom: 10%; }
Her er et andet eksempel på tilføjelse af endnu et sidebjælke:
hvis (is_active_sidebar ('sidebar-2')
|| is_active_sidebar ('sidebar-3')):
?>
">
hvis (is_active_sidebar ('sidebar-2')) {?>
<?php }
hvis (is_active_sidebar ('sidebar-3')) {?>
Koden, du skal bruge, afhænger af det tema, du bruger i virkeligheden.
Din WordPress sidefod-widget er færdig!
I dette indlæg har vi set, hvordan du tilføjer et nyt widgetområde til Twenty Fifteen WordPress-temafod. Selvom vi placerede widgetområdet i temaets sidefod, kan du bruge denne logik til at tilføje widgetområder stort set overalt i et tema ved at følge lignende trin.
Vær venlig at forlade a nyttigt kommenter med dine tanker, så del dette på din Facebook-gruppe (r), der ville finde det nyttigt, og lad os høste fordelene sammen. Tak fordi du delte og var god!
Afsløring: Denne side kan indeholde links til eksterne websteder for produkter, som vi elsker og helhjertet anbefaler. Hvis du køber produkter, vi foreslår, tjener vi muligvis et henvisningsgebyr. Sådanne gebyrer påvirker ikke vores anbefalinger, og vi accepterer ikke betalinger for positive anmeldelser.
og mange flere ...