Edellisessä osassa kävimme läpi sivun koostumisen ja tänään jaamme sivuston osiin.

- Tämän hetkinen index.php ja style.css

Avaa index.php ja maalaa ensimmäiseltä riviltä lähtien ja päättyen riville <?php bloginfo(’description’); ?><br />.

Leikkaa (Ctrl+x) valittu teksti ja tallenna index.php. Avaa uusi tyhjä sivu, liitä sinne index.php:stä leikkaamasi teksti ja tallenna nimellä header.php. Avaa taas index.php ja kirjoita ensimmäiselle riville:

<?php get_header(); ?>

Yllä oleva koodi hakee nyt header.php nimisen tiedoston themen kansiosta. Yksinkertaista, eikö? Näin tulemme tekemään koko sivulle.

Seuraavaksi aloita maalaaminen index.php tiedostosta kohdasta <h2>Valikko</h2> ja päättyen kohtaan </ul>.

Leikkaa (Ctrl+x) valinta, tallenna index.php ja avaa uusi tiedosto. Liitä juuri leikkaamasi teksti ja tallenna se nimellä sidebar.php. Lisää index.php tiedostoon juuri leikkaamasi tekstin kohdalle:

<?php get_sidebar(); ?>

Arvaat varmaankin jo mitä tämä sitten tekee? Tietenkin se hakee themen kansiosta sidebar.php tiedoston.

Sitten viimeinen leikkaus. Maalaa <?php get_sidebar(); ?> koodin jälkeinen osa index.php:stä (eli koko loppusivu).

Leikkaa (Ctrl+x) ja tallenna index.php. Avaa uusi tiedosto ja liitä leikkaamasi teksti sinne. Tallenna se nimellä footer.php. Osaatko arvata mitä kirjoitetaan index.php sivun loppuun, että saamme footer.php:n ladattua? Yllättäen se tapahtuu näin:

<?php get_footer(); ?>

Tallenna nyt index.php ja tarkista selaimessa, että sivusi näkyvät edelleen oikein.

Loppusanat

Nyt sivumme on jaettu järkevän kokoisiin osiin ja nimetty ne hyvin. Tässä vielä tämän osan viimeiset muokatut tiedostot:

- index.php
- style.css
- header.php
- sidebar.php
- footer.php

Tämän osan sisältö oli sitten tässä. Lyhyempi kuin toinen osa, mutta kuitenkin kohtalaisen tärkeä osa WP:n themen kokonaisuutta. Theme alkaa olemaan jo aikalailla valmis, mutta kuten huomaat, kaikki on yhdessä jonossa ja tyylittömiä. Seuraavaksi on vuorossa sivuston tyylitiedoston muokkaus.

WordPress Theme -opas, osa 4
WordPress Theme -opas, osa 5