WordPress-oletusteema vuonna 2014 oli Kaksikymmentä viisitoista, malli, jossa on kiinteä sivupalkki vasemmalla ja joka muuttuu otsikoksi mobiilinäkymässä, minimaalinen alatunnistealue, upea typografia ja mukava esittelyalue. Siitä lähtien olemme nähneet TwentySixteen-, TwentySeventeen-, TwentyEighteen-, TwentyNineteen- ja nykyisen defualt-ilmaisen teeman julkaisun. Kaksikymmentäkaksi.
Nämä teemat ovat mahtavia, ne käyvät läpi koko prosessin saadakseen valita oletus WordPress-teeman, mutta voimme ymmärtää, että käyttäjät haluavat silti muokata sitä ja tehdä siitä oman.
Koska nämä teemat tarjoavat tyypillisesti joitain rajoituksia, kuten yhden sivupalkin (jota WordPressissä kutsutaan widget-valmiiksi alueeksi), näytämme sinulle, kuinka voit lisätä widgetin alatunnisteeseen tai kuinka säätää minkä tahansa teeman koodia lisätäksesi lisää widget-alueita teema.
Widget-alueen lisääminen TwentyFifteen - TwentyTwenty-alatunnisteeseen ei ole erilainen kuin widget-alueen lisääminen useimmissa WordPress-teemoissa.
Jos haluat nähdä muita WordPress -teemoja, suosittelemme tutustumaan muihin suosittuihin teemoihin, kuten Divi from Elegant Themes. Katso koko arvostelu täältä.
Luo WordPress-lapsiteema
Kun muokkaat WordPress-teeman mallitiedostoja widget-alueen luomiseksi, on hyvä käytäntö luoda lapsi teema.
Lapsiteeman käsite on melko yksinkertainen - emme halua rikkoa mahdollisuutta päivittää teema uusiin versioihin.
Kun luot mukautuksia lapsiteemaan, muutokset lisätään lapsiteemaan alkuperäisen teeman sijaan. Kun alkuperäisen teeman päivitetty versio on poissa, voit päivittää alkuperäisen teeman kopion ja jättää muutokset ennalleen aliteemassa.
Jos haluat oppia lisää WordPressiin liittyviä vinkkejä ja temppuja, käy seuraavassa osiossa CollectiveRay.
1. Luo aliteemahakemisto ja tiedostot
Luo ensimmäisenä kansio wp-sisältö> teemat kansio. Kutsu kansio kaksikymmentäviisi lapsi, kaksikymmentä kaksikymmentä lapsi. On kuitenkin tärkeää, että lapsiteema noudattaa vanhempiensa nimeämiskäytäntöä.
Joten jos vanhempi kutsutaan kaksikymmentätoista, lapsi on kutsuttava kaksikymmentäviitoista lasta. Vastaavasti, jos muokkaamaasi teemaa kutsutaan kaksikymmentäkymmentä, lapsiteemaa on kutsuttava t: ksikaksikymmentä lasta.
Kun olet luonut aliteeman, sinun on luotava kaksi uutta tiedostoa.
Tiedosto, jota käytetään muutoksiin CSS-tyyleissä, tulisi kutsua style.css. Tarvitsemme myös functions.php tiedosto lapsiteemalle, johon voimme lisätä tiettyjä vaadittuja ominaisuuksia.
Nämä kaksi tiedostoa menevät lapsiteemalle luomasi XNUMX lapsen kansioon tai vastaavaan kansioon.
2. Lisää tiedosto WordPress-widget-alueelle (alatunnisteeseen tai haluamaasi kohtaan)
Koska widget-alue on lisättävä teema-alatunnisteeseen, alatunnistekoodia varten sinulla on oltava tiedosto.
Turvallisin tapa koodata WordPress-mallitiedosto on aloittaa valmiista mallista, lisätä sitten haluamasi ja / tai poistaa mitä et halua.
Ota tässä tapauksessa footer.php Twenty Fifteen -teemasta tai Twenty Twenty -teemasta tai mitä tahansa muokkaamaasi teemaa kutsutaan ja liitä se lapsesi teemaan.
3. Luo widget lisäämällä koodi lapsiteeman tiedostoihin
Tällä hetkellä meillä on vain tyhjiä tiedostoja, joten lapsiteema ei sellaisenaan voi tehdä mitään.
Jotta voimme tehdä muutoksia, toimiva lapsi-teema tarvitsee joitain kommentteja sen yläosassa style.css. Avata style.css suosikkikoodieditorissasi ja lisää tämä bitti koodi.
/*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*/
Todella tärkeä osa tässä on Sapluuna joten yllä olevassa esimerkissä se on Malli: kaksikymmentä viisitoista. Tämä opastaa WordPressiä pääteeman nimestä.
Varmista, että nimi on täsmälleen sama kuin pääteeman kansion nimi (kirjainkoko tai välilyönnit, viivat, alaviivat jne. Ovat tärkeitä: kaiken on vastattava täsmälleen pääteeman kansion nimeä).
Seuraavaksi avaa functions.php ja lisää seuraava bitti koodia.
Vaikka tämä vaihe ei ole ehdottomasti pakollinen, se on erittäin suositeltavaa, koska tämän koodin avulla lapsiteema perii vanhempiensa ulkoasun.
Joten kirjoitetaan funktio, joka kiinnittyy wp_enqueue_scripts () toimintakoukku. Sisällä toiminto sinä enqueue pääteeman tyylitaulukko käyttämällä wp_enqueue_style () -toiminto.
Tämä varmistaa, että lapsiteema perii vanhempiensa tyylit samalla kun se ohittaa minkä tahansa erityisen tyylisäännön omassa style.css tiedosto.
<?php
//Import parent styles the right way and add other stylesheets if necessary.
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' );
Lapsesi teema on enimmäkseen tehty!
Kirjaudu Teemat paneeli WordPress-asennuksessasi ja sinun pitäisi nähdä Twenty Fifteen Child -teemasi käyttövalmis. Klikkaus Aktivoida ja käy sivustollasi. Sen pitäisi näyttää täsmälleen samalta kuin pääteema.
Widget-alueen lisääminen
Nyt meidän on lisättävä koodi alatunnisteen widget-alueen määrittämiseksi. Tässä on katkelma, johon mennään functions.php.
/ ** * Rekisteröi alatunnisteen widget-alue. * * @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', 'kaksikymmentä) -fifteen-child '),' id '=>' sivupalkki-2 ',' description '=> __ (' Lisää tähän widgettejä, jotta ne näkyvät alatunnistealueellasi. ',' kaksikymmentäviisitoista-lapsi '),' before_widget ' => ' ',' after_widget '=>' ',' before_title '=>' ',' after_title '=>' ',)); } add_action ('widget_init', 'kaksikymmentäviisi_child_widgets_init');
Yllä oleva koodi lisää toiminnon, joka rekisteröi sivupalkin sivupalkin 2 tunnuksella (Twenty Fifteen -teemalla on jo sivupalkki sivupalkin 1 tunnuksella) ja kiinnittää tämän toiminnon sitten widget_init () toimintakoukku.
Seuraavaksi mennään eteenpäin ja lisätään uusi sivupalkki alatunnisteeseen. Avata footer.php koodieditorissa ja kirjoita tämä katkelma juuri tämän koodirivin alle: <footer id="colophon" class="site-footer" role="contentinfo">.
Yllä oleva koodi tarkistaa ensin, onko sivupalkissa 2 widgettejä, jos se näyttää sivupalkin div: n sisällä luokan "widget-alue" kanssa.
Seuraava asia, mitä sinun on tehtävä, on siirtyä WordPress-taustakuvan Widgetit-paneeliin, etsiä Alatunnisteen widgetit -sivupalkki ja lisätä siihen joitain widgetejä. Tallenna widgetit, kun lisäät ne ja tarkistat tuloksen.
Edellä on esitetty pari widgetiä Twenty Fifteen Child -alatunnisteen sivupalkissa ja näet, että teksti oli liian lähellä säiliön yläosaa ja widgetien alamarginaali oli liian korkea. Tämä pieni katkelma style.css parantaa ulkonäköä huomattavasti.
.site-footer .widget {marginaali: 0; pehmuste: 10% 20% 0; } .site-footer .widget: last-child {marginaali-pohja: 10%; }
Tässä on toinen esimerkki toisen sivupalkin lisäämisestä:
if (is_active_sidebar ('sivupalkki-2')
|| is_active_sidebar ('sivupalkki-3')):
?>
">
<?php
if (is_active_sidebar ('sidebar-2')) {?>
<?php }
if (is_active_sidebar ('sidebar-3')) {?>
Käytettävä koodi riippuu todellisuudessa käyttämästäsi teemasta.
WordPress-alatunniste-widgetisi on valmis!
Tässä viestissä olemme nähneet, kuinka uusi widget-alue lisätään Twenty Fifteen WordPress -teeman alatunnisteeseen. Vaikka sijoitimme widget-alueen teeman alatunnisteeseen, voit käyttää tätä logiikkaa lisätäksesi widget-alueita melkein kaikkialle teemaan seuraamalla vastaavia vaiheita.
Ole hyvä Jätä hyödyllinen kommentoi ajatuksiasi ja jaa tämä sitten Facebook-ryhmissäsi (ryhmissä), jotka pitävät tätä hyödyllisenä, ja hyödynnetään yhdessä. Kiitos jakamisesta ja mukavuudesta!
Disclosure: Tämä sivu voi sisältää linkkejä ulkoisille sivustoille tuotteille, joita rakastamme ja kannatamme sydämestämme. Jos ostat suosittelemiamme tuotteita, saatamme ansaita viittausmaksun. Tällaiset maksut eivät vaikuta suosituksiimme, emmekä hyväksy maksuja positiivisista arvosteluista.
ja paljon muuta ...