Tämä opas on Nettikulmauksen ensimmäinen moneen osaan jaettu opas-sarja. Oppaassa käydään läpi monia erilaisia vaiheita, mitkä liittyvät WordPress julkaisuohjelman teemojen luontiin. Suosittelen lukemaan jokaisen luvun, ettei tule väärinymmärryksiä. Koodit on myös hyvä kirjoittaa itse, eikä käyttäen kopioi/liitä toimintoa.

Tarvittavat työkalut

- WordPress asennettuna koneelle
- Editori sivujen tekoon (Muistio, Notepad++ jne)
- FTP -ohjelma (valmiin ulkoasun siirtoon nettiin)

Perustietoa

Jokainen theme tarvitsee ainakin kaksi tiedostoa, index.php ja style.css tiedostot. Index.php kertoo missä kohdassa mikäkin elementti (tekstit, valikot yms) sijaitsee ja style.css kertoo miltä ne näyttävät. Tässä lista themen tiedostoista:

• style.css
• index.php
• home.php
• single.php
• page.php
• archive.php
• category.php
• search.php
• 404.php
• comments.php
• comments-popup.php
• author.php
• date.php

Käymme oppaan aikana kaikki tarvittavat läpi.

Hierarkia

Vaikka edellä mainittuja sivuja on 13, et välttämättä tarvitse kuin muutaman niistä, koska jos esimerkiksi vierailija lataa sivun “archive.php” ja kyseistä sivua ei ole saatavilla, WP lataa automaattisesti index.php -sivun pohjan ja näyttää sen archive.php:n paikalla. Jos taas haluat archive.php:n näyttävän erilaiselta niin silloin teet index.php:stä kopion ja tallennat sen muokattuna archive.php:ksi.

Loppusanat

Tässä oli oppaan ensimmäinen osa. Seuraavassa osassa aloitamme themen teon, teemme index.php ja style.css tiedostot. Kommentteja oppaasta ja toteutuksesta, sekä oppaassa käsiteltävien aiheiden toiveista otetaan mielellään vastaan.

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

Jos haluat valmistaa ulkoasuja WordPressiin, tarvitset sen koneelle, koska se on paras tapa nähdä miten theme toimii, ilman että joutuisi FTP:n kautta siirtelemään tiedostoja. Asennus on erittäin yksinkertainen, tarvitset:

Apache (tai jokin muu palvelinohjelma) Lue opas Apachen asentamisesta
PHP Lue opas PHP:n asentamisesta Apacheen
MySQL Lue opas MySQL:n asentamisesta
PHPMyAdmin Lue opas asennuksesta
WordPress (purettuna)

1. Siirrä WP kansio Apachen htdocs -kansioon (mistä Apache hakee sivusi)
2. Tee phpMyAdminin avulla wordpress SQL-tietokanta kirjoittamalla keskellä phpmyadmin sivua sijaitsevaan Luo uusi tietokanta laatikkoon ja klikkaa “Luo”.
3. Muokkaa wp-config-sample.php

// ** MySQL settings ** //
define(’DB_NAME’, ‘wordpress’); // Tietokannan nimi, wordpress
define(’DB_USER’, ‘root’); // MySQL käyttäjätunnus
define(’DB_PASSWORD’, ”); // MySQL salasana
define(’DB_HOST’, ‘localhost’); // ei tarvitse muuttaa

4. Tallenna nimellä wp-config.php.
5. Avaa selaimella osoite http://localhost/wpkansio/wp-admin/install.php

Tämä opas kertoo, kuinka asennat phpMyAdminin omalle koneellesi, jotta voit hallinnoida SQL-tietokantoja.

Hae uusin versio osoitteesta http://www.phpmyadmin.net/home_page/index.php

Asennus

1. Pura phpmyadmin paketti
2. Siirrä se Apachen (htdocs) kansioon, kansioon mistä Apache hakee sivusi
3. Avaa config.sample.inc.php
4. Muokkaa seuraavat rivit:

29. $cfg['Servers'][$i]['auth_type'] = ‘cookie‘; <- Muuta cookie http:ksi
35. $cfg['Servers'][$i]['extension'] = ‘mysql‘; <- Muuta mysql mysqli:ksi

Tallenna nimellä config.inc.php
5. Avaa php.ini kansiosta C:\php ja muokkaa (lisää ellei löydy) seuraavat rivit:

extension=php_mbstring.dll - poista ; -merkki edestä
extension=php_mysqli.dll - poista ; -merkki edestä
mysqli.default_host = localhost - lisää localhost, ellei jo ole
mysqli.default_user = root - lisää root, ellei jo ole

6. Avaa phpMyAdmin selaimessasi, sen pitäisi toimia nyt.

Jos virheitä ilmenee

Tarkista, että C:\Temp tai mikä tahansa php.ini tiedostossa laittamasi temp-kansio on olemassa. Katso php.ini:ssä kohta session.save_path = “……”.

Käynnistä kone uudelleen jos virheitä tulee edelleen.

Pelkän Apachen asentaminen ei tuo vielä PHP/MySQL käyttäjälle tarvittavia ohjelmia, joten asennamme nyt MySQL:n.

Versio: 5.0.51a
Tiedoston nimi: mysql-5.0.51a-win32.zip
Lataa: http://dev.mysql.com/downloads/mysql/

ASENNUS

1. Pura mysql-5.0.24a-win32.zip ja käynnistä setup.exe
2. Klikkaa Next
3. Valitse Typical ja klikkaa Next
4. Klikkaa Install

5. Valitse Skip Sign-Up ja klikkaa Next.
6. Jätä valinta kohtaan Configure the MySQL Server now ja klikkaa Finish
7. Klikkaa Next
8. Valitse Standard Configuration ja klikkaa Next.

9. Laita valinnat molempiin: Install As Windows Service ja Include Bin Directory in Windows PATH, klikkaa Next.
10. Keksi root-salasana ja muista se. Klikkaa Next
11. Klikkaa Execute
12. Klikkaa Finish
13. Asennus on valmis. Apache käyttää MySQLiä automaattisesti, joten sitä ei tarvitse käynnistää mitenkään

Edellisessä oppaassa näytettiin miten asennetaan Apache 2.2 onnistuneesti koneelle. Pelkän Apachen asentaminen ei tuo vielä PHP/MySQL käyttäjälle tarvittavia ohjelmia, joten asennamme nyt PHP:n.

Versio: 5.2.5
Tiedoston nimi: php-5.2.5-Win32.zip
Lataa: http://www.php.net/downloads.php

ASENNUS

1. Pura php-5.2.5-Win32.zip ja uudelleen nimeä kansio “php” ja siirrä se C:\php
2. Tee kopio tiedostosta c:\php\php-ini-recommended.ini ja nimeä se c:\php\php.ini
3. Avaa php.ini muistiolla/haluamallasi ohjelmalla ja muokkaa seuraavasti:

Poista “;”-merkki include_pathin edestä kohdassa Windows: “\path1;\path2″. Rivi 522:

include_path = “.;C:\php\includes”

Muuta doc_root samaksi, kuin httpd.confin DocumentRoot kansio. Rivi 529.

doc_root = “C:\Program Files\Apache Software Foundation\Apache2.2\htdocs”

Muokkaa extension_dir. Rivi 536.

extension_dir = “C:\php\ext”

Muokaa session.save_path ja session.cookie_path. Rivit 1041 & 1062.

session.save_path = “C:\Temp”
session.cookie_path = \

4. Lisää C:\php polku järjestelmäsi ympäristömuuttujiin

1. Hiiren oikealla Oma tietokone ja valitse Ominaisuudet
2. Lisäasetukset -välilehti
3. Ympäristömuuttujat
4. Järjestelmämuuttujissa valitse “Path”, ja sitten Muokkaa
5. Lisää rivin “…System32\Wbem; perään C:\php; Rivin pitäisi kokonaisuudessaan näyttää tältä:

%SystemRoot%\system32;%SystemRoot%;%SystemRoot%\System32\Wbem;C:\php;

5. Klikkaa OK
6. Klikkaa OK

7. Avaa httpd.conf -tiedosto kansiosta C:\Program Files\Apache Software\Apache2.2\conf\ ja lisää seuraavat rivit tiedoston loppuun:

LoadModule php5_module “c:/php/php5apache2_2.dll”
AddType application/x-httpd-php .php
PHPIniDir “C:/php”

10. Lisää DirectoryIndexiin index.php index.html:n perään httpd.conf -tiedostossa ja tallenna.

Testaus

1. Käynnistä Apache uudelleen (hiiren vasemmalla Apachen kuvaketta system trayssa -> Apache 2.2 -> Restart)
2. Tee tiedosto phpinfo.php ja liitä seuraava koodi siihen. Tallenna tiedosto DocumentRoot kansioon (C:\Program Files\Apache Software Foundation\Apache2.2\htdocs)

<?php phpinfo();?>

3. Avaa osoite http://localhost/phpinfo.php selaimeesi. Jos sivulle ilmestyy tietoja PHP:stä, on se asennettu onnistuneesti.

Jokainen webmaster tarvitsee sivuja tehdessään Apachea. Apache mahdollistaa .php sivujen näytön, sekä php-skriptien suorituksen omalla koneella. Tämä opas kertoo, miten asennat Apache 2.2 onnistuneesti.

Versio: 2.2.3
Tiedoston nimi: apache_2.2.3-win32-x86-no_ssl.msi
Lataa: http://httpd.apache.org/download.cgi

Asennus

1. Käynnistä asennusohjelma ja klikkaa Next
2. Valitse “I accept the terms in the license agreement”, klikkaa Next
3. Klikkaa Next ja pääset kohtaan “Server Information”
4. Täytä tiedot:

Network Domain: localhost.com
Server Name: localhost
Administrator’s Email Address: admin@localhost.com

5. Valitse “for All Users, on Port 80, as a Service”, klikkaa Next
6. Valitse “Typical”, klikkaa Next
7. Älä muokkaa asennuskansion sijaintia, klikkaa Next
8. Klikkaa Install

9. Jos pidät Windows XP:n omaa palomuuria päällä, valitse Unblock kun XP:n palomuuri kysyy ohjelmalle oikeuksia
10. Avaa selaimella osoite http://localhost/ ja ruutuun pitäisi ilmestyä teksti “It works!” (jos ei ilmesty, koita osoitetta http://localhost:8080)

Tervetuloa Nettikulmauksen uusille sivuille!

Avasin sivut uudelleen pitkän odottelun jälkeen WordPressin pohjalle. Sivujen tarkoituksena on jakaa hyödyllisiä oppaita muille webmastereille.

Ulkoasua vielä viilataan, sekä muutama lyhyt opas lisätään sivuille, minkä jälkeen alkaa pitkä, moniosainen opas: Ulkoasun teko WordPress -blogiin tyhjästä. Oppaassa tehdään yksinkertainen ulkoasu WordPress julkaisuohjelmaan ihan alusta asti kertoen mitä mikäkin osa tarkoittaa.