WordPress-teemojen avulla voit muuttaa verkkosivustosi ulkoasua ja hallita sen ulkoasua. Ne ovat pohjimmiltaan erilaisten mallitiedostojen kokoelmia, jotka toimivat yhdessä ja tuottavat verkkosivustosi kokonaissuunnittelun.

Ennen kuin sukellat syvemmälle WordPress-teemoihin, on tärkeää, että ymmärrät, miten WordPress toimii ja miten verkkosivuston eri sivut luodaan. WordPress on vuorovaikutuksessa tietokannan kanssa sisällön tallentamiseksi. Tämä tarkoittaa sitä, että aina kun luot uuden viestin tai sivun, viestin tai sivun sisältö asuu tietokannassa ja se näytetään mallien avulla vasta, kun kävijä pyytää kyseistä sisältöä.

WordPress-teema on kokoelma malleja (CSS- ja PHP-tiedostoja), joita WordPress käyttää tietokannan sisällön näyttämiseen. WordPress etsii teemasta tiedostoja, joita se käyttää nykyisen sivun esittämiseen tietyssä järjestyksessä. Tätä kutsutaan ’mallihierarkiaksi’, jota käytetään WordPress-teemojen luomiseen ja laajentamiseen.

WordPress-teemat päättävät, miten sisältösi näytetään verkkosivustollasi. WordPressissä malli on yksittäinen tiedosto, joka määrittää, miltä tietty sivu tai joukko sivuja näyttää verkkosivustosi etupäässä. Kun vaihdat teemaa, muutat tapaa, jolla sisältö näytetään muuttamatta itse sisältöä.

WordPress-teemat käyttävät erilaisia mallitiedostoja kokonaisen verkkosivun luomiseen. Kun esimerkiksi käytät WordPress-verkkosivustoa, voit itse asiassa nähdä useita eri mallinetiedostoja yhdistettynä yhdeksi täydelliseksi sivuksi.

Jos esimerkiksi katsot indeksisivua, kuten blogin etusivua, näet yleensä header.php-mallineella luodun otsikon ja index.php-mallineella luodun sisällön, sivupalkin, jonka on luonut sidebar.php, ja alatunnisteen, jonka on luonut footer.php

Mutta jos siirryt yksittäiselle sivulle, näet silti saman otsikon, saman sivupalkin ja saman alatunnisteen, mutta sisältö luotaisiin sen sijaan single.php:llä. Kysymys kuuluukin, mistä tietää, mitkä näistä mallitiedostoista käynnistyvät ja missä vaiheessa? Tässä kohtaa WordPressin mallihierarkia tulee kuvaan.

WordPressin mallihierarkia määrittää, missä järjestyksessä mallitiedostot ladataan WordPress-teemassasi. WordPress etsii näitä tiedostoja määrittääkseen, miten sivustosi ladataan.

Jos avaat ’Twenty Fifteen’ (yksi WordPressin oletusteemoista) -teemakansio, siellä on yli 15 mallitiedostoa. Näihin kuuluvat mallitiedostot 404, archive, author-bio, comments ja content-link vain muutamia mainitakseni. WordPress käyttää verkkosivusi jokaisen linkin sisältämää Query String -tietoa päättääkseen, mitä mallia tai mallien joukkoa käytetään sivun näyttämiseen.

WordPress päättää, minkä tyyppistä sivua (esimerkiksi hakusivua, kategoriasivua tai etusivua) pyydetään, ja valitsee sitten WordPressin mallihierarkian ehdottaman sopivan mallin sisällön tuottamiseksi.

Nimeämiskäytäntö

WordPressillä on erityinen ja tiukka nimeämiskäytäntö, joka liittyy teematiedostoihin, joten kaikki teemat jakavat melko yleisesti nimetyt tiedostot taustapuolella. Esimerkiksi sisällön hallinnan helpottamiseksi voit luoda header.php– ja footer.php-tiedostoja. Näiden mallinetiedostojen nimien on oltava header.php ja footer.php.

WordPress etsii nykyisen teeman hakemistosta tietyillä nimillä varustettuja mallinetiedostoja määrittääkseen, mitä mallia käyttää, tavallisimmin käytetään ensimmäistä vastaavaa mallinetiedostoa. Jos WordPress ei löydä samannimistä mallitiedostoa, se siirtyy hierarkiassa seuraavaan tiedostonimeen. Jos WordPress ei löydä yhtään vastaavaa mallitiedostoa, se käyttää index.php:tä (teeman etusivun mallitiedostoa).

Mallitiedostoja muokattaessa on siis mietittävä, minkä tyyppisestä sisällöstä on kyse, ja muokattava sitten sopivaa mallitiedostoa kyseistä sisältötyyppiä varten. Sama pätee myös silloin, kun luot WordPress-teemoja tyhjästä.

Minimivaatimukset teemalle

Ainoat tiedostot, joita WordPress-teema vaatii toimiakseen, ovat index.php ja style.css. index.php on tärkein ja ainoa tiedosto, joka käsittelee jokaisen WordPress-kyselyn sekä sivuston rakenteen.

Minimitiedostot, jotka vaaditaan, jotta WordPress-teema toimisi ja näkyisi WordPress-kojelaudassa aktivointia varten, ovat index.php ja style.css.

Jos index.php tai style.css puuttuvat, näytetään seuraava virheilmoitus.

Seuraavat teemat on asennettu, mutta ne ovat puutteellisia. Teemoilla on oltava tyylitaulukko ja malli.

• style.css (pakollinen)

• index.php (pakollinen)

• functions.php (valinnainen)

• screenshot.png (valinnainen)

Tämä erottelu lisää tehokkuutta huomattavasti. Kaiken yhdistäminen yhteen suureen tiedostoon index.php saattaisi teknisesti toimia, mutta se ei olisi kaunista ja aiheuttaisi loputtomasti ongelmia myöhemmin. Myös teeman muokkaaminen olisi painajainen!

Tässä on luettelo WordPressin tunnistamista teematiedostoista.

• style.css

• rtl.css

• index.php

• comments.php

• front-page.php

• single.php

• page.php

• author.php

• archive.php

On myös monia muita tiedostoja, voit tarkastella mallitiedostojen luetteloa saadaksesi lisätietoja.

Twenty Fifteen -mallihierarkiaesimerkki

Esitetään, että olet aktivoinut Twenty Fifteen -teeman ja käyttäjä käy sivulla yoursite.com/author/tahir/. Ensin WordPress etsii mallia nimellä author-tahir.php, mutta author-tahir.php ei ole käytettävissä. Tämän jälkeen WordPress etsii author.php, jos sitäkään ei ole, se etsii archive.php. Tämä tiedosto on saatavilla Twenty Fifteen -teemassa. Jos poistat tai nimeät archive.php uudelleen, WordPress käyttää index.php:a sivun renderöintiin.

Joka kerta, kun käyttäjä vierailee verkkosivustollasi, WordPress siirtyy mallihierarkiassa ylöspäin, kunnes se löytää sopivan mallitiedoston. Tällä on tekemistä sen kanssa, miten nämä tiedostot on nimetty.

The ’What The File’ Plugin

Tietääksesi, mitä tiedostoa ja mallipohjaa WordPress käyttää parhaillaan katselemasi sivun sisällön näyttämiseen, voit käyttää erittäin kätevää What The File Pluginia. Tämä on ilmainen lisäosa, jonka on kehittänyt Barry Kooij.

Tämä lisäosa lisää työkalupalkkiin vaihtoehdon, joka näyttää, mitä tiedostoa ja malleja käytetään. Asensin ’What The File Plugin’ -lisäosan testausta varten paikalliselle palvelimelleni ja huomasin sen toimivan loistavasti.

Testaamaan, mitä tiedostoja WordPress käyttää, jos tiettyä tiedostoa ei ole saatavilla, nimesin kaksi tiedostoa uudelleen (Twenty Fifteen -teemassa). Alla olevasta kuvakaappauksesta näet, mitä tiedostoja WordPress käyttää sisällön näyttämiseen.

Voit nähdä, että Twenty Fifteen -teema käyttää content-search.php-tiedostoa hakutulosten näyttämiseen. Jos poistat tai nimeät content-search.php uudelleen, WordPress käyttää sen sijaan content.php-tiedostoa hakutulosten näyttämiseen.

’What The File’-lisäosan avulla voit myös napsauttaa tiedoston nimeä suoraan muokataksesi sitä teemaeditorin kautta. Tämä lisäosa vaatii WordPress 3.1:n tai uudemman version, se toimi hyvin myös WordPress 4.1:n kanssa.

Hyödyllisiä resursseja