Blogit ja WordPress versio 1.0 15.3.2012 Otavan Opisto Jari Sarja
Sisältö 1. Bloggaus... 5 1.1. Bloggaaminen on journalismia... 5 1.2. Kuinka tehdä suosittu blogi?... 6 1.3. Blogi ja keskustelu... 7 1.4. RSS ja blogit... 7 1.4.1. RSS-lukijoita... 8 1.5. Blogit tiedon lähteenä... 8 1.6. Blogipalveluita... 11 1.7. Blogiohjelmia... 11 2. Wordpress online... 13 2.1. Hallintapaneeli... 16 3. WordPressin imurointi ja asennus... 20 3.1. WordPressin vaatimukset... 21 3.1.1. Tietokannan luominen omalle koneelle... 21 3.2. WordPressin asennus... 23 4.3. WordPressin tiedostot ja hakemistot... 28 4. Kirjautuminen WordPressiin... 29 5. WordPressin asetukset... 30 5.1. Yleiset asetukset... 30 5.2. Kirjoittamisen asetukset... 32 5.3. Lukemisen asetukset... 33 5.4. Keskustelun asetukset... 35 5.5. Mediakirjaston asetukset... 36 5.6. Tietosuoja-asetukset... 36 5.7. Osoiterakenteen asetukset... 36 6. Ohjausnäkymä... 38 7. Blogikirjoituksen lisäys, muokkaus ja poisto... 39 7.1. Blogikirjoituksen lisäys... 39 7.1.1. Blogikirjoituksen asetukset... 40 2
7.1.2. kategoriat ja avainsanat... 42 7.2. Blogikirjoituksen muokkaus... 42 7.3. Blogikirjoituksen poistaminen... 43 8. Editori... 45 Ylärivin painikkeet... 45 Alarivin painikkeet... 46 8.1. Kuvan lisääminen... 47 9. Media... 48 10. Linkit... 49 11. Sivut... 51 12. Kommentit... 53 13. Ulkoasu... 54 13.1. Teemat eli sivupohjat... 54 13.1.1. Oikotie sivupohjan asennukseen... 56 13.2. Vimpaimet eli widgetit... 57 13.3. Yläpalkin asetukset... 61 13.4. Muokkain... 61 14. Lisäosat eli pluginit... 63 14.1. Editorin virittäminen... 64 14.2. Kuvagalleria... 66 14.3. Monta sivupohjaa samalla sivustolla... 67 15. Käyttäjät... 71 15.1. Uuden käyttäjän lisääminen... 71 16. Työkalut... 73 16.1. Kirjoitusten siirtäminen toisesta blogista... 73 Bloggerista tuominen... 75 16.2. Kirjoitusten vieminen toiseen blogiin... 76 17. Offline työkalut... 77 18. Valmiin teeman muokkaaminen... 78 18.1. Teeman tiedostot... 81 3
18.2. Sanasto... 82 18.3. Hierarkia... 82 19. Sivupohja... 84 20. Teeman tekeminen verkossa... 85 20.1. WordPress Theme generator... 85 20. 2 Dotemplate... 86 20.3. CSSEZ... 86 21. Uuden teeman luominen... 88 22. Staattinen sivu leiskasta koodiksi... 95 Style.css... 99 Header.php... 100 Index.php... 101 Page.php... 103 Screenshot.png... 104 23. Hyvä tietää navigaatiosta... 105 24. Blogi mukaan fiksusti... 109 23.2. Alasivut... 110 24. Wordpress julkaisujärjestelmänä... 113 24.1. Frontendin kautta muokkausta... 114 Lähteet... 116 Liite 1. Sanasto... 117 Liite 2. Webpalvelin omalle tietokoneelle... 118 Liite 3. WAMPIn asennus... 119 4
1. Bloggaus Bloggaus on tällä hetkellä nouseva trendi. Nykyisin ainakin nettilehdet siteeraavat blogeja, esimerkkinä vaikka Petteri Järvisen blogi. Välillä blogit pääsevät jopa telkkariin, ainakin Erkki Tuomioja. Lisäksi Yle aloitti ihan juuri uuden sarjan Blogistania, jossa esitellään kymmenen bloggaavaa nuorta naista. Blogien etuna perinteiseen lehtijulkaisuun on nopeus. Julkaiseminen on vain klikkauksen takana. Tavallisiin www-sivuihin verrattuna blogien etuisuutena on vielä julkaisujärjestelmä. Jokainen blogi pitää sisällään jonkinlaisten editorin eli blogikirjoituksen julkaisemiseen ei tarvita erillisiä ohjelmia kuten FTP. Pelkkä webselain riittää, jotta pääset julkaisemaan tekstiä, kuva ja jopa videota. Bloggauksella on omat hyvät puolensa. Blogien lukeminen ja kirjoittaminen kehittävät luku- ja kirjoitustaitoa. Blogit luovat lisäksi yhteisöllisyyttä, koska jokuhan niitä blogeja lukee. Unohtaa ei myöskään sovi, että ajatusten jakaminen kokemastaan on paitsi hauskaa myös hyödyllistä. Jotkut jopa onnistuvat myymään bloginsa kustantajalle, joka sitten julkaisee kirjan. Yksi sellainen esimerkki on Supermamman. Aluksi Supermamman oli blogi, mutta suuren suosion myötä kustantaja kiinnostui siitä. 1.1. Bloggaaminen on journalismia Yksi ensimmäisiä ja tunnetuimpia bloggajia on Justin Hall. Hänen mukaan bloggaaminen on journalismia, jossa kirjoittaja raportoi itsestään. Mutta se, mitä bloggaajalle tapahtuu, ei koske pelkästään häntä itseään. Hyvä esimerkki on se, kun Justin Hallin matka Suomeen. Hall juuttui New Yorkin lentokentälle USA:n koillisosan pimentäneeseen sähkökatkon vuoksi. Hall tietty kirjoitti kokemuksistaan pimentyneellä lentokentällä. Hall uskoo blogien muuttavan tiedonvälitystä. Hänen mukaansa blogit tarjoavat välähdyksen journalismin tulevaisuudesta! Vielä eilen sanomalehdet antoivat lukijalleen vasta lopullisen tarinan, joka on toimitettu ja käsitelty. Nykyään lehtijuttu saattaa tulla meille verkossa ensin toimittajan blogina tai muistiinpanoina, sitten myöhemmin lopullisena tarinana lehteen painettuna. Justin Hall neuvoo tulevia bloggaajia. Ensimmäinen neuvo koskee oikeutta ilmaista itseään. "Ensinnäkin aloittaminen merkitsee sitä, että on älynnyt, että minulla on sanottavaa ja oikeus sanoa se. Se on jo hienoa. Toisaalta kannattaa muistaa, että kaikilla ei välttämättä ole persoonallisuutta tai sanallista kyvykkyyttä, joka tekisi blogista mielenkiintoisen. Kannattaa ehkä miettiä, voiko liittoutua jonkun toisen kirjoittajan kanssa". (Mikrobitin blogi 2003.) Toinen Justinin neuvo on yksinkertainen. "Jos en löydä Webistä jotain, jota olen etsinyt, teen sen sinne". 5
1.2. Kuinka tehdä suosittu blogi? Blogin yksi tavoite on, että se olisi suosittu eli sillä olisi paljon lukijoita. Ruotsin yksi tunnetuimista bloggaajista Tommy K Johansson antaa viisi vinkkiä siihen, kuinka blogista tulee suosittu. Ja, miksi otamme mallia Ruotsista? Ensinnäkin Ruotsissa on julkaistu laajoja oppaita bloggaajille. Lisäksi siellä jaetaan isoja palkintoja parhaimmille bloggaajille ja osa jopa tienaa bloggaamisella varsin mukavasti. Ja tämä kyseinen Tommy K Johansson, hänen sivuilla kävi syyskuussa 2009 yhteensä 18 000 yksittäistä kävijää. Lisäksi hänen bloginsa rikkoi vuonna 2011 10 miljoonan kävijän rajan. Neuvo nro 1, päivitä usein. Blogia pitäisi päivittää noin kolme kertaa päivässä. Lisäksi kirjoitukset tulisi rytmittää pitkin päivää eli ei kaikkea kerralla. Useat sivustot tarjoavatkin mahdollisuuden ajoittaa julkaisu haluttuun ajankohtaan. Johansson itse kirjoittaa kaikki viestit illalla, mutta laittaa ohjelman julkaisemaan ne pitkin päivää, jolloin hän hoitaa tavallista päivätyötään. Neuvo nro 2, seuraa tilastoja. Hyviä työkaluja ovat Sitemeter ja WordPressin plugin FireStat. Erityisesti kannattaa seurata sitä mistä päin maailmaa tai maakuntaa kävijät tulevat ja mistä kirjoituksista he ovat kiinnostuneita. Sekin on kiinnostavaa, että millä hakusanoilla sivuille tullaan. Homman juju on siinä, että kävijä täytyy saada palaamaan. Siksi vanhojakin kirjoituksia pitää linkittää uusiin. Kävijän pitää jäädä sivuille ja hänen pitäisi huomata sivu niin hyväksi, että hän tila sivuston uutissyötteen. Neuvo nro 3, linkitä vanhoihin viesteihin. Käytä oman sivustosi hakutoimintoa, koska sinun on luotava sivustolle linkitys. Jos olet kirjoittanut aiheesta aiemmin, linkitä se kirjoitus uusimpaan kirjoituksesi. Tällä tavalla rakennat kokonaisuutta, joka helpottaa kävijän elämään. Hän saa koko ajan lisää tietoa asioista, josta hän on kiinnostunut. Neuvo nro 4, tee yhteenvetoja. Kokoa viikon kirjoitukset listaksi, mistä aiheista kirjoitit. Älä anna kirjoitustesi vaipua arkistoon. Tee yhteenvetoja myös aihealueista, joista kirjoitat paljon ja muista linkitys. Neuvo nro 5, älä aliarvioi lukuja. Se saatko kävijöitä, on paljolti kiinni otsikoista, millaisia otsikoita kirjoitat. Tällainen otsikko ei ole kovin vetävä Linkkejä moniin ohjelmiin. Kirjoita mieluummin otsikoksi 23 parasta ilmaisohjelmaa. Jos mahdollista niin älä käytä tasalukuja eli mieluummin 97 kuin 100. 6
1.3. Blogi ja keskustelu Blogin ja keskustelun eroa voisi havainnollistaa vertauksella. Keskustelufoorumi on kuin tori. Siellä on paljon ihmisiä ja voit jutustella eri ihmisten kanssa. Osa kiertelee torilla ihmettelemässä ihmisvilinää ja kuuntelee satunnaisesti muiden keskusteluja. Tori on paikka, jonne kaikki voivat tulla. Siellä tapaa joka kerta eri ihmisiä kuin edellisellä kerralla. Blogista voisi sanoa, ettei se ole tori vaan se on takapiha. Se on hyvin lähellä ja se on oma. Joku voi kauempaa ihmetellä pihaa ja joku voi taas olla pihalla syömässä tai ottamassa aurinkoa. Tori on hyvin yleinen ja aihepiirit voivat olla mitä tahansa. Blogi on aina henkilökohtainen ja rajoittuu johonkin ti joihinkin aihepiireihin. Blogin hyvyys on juuri keskittyminen. 1.4. RSS ja blogit Lyhenne RSS tulee sanoista Really Simple Syndication (tai Rich Site Summary). RSS:n vahvuuksia on ainakin kaksi. Ensinnäkin RSS vapauttaa ihmiset siitä, että sivuilla vierailtaisiin jatkuvasti. Enää ei siis tarvitse surffata sivulle katsomaan, onko siellä jotakin uutta. Uutiset välittää kätevästi RSS. Voit mennä vierailemaan sivuille, mutta vasta sitten kun siellä on jotakin uutta. Toinen RSS:n vahvuus on, että tieto välittyy paremmin perille kuin sähköpostitse. Kuten viime aikoina on nähty niin sähköpostilistojen kautta lähetyt postit saattavat jäädä palveluntarjoajan filttereihin. Lisäksi oma sähköpostilaatikko pysyy siistinä. Blogeissa on lähes poikkeuksetta nk. RSS painike, jolla blogin merkinnät voi tilata itselleen. Usein RSS-kuvake näkyy myös selaimen osoiterivillä. Tässä vielä joitakin ikoneja, joihin saatat törmätä. Kun RSS-kuvaketta klikkaa niin pääsee tekemään tilauksen eli tilaamaan uutissyötteen. Uusimmissa selaimissa on RSS-lukija sisäänrakennettuna. Usein kannattaa kuitenkin hankkia erillinen RSS-lukija. Erillisen uutislukijaohjelman vahvuus on siinä, että voit määrätä ohjelman hakemaan uutiset automaattisesti esim. puolen tunnin välein. Sinun ei tarvitse käydä sivulla koko ajan kurkkimassa, että milloin jotain uutta uutisoitavaa ilmaantuu. Osa ohjelmista kuten esim. RSS- Reader ilmoitta pienellä ikkunalla ruudun alalaidassa, jos uusi uutinen ilmaantuu. 7
1.4.1. RSS-lukijoita RSS-lukijoita on olemassa kolme eri tyyppiä. Online ohjelmia ei tarvitsee asentaa. Esimerkki sellaisesta on Google Reader. Uusimmissa selaimissa on olemassa RSS-tuki, esim. IE 7 ja Firefox 1.5. Paras vaihtoehto on kuitenkin kunnollinen RSS-ohjelma, joka asennetaan koneelle. Suosittelen käytettäväksi ohjelmaa Feedreader, koska se seuraa jatkuvasti uutissyötteitä, lisäksi se on suomenkielinen. Tässä listaa ohjelmista. Feedreader (Windows, ohjeet asennukseen ja käyttöön) Blogbridge (Windows, Linux, Mac) Liferea (Linux) AmphetaDesk (Windows, Linux, Mac) BottomFeeder (Windows, Linux, Mac) 1.5. Blogit tiedon lähteenä Blogien avulla pysyt jyvällä siitä mitä tapahtuu. Itselläni on opetusalana av-viestintä ja seuraan aktiivisesti noin 150 blogia. En vieraile sivuilla joka päivä, koska RSS kertoo onko mitään uutta. Merkkaan yleensä tärkeät viestit heti ylös, jotta voin palat niihin myöhemmin. Kaikkia blogeja ei tarvitse etsiä itse, koska netistä löytyy myös valmiita listoja. 50 Best Blogs for Education Leaders http://www.onlineuniversities.com/blog/2010/02/50- best-blogs-for-education-leaders/ Top 100 Language Blogs 2009 http://en.bab.la/news/top-100-language-blogs-2009.html The Top 21 Language Bloggers on the Web http://blog.edufire.com/2008/06/19/the-top-20-language-bloggers-on-the-web/ Top Language Blogs and Podcasts http://www.lexiophiles.com/top-language-blogs-and-podcasts 50 Best Blogs for Moviemakers http://www.moviemaker.com/producing/article/50_best_blogs_for_moviemakers_moviema ker_magazine_20100121/ 8
Websuunnittelijoille suosittelen seuraavia blogeja, joista löytyy taatusti lukemisen ja RSS tilauksen arvoista informaatiota. http://www.alistapart.com/ http://www.smashingmagazine.com/ http://www.456bereastreet.com/ http://www.webdesignerdepot.com/ http://webdesignledger.com/ http://sixrevisions.com/ http://webdesignerwall.com/ http://veerle.duoh.com/ Suomalaiset blogit löydät kätevästi osoitteesta: http://www.blogilista.fi/ Hyvä palvelu on myös: http://www.blogispotti.fi/. 9
Oindex Kertoo kuinka suosittu sivusto on http://www.oindex.fi/ Blogimaa Mahdollisuus omaan blogiin ja muutenkin tietoa. 10
1.6. Blogipalveluita Blogeja voi tehdä useammalla helposti ihan online ilman asennusta ja kaiken lisäksi ilmaiseksi. Blogger on hakukoneyhtiö Googlen omistama blogipalvelu, joka on ollut verkossa vuodesta 1999 lähtien. Sen perusti tuolloin Pyra Labs -niminen yritys, jonka Google osti vuonna 2003. Ensijulkaisunsa aikoihin Blogger oli ensimmäisiä blogaukseen keskittyneitä alustoja, ja sille kuuluu ainakin osakiitos blogien suosion noususta 2000-luvulla. Blogger oli ensimmäisiä blogipalveluita, joiden käyttäjien ei tarvinnut käyttää HTML:ää tai lähettää sisältöä erikseen kotisivupalvelimelle, vaan blogimerkinnät voitiin kirjoittaa suoraan lomakkeeseen webissä. (Wikipedia.) Bloggerissa voi valita itselleen sopivan kielivaihtoehdon, koska palvelu toimi usealla eri kielellä. Blogger huono puoli on, että palvelu keskittyy blogin perustoimintoihin eli uudistuksia toteutetaan nihkeästi. Vuodatus on suomalainen ja suomenkielinen blogipalvelu, jonka saa muutamassa minuutissa käyttöön. Palvelun omistaa Alma Mediaan kuuluva Kustannusosakeyhtiö Iltalehti. Blogin ulkoasua voi muokata ja siihen voi liittää helposti kuvia. (Helppokäyttöiset blogipalvelut.) Posterous on hyvin helppokäyttöinen palvelu bloggaamiseen. Sinun tarvitsee ainoastaan lähettää sähköposti osoitteeseen post@posterous.com luodaksesi oman blogin. Palvelu ei vaadi minkäänlaista rekisteröintiä ja tekstin lisäksi voi laittaa blogiisi kuvia, videoita ja tiedostoja. (Samarbeta online.) Wordpress online on hyvä vaihtoehto paljon bloggaavalle, koska blogien kaikki perustoiminnot ovat käytettävissä. Wordpress online toimii usealla eri kielellä ja sen voi yhdistää kätevästi LiveWriteriin, jolloin voit kirjoittaa blogikirjoituksia entistäkin helpommin. Tästä vaihtoehdosta lisää tietoa luvussa 2. 1.7. Blogiohjelmia Blogiohjelmista, jotka pitää asentaa palvelimelle, on WordPress paras valinta. WordPress on hallinnut blogiohjelmistojen kenttää niin suvereenisti, että kilpailevat ohjelmat ovat täysin jääneet sen varjoon. Wordpressiä on jossain määrin pystynyt haastamaan ainoastaan Movable Type. Kauempana takana on sitten Textpattern. Sitten on monia julkaisujärjestelmiä, joilla voi luoda oman bloginsa. Varsinkin Drupal on kunnostautunut kyseisellä saralla. 11
Mikäli etsit flatfile ohjelmaa, jolla pystytät blogin, on valinnanvara niukkaa, mutta jotakin löytyy kuten esim. seuraavat. FlatPress Blosxom Ode Lisäksi blogiin taipuvat ainakin jossain määrin Pluck ja GetSimple. Mutta mikäli haluat parhaan mahdollisen blogiohjelman, on valintasi WordPress. Se on blogimaailman numero 1, lisäksi se pärjää hyvin myös tavallisena julkaisujärjestelmänä ja haastaa siinä sarjassa jopa Joomlan ja Drupalin. 12
2. Wordpress online WordPressistä on olemassa myös online -versio eli sinun ei tarvitse asentaa mitään palvelimelle. Tämä on helpoin tapa aloittaa oma blogi. Mainoksetkaan eivät pahemmin häiritse, vaikka blogi on ilmainen. Lisäksi roskaviestien suodatus toimii hyvin. Tässä versiossa on lähes kaikki WordPressin toiminnot. Sieltä on otettu pois joitakin WordPressin ominaisuuksia kuten omien teemojen tekemisen mahdollisuus sekä pluginien asentaminen. Suunnista sivulle: http://wordpress.com/ Sitten paina isoa kirjautumispainiketta. Sitten tiedot sisään ja painat Next. 13
Jos käyttäjätunnus oli jo käytössä, joudut miettimään sen uusiksi ja tässä tapauksessa myös salasana uusiksi, koska se ei ollut tarpeeksi vahva eli se sisälsi pelkkiä kirjaimia. Korjaa tiedot ja paina Next. Vaihda kieli ja otsikko eli blogin nimi ja lopuksi painat Signup. 14
Sitten on vielä jäljellä aktivointi. Eli kirjaudu s-postiisi ja napsauta linkkiä. Sitten pääset kirjautumaan sisään. Tämän jälkeen suunnistat kohtaan My Dashboard, jos englanninkielinen käyttöliittymä. 15
Suomenkielisessä käyttöliittymässä Dashboard on nimeltään Ohjausnäkymä. Nyt olet perillä eli hallintapaneelissa. 2.1. Hallintapaneeli Hallintapaneelin pääset vain kirjautumisen jälkeen. Hallintapaneelin osoite on sivun osoite/wpadmin esim. https://jarisblogg.wordpress.com/wp-admin Tämä on se käyttäjälle näkymätön puoli. Sivuston ylläpitäjälle tämä on kaiken ydin. Täällä kirjoitetaan tekstit ja täällä säädetään mm ulkoasut ja kaikki pienimmätkin asetukset. Tätä tavallisille käyttäjille näkymätöntä puolta kutsutaan nimellä backend. Dashboard Ohjausnäkymä. Näyttää sen mitä blogissa on viimeksi tapahtunut eli viimeisimmät kirjoitukset ja kommentit näkyvät. Samoin WordPressin kehittäjäyhteisön uutiset tulevat tänne. 16
Store Voit esim. ostaa blogillesi oman domainin eli verkkotunnuksen. Hinnat ovat korkealla, joten suosittelen ainoastaan verkkotunnuksen hankkimista. Posts Voit lisäillä blogimerkintöjä sekä muokata aiempia kirjoituksia. Media Voit lisäillä mediatiedostoja kuten ääntä kuvaa ja liikkuvaa kuvaa. Links Voit lisäillä sivulle linkkejä ja luokitella niitä kategorioihin. Voi näyttää esim. tällaiselta. Pages Staattiset sivut eli tavalliset www-sivut, ei siis blogimerkinnät. 17
Comments Blogiin lisätyt kommentit. Voi hyväksyä kommentteja tai heittää huonot kommentit roskikseen. Feedbacks Palautteisiin liittyvä toiminto, jonka tarkoitusta en ole vielä keksinyt. Polls Tällä toiminnolla luot kätevästi erilaisia kyselyitä. Ratings WordPress mahdollistaa artikkeleiden arvioinnin. Lisäksi on mahdollista arvioida yksittäisiä blogikirjoituksia ja kommentteja. Appearance Blogin ulkoasu ja widgetit. Täältä voit mm. vaihtaa blogin ulkoasun. Users käyttäjien hallinnointi eli kenellä on oikeus kirjoittaa ja kommentoida. Tools tuo tietoja toisesta blogista tai vie tietoja toisen blogiin. Lisäksi voit poistaa sivuston.. 18
Settings asetukset. 19
3. WordPressin imurointi ja asennus WorpPress on Open Source-pohjainen web-julkaisuohjelmisto. Se on ensisijaisesti julkaisutyökalu blogeille, mutta soveltuu erinomaisesti myös pienimuotoiseksi Content Management System järjestelmäksi (CMS = julkaisujärjestelmä). WordPress on eräs maailman levinneimmistä ja arvostetuimmista blogiohjelmistoista, jonka takana on erittäin aktiivinen kehittäjätiimi - ohjelmistosta ilmestyy uusia parannettuja versioita tasaiseen tahtiin. WordPress on helposti räätälöitävissä organisaation käyttöön teemojen avulla ja käyttöliittymään löytyy kielipaketteja useilla kielillä, tietysti myös Suomeksi. Ohjelmistoon on myös tarjolla runsas valikoima erilaisia plug-in-ohjelmia, joiden avulla järjestelmään on helppo lisätä uusia ominaisuuksia. WordPressin hyvyys on huomattu myös erilaisissa kilpailuissa. Vuonna 2009 WordPress voitti palkinnon sarjassa Packt best Open Source CMS Awards. Ja seuraavan vuonna palkinto tuli sarjassa Hall of Fame Open Source Awards. (Wikipedia.) Webissä WodPressin suosio näkyy myös siinä, että monet sivustot käyttävät WordPressiä julkaisualustana. Uusin WordPress on ladattavissa osoitteesta: http://wordpress.org/ Kannattaa aina valita uusin, koska se on tietoturvan kannalta paras vaihtoehto. Tosin nykyisin suomenkielinen versio on hyvin ajan tasalla, joten siksi se paras valinta. http://fi.wordpress.org/ Kun lataus on valmis, on seuraavana vuorossa zip-paketin purku. Kun olet purkanut zip-paketin, on vuorossa siirto webpalvelimelle, jonka jälkeen päästäänkin jo asennusvaiheeseen. Tässä esimerkissä asennan WordPressin omalle koneelle, jossa WAMP. 20
3.1. WordPressin vaatimukset Tässä esimerkissä asentaminen tapahtuu omalle palvelimelle, mutta menetelmä on aivan sama käytettäessä webhotellin palveluja. WordPress vaatii toimiakseen webpalvelimen, jossa on PHPtuki ja MYSQL. Jos jompikumpi puuttuu, ei asennus onnistu. Mikäli asennat WordPressin omalle koneelle, kannattaa asentaa ensin jokin ohjelma kuten WAMP tai XAMPP, jolloin WordPress toimii ongelmitta. Mikäli hankit webhotellia, varmista ensin PHP:n ja MYSQL:n tilanne. Tässä alla esimerkki avaruus.netin webhotellista, jossa on sekä PHP että MySQL. 3.1.1. Tietokannan luominen omalle koneelle Kun koneellasi on webpalvelin ja MySQL, on kaikki lähes valmista asennusta varten. Vielä tarvitaan kuitenkin tietokanta ja sille käyttäjä. Luo uusi käyttäjä ja tietokanta menemällä osoitteeseen: localhost/phpmyadmin/. Valitse välilehti Käyttöoikeudet. Valitse linkki Lisää uusi käyttäjä. Kirjoita käyttäjänimi (wordpress3) ja valitse palvelimeksi localhost. Laita salasana (wordpress3) kahteen kertaan. Laita lisäksi merkki kohtaan Luo samanniminen tietokanta ja anna kaikki oikeudet. 21
Laita jokaiseen kohtaan ruksi. Paina lopuksi painiketta Siirry. Sitten saat ilmoituksen, että uusi tietokanta ja käyttäjä on lisätty. Jos käytät webhotellia, ei tuota em. toimenpiteitä tarvitse tehdä, koska silloin webhotelli on tehnyt ne puolestasi. Tietokannan tiedot 22
käyttäjä: wordpress3 salasana: wordpress3 tietokanta: wordpress3 palvelin: localhost 3.2. WordPressin asennus Mene ensin kansioon, jossa purettu WordPress sijaitsee. Sitten oletkin jo suoraan asennusvaiheessa. 23
Syötä tiedot ja paina Jatka HUOM! Host on 90 % varmuudella aina localhost, oli sitten kyseessä oma kone tai webhotelli. 24
Laita blogillesi otsikko ja käyttäjänimi. Kirjoita pääkäyttäjän salasana kahdesti (wordpress2012). HUOM! Salasanan pitää olla turvallinen, koska asennan omalle koneelle, laitoin salasanaksi wordpress2012. Älä käytä sitä palvelimelle asennetussa versiossa (tietoturvariski). Kirjoita oma s-postisi osoite (tärkeä tieto, esim. voit saada siihen osoitteeseen kadonneen salasanasi). Huom! omalla koneella s-postin lähettäminen ei välttämättä toimi. Lopuksi painat painiketta Asenna WordpPress. Ja nyt kaikki on valmista eli olet asentanut WordPress julkaisujärjestelmän. 25
Voit nyt kirjautua blogiin. Kirjoita käyttäjänimi ja salasana, Ja nyt olet ohjausnäkymässä. 26
Sivustolle pääset kätevästi klikkaamalla blogisi nimeä ja valitsemalla Vieraile sivustolla. Ja tältä se blogi näyttäytyy tavalliselle webin käyttäjälle. 27
Oikeasta yläreunasta löytyy painike, jolla pääset kirjautumaan ulos. Valitse sitten linkki, joka vie blogiisi. 4.3. WordPressin tiedostot ja hakemistot WordPressin muokkaamista helpottaa, jos tietää mitä missäkin sijaitsee ja mitä ne kaikki tiedostot ja kansiot ovat. Näitä tiedostoja joudut siirtelemään webpalvelimelle ftp:n avulla. Osalle kansioista ja tiedostoille sinun ei tarvitse tehdä yhtään mitään. 1. / 2. /wp-admin/ 3. /wp-includes/ 4. /wp-content/ 1. / on blogin juuri. Siellä sijaitsee monia tiedostoja kuten esim. RSS-syöte. Tänne et tee muutoksia juuri koskaan. 2. /wp-admin/ Tässä hakemistossa sijaitsee hallinnointipaneeli. Tähän kansioon sinun ei tarvitse puuttua millään tavoin 3. /wp-includes/ Täällä on erilaisia toimintoja kuten esim. Ajax. Tännekään sinun ei tarvitse tehdä muutoksia. 4. /wp-content/ Tämä on se kaikkein mielenkiintoisin hakemisto muokkauksen kannalta. Tänne kansioon sinun tarvitsee mennä usein. Siellä sijaitsee kaksi alakansiota. /themes/ sisältää ulkoasuun liittyvät tiedostot. /plugins/ sisältää plugarit eli liitännäiset. 28
4. Kirjautuminen WordPressiin WordPressiin kirjaudutaan siten, että osoitteen jälkeen kirjoitetaan wp-admin. Eli juuri äsken luomani blogin osoite on localhost/wordpress3/, jos haluan kirjautua sinne kirjoitan kuten alla olevassa kuvassa eli localhost/wordpress3/wp-admin. /wp-admin Huom! Joissakin tapauksissa kirjautumislinkki voi olla näkyvillä suoraan websivulla. Silloin websuunnittelija on sen sinne sijoittanut. 29
5. WordPressin asetukset WordPressissä on runsaasti vaihtoehtoja asetuksiin, jonka vuoksi se on hyvin muokattavissa. Lähes kaikkeen pääsee vaikuttamaan juuri asetusten kautta. 5.1. Yleiset asetukset Mene ohjausnäkymään eli /wp-admin ja valitse Asetukset (en. Settings ja general). Kyseinen painike vie suoraan yleisiin asetuksiin. Laita ensiksi sivuston otsikko ja alaotsikko kuntoon. Vaihda sähköpostisoite, jos sille on tarvetta. Valitse käytäntö sen suhteen, että voiko sivuston käyttäjäksi rekisteröityä. Suosittelen, ettei kuka tahansa voi rekisteröityä. Jos kuitenkin laitat ruksin tuohon kohtaan, älä ainakaan anna rekisteröityneelle isoa roolia esim. tilaaja on hyvä. Esimerkiksi tällainen menettely ei ole fiksu. Tässä tapauksessa kuka tahansa voisi rekisteröityä eli saada kaikki mahdolliset oikeudet blogiisi. 30
Seuraavaksi tarkistat aikavyöhykkeen (Helsinki) ja kuinka päivämäärä näytetään. Laita lopuksi kellon esitystapa sekä se mistä viikonpäivästä viikko käynnistyy. 31
5.2. Kirjoittamisen asetukset Kirjoittamisen asetuksilla vaikutat siihen millainen on se näkymä, johon kirjoitat. Lisäksi voit vaikuttaa siihen, että julkaistaanko kirjoituksia esim. sähköpostin kautta. Ensimmäiset asetukset vaikuttavat kirjoitusalueen kokoon ja artikkeleiden oletuskategoriaan. Sähköpostin kautta on mahdollista lähettää tekstejä julkaistavaksi. HUOM! WordPress julkaisee kaiken mitä postiin tulee eli valitse tarkoin s-postiosoite, jotteivät tavalliset sähköpostiviestisi vuoda julkisuuteen. Sähköpostia fiksumpi tapa julkaista viestejä suoraan omalta koneelta on Etäjulkaisu. Tästä aiheesta lisää luvussa 17, jossa käsitellään LiveWriteria. Blogilista ottaa päivityspingauksia vastaan osoitteessa: http://www.blogilista.fi/blogipalvelut/ping Jos blogisi on blogilistalla ja siinä on mahdollisuus laittaa pingaus päälle, niin kannattaapi tehdä se. Sitten blogilista saa tiedon automaattisesti aina, kun blogisi päivittyy. 32
Tässä listaa ping-palveluista. http://www.blogilista.fi/blogipalvelut/ping http://rpc.pingomatic.com/ http://www.weblogalot.com/ping http://rpc.twingly.com http://api.feedster.com/ping http://api.moreover.com/rpc2 http://www.blogdigger.com/rpc2 http://www.blogshares.com/rpc.php http://www.blogsnow.com/ping http://www.blogstreet.com/xrbin/xmlrpc.cgi http://bulkfeeds.net/rpc http://www.newsisfree.com/xmlrpctest.php http://ping.blo.gs/ http://api.moreover.com/ping http://ping.feedburner.com http://ping.syndic8.com/xmlrpc.php http://ping.weblogalot.com/rpc.php http://rpc.blogrolling.com/pinger/ http://rpc.technorati.com/rpc/ping http://rpc.weblogs.com/rpc2 http://www.feedsubmitter.com http://blo.gs/ping.php http://www.pingerati.net http://www.pingmyblog.com http://geourl.org/ping http://ipings.com 5.3. Lukemisen asetukset WordPressin oletus on, että teet blogia. Siksi etusivu on aina oletuksena blogi. Eli napsautettaessa linkkiä Etusivu ilmestyy blogin kirjoituksia. 33
Asetuksissa se näyttäytyy siten, että pallukka on kohdassa Uusimmat artikkelit. Jos teet tavallista websisivstoa, jossa blogi ei ole pääjuttu, ei blogi ole etusivulla. Silloin näin kuten alla. Eli linkistä Etusivu avautuu sivu, jonka nimi on Esimerkkisivu. Blogille on tehty oma sivu, jonka nimi on blogi. HUOM! WordPressin käännös määrittelee blogikirjoitukset nimellä artikkelit. Siksi Artikkeleiden sivu on sama kuin blogikirjoitusten sivu. Voit myös määritellä myös kuinka monta blogikirjoitusta näytetään ja kuinka monta uutissyötettä näytetään. Nämä luvut tosin ovat hyviä, joten ei välttämättä tarvetta muutoksiin. Seuraava kohta koskee RSS:ää eli uutisyötteitä. Kyse ei ole blogiteksteistä. Tätä asetusta ei kannata muuttaa. 34
Viimeinen kohta koskee merkistöä. Tätäkään ei kannata muuttaa. 5.4. Keskustelun asetukset Keskustelun asetukset vaikuttavat lähinnä siihen, että kuka saa kommentoida blogikirjoituksia. Asetusten ensimmäisen kohdan rukseista viimeinen eli kolmas kohta on se tärkein eli voiko uusia blogikirjoituksia kommentoida vai ei. HUOM! Jos poistat ruksin kohdasta Salli uusien artikkeleiden kommentointi, mutta joku on jo kommentoinut kirjoitusta, silloin kommentointi on edelleen mahdollista. Seuraava kohta liittyy siihen, että millä ehdoilla saa kommentoida. Yleensä on hyvä, että kommentoija ilmoittaa nimensä ja sähköpostiosoitteensa. Sähköpostin osalta voit valita, että saatko WordPressiltä postia vai ei. Nuo kohdat kannattaa pitää ruksitettuna, jos haluaa tietää blogin tapahtumista. Robottien lisäämiä kommentteja voit vähentää mm sillä, ettet hyväksy suoraan kommentteja, joissa yli 2 linkkiä. Seuraavissa kohdissa voi luetella sanoja, joiden perusteella voi vaikka heittää kommentin suoraan roskiin. 35
Sitten siellä on vielä yksi kohta avatar toiminolle. En suosittele sen aktivoimista, koska se vaan hidastaa selaamista. 5.5. Mediakirjaston asetukset Mediakirjaston asetuksiin ei ole tarvetta tehdä muutoksia. 5.6. Tietosuoja-asetukset Otsikko kuulostaa juhlalliselta, mutta oikeasti on vain kysymys hakukoneista. Suosittelisin pallukkaa kohtaan Salli. 5.7. Osoiterakenteen asetukset Tämä kohta on sivujen löydettävyyden kannalta hyvin merkittävä. Hakukoneille on ongelma löytää artikkelia?p=123. Sen sijaan esimerkki-artikkeli löytyy helposti. Tärkeintä on, että valitset jonkun muun vaihtoehdon kuin ensimmäisen. 36
Kun vielä säädät luokat ja avainsanat, saat siistejä osoitteita. 37
6. Ohjausnäkymä Ohjausnäkymä eli Dashboard Näyttää sen mitä blogissa on viimeksi tapahtunut eli viimeisimmät kirjoitukset ja kommentit näkyvät. Samoin WordPessin kehittäjäyhteisön uutiset tulevat tänne. Tämä painike on vasemmassa palkissa ylimmäisenä. Tämän painikkeen avulla saat nopean katsauksen sivuston tapahtumista. Täältä löytyy myös tietoa siitä mitä WordPressille kuuluu. Kohdassa päivitykset näkyy tietoa päivityksistä. Tämä on kätevä toiminto, koska yleensä päivitykset joutuu tekeekään ftp:n kautta. WordPress on tässä suhteessa hyvin käyttäjäystävällinen eli klikkaat vaan kyseistä kohtaa ja noudatat ohjeita. 38
7. Blogikirjoituksen lisäys, muokkaus ja poisto Blogikirjoituksen on suomenkielisessä versiossa nimellä Artikkelit. Saman valikon alta löytyvät myös avainsanat ja aiheet. 7.1. Blogikirjoituksen lisäys Uuden blogikirjoituksen saat lisättyä suoraan Ohjausnäkymässä, tosin silloin on kyseessä pikajulkaisu eli esim. editori puuttuu. Yleensä pikajulkaisua parempi vaihtoehto on valita Artikkelit ja sieltä kohta Lisää uusi. Sitten otsikko paikoilleen. Ja sitten itse teksti. 39
Lopuksi napsautat painiketta Julkaise. 7.1.1. Blogikirjoituksen asetukset Vasemmalla oleva valikko mahdollistaa runsaasti erilaisia vaihtoehtoja blogikirjoituksen julkaisulle. Voit esim. tallentaa luonnoksen julkaisusta, jolloin blogikirjoitus on tallessa, mutta sitä ei ole vielä julkaistu. Voit määritellä myös blogikirjoituksen näkyvyyden. 40
Oletusarvoisesti blogikirjoitus on julkinen. Jos laitat ruksin kohtaan Kiinnitä tämä artikkeli etusivulle on kyseinen kirjoitus aina blogissa ensimmäisenä. Voit myös suojata kirjoituksen salasanalla tai määritellä sen yksityiseksi. Voit myös määritellä julkaisuajankohdan. Varsin usein himobloggaajat kirjoittavat illalla valmiiksi kolme kirjoitusta ja ajastavat julkaisut siten, että ne ilmestyvät päiväsaikaan. Sitten valikossa on alempana erikoinen kohta nimeltään Muoto. Tässä on kyse siitä, että otsikko jää pois ja tilalle lukee esim. Sivuhuomautus tai Linkki. Ehkä käyttökelpoisin noista on Tilapäivitys, koska se muistuttaa Facebookia, Twitteriä jne. 41
7.1.2. kategoriat ja avainsanat Kun kirjoitat uuden blogimerkinnät, voit lisätä sen johonkin kategoriaan eli luokkaan. Yleensä luokkia on noin väliltä 5-15. Luokan tarkoitus on helpottaa aineiston ryhmittelyä. Tässä alla esimerkki yhdestä luokittelusta. Napsautat linkkiä ja saat heti luokkaan liittyvät kirjoitukset näkyviin. Tagit eli avainsanat kannattaa laittaa jokaiseen viestiin. Sillä tavoin voit niputtaa asioita yhteen. Luokka kattaa aina vain yhden luokan, mutta etikettien avulla voi mennä luokkien yli. Molempia kannattaa käyttää ehdottomasti. 7.2. Blogikirjoituksen muokkaus Pääset muokkaamaan blogikirjoituksia valitsemalla Kaikki artikkelit. 42
Sen jälkeen valitset kirjoituksen ja sen kohdalta Muokkaa. Voit myös valita Pikamuokkauksen, jolloin pääset suoraan blogikirjoituksen asetuksiin. 7.3. Blogikirjoituksen poistaminen Pääset muokkaamaan blogikirjoituksia valitsemalla Kaikki artikkelit. Sen jälkeen valitset kirjoituksen ja sen kohdalta Roskakoriin. HUOM! Roskakori tarkoittaa sitä, että kirjoitukset ovat pois näkyvistä. Voit vielä palauttaa sieltä kirjoituksia. 43
44
8. Editori Editori on sama sekä blogikirjoituksille (ks. luku 7) sekä tavallisille websivuille. Artikkeli ( en Post) tarkoittaa blogimerkintää eli yhtä merkintää päiväkirjaan. Kun kirjoitat uuden blogimerkinnän tulee se automaattisesti ylimmäksi. Staattiset sivut pysyvät paikallaan (ks. luku 11). Ne eivät mene arkistoon eivätkä painu sivulla alaspäin, kun lisäät uudet blogimerkinnän. Tässä editorin toiminnot järjestyksessä vasemmasta yläkulmasta. HUOM! Jos näkyy vain yksi rivi niin pain painiketta, joka on eka rivin viimeinen. Ylärivin painikkeet Lihavoitu, jonka avulla voit lihavoida tekstin. Kursivoitu, jonka avulla voit kursivoida tekstin. Yliviivaus, jonka avulla voit yliviivata tekstin. Järjestämätön lista, jonka avulla voit tehdä järjestämättömiä listoja. Numeroitu lista, jonka avulla voit tehdä numeroituja listoja. Kappalelainaus, jonka avulla voit asettaa kappaleita lainauksiksi. Tasaa vasemmalle, jonka avulla tasaat tekstin vasemmalle. Keskitä, jonka avulla keskität tekstin. Tasaa oikealle, jonka avulla tasaat tekstin oikealle. Lisää tai muokkaa linkki, jonka avulla pääset lisäämään tai muokkaamaan jo olemassa olevaa linkkiä. 45
Poista linkki, jonka avulla poistat olemassa olevan linkin. Lisää more-tagi (lue merkki), jonka avulla teet artikkelista tiivistelmän ja tällöin se näytetään etusivulla tiivistettynä linkaten kokonaiseen artikkeliin. Oikoluku päällä tai pois, jonka avulla oikoluet kirjoittamasi tekstin kirjoitusvirheiltä. Koko ruudun näyttö päällä tai pois, jonka avulla pääset kirjoittamaan artikkelia tai sivua koko ruudun editorilla. Palaat peruseditoriin painamalla painiketta uudelleen. Näytä tai piilota lisävalinnat, jonka avulla pääset laajentamaan tai supistamaan editorin ominaisuuksia. Alarivin painikkeet HUOM! Jos näkyy vain yksi rivi niin pain painiketta, joka on eka rivin viimeinen. Muotoilu, jonka avulla pääset luomaan otsikkoja. Alleviivaus, jonka avulla alleviivaat tekstin. Tasaa molemmat reunat, jonka avulla tasaat tekstin molemmille reunoille. Huomaa, että tässä muodossa oleva teksti on vaikealukuista. Valitse tekstin väri, jonka avulla voit valita tekstille värin. Liitä muotoilematon teksti, jonka avulla lisäät sivulle kaikenlaisen tekstimateriaalin ilman erilaisia kuvia tai tehosteita Liitä Word-asiakirjasta, jonka avulla pääset liittämään tekstiä editoriin suoraan Word-asiakirjasta. Poista muotoilu, jonka avulla poistat kaiken muotoilun tekstistä. Lisää erikoismerkki, jonka avulla lisäät tekstiisi erikoismerkkejä. 46
Pienennä sisennystä, jonka avulla pienennät sisennystä. Suurenna sisennystä, jonka avulla suurennat sisennystä. Kumoa, jonka avulla kumoat aiemmin editorilla tehdyn toiminnon. Tee uudelleen, jonka avulla teet kumotun toiminnon uudelleen. Ohje, jonka avulla saat lisäapua editorin käyttöön. Hyvät ohjeet editorin käyttöön ovat myös tässä. 8.1. Kuvan lisääminen Editorissa ei enää ole painiketta kuvan lisäämistä varten. Kuvan lisääminen on kuitenkin aiempaa helpompaa tästä puutteesta huolimatta. merkitse ensin kohta kursorilla, jonne aiot kuvan lisätä. Sitten painat painiketta Lisää/siirrä media. Sitten napsautat painiketta Valitse tiedostot. Valitset sen jälkeen koneeltasi tiedoston ja lopuksi painat painiketta Lisää tekstiin. Kun kuva on siirretty WordPresiin voit valita sen myös Mediakirjastosta tai Galleriasta. Myös URL-osoitteesta voit lisätä kuvan, mutta sitä en suosittele. 47
9. Media Media Voit lisäillä tiedostoja kuten ääntä kuvaa ja liikkuvaa kuvaa. Täällä näkyvät myös WorPresiin tuomasi mediatiedostot. Täältä saat myös selville tiedostojen URL-osoitteet, jos satut tarvitsemaan sellaista tietoa esim. linkityksen yhteydessä. Valitset tiedostoton ja sitten muokkaa. Tämän jälkeen URL-osoite näkyy kohdassa Tiedoston URL. 48
10. Linkit Links Voit lisäillä sivulle linkkejä ja luokitella niitä kategorioihin. Voi näyttää esim. tällaiselta. HUOM!. Sivullasi ei välttämättä näy linkkejä bloggrollissasi. Kyse on siitä, että onko kyseinen Wimpain käytössä vai ei (ks. luku 13.2.). 49
50
11. Sivut Pages Staattiset sivut eli tavalliset www-sivut, ei siis blogimerkinnät. Jos teet tavallisen websivuston ilman blogia, on tämä oikea kohta. Voit lisätä sivustoosi sivuja napsauttamalla linkkiä Lisää uusi. Järjestys voi olla täysin erilainen kuin haluat. Esimerkiksi tässä alla Esimerkkisivu on väärässä kohtaa. Ongelma korjaantuu, kun laitat kyseiselle sivulle suuren numeron kohtaan Järjestys. Nolla tarkoittaa aakkosjärjestystä. Kannattaa laittaa uusi järjestys muotoon 10 20 30 eli sivujen väliin mahtuu sen jälkeen lisäämään uusia sivuja. Jos sivuja vähän kuten tässä niin voisi tehdä näin eli Ekalla on numero 1, Toinen on 2, Viides on viisi ja Esimerkkisivu on 6. Silloin näkymä on kuten alla. HUOM! Etusivu on silti aina ensimmäinen ja siihen voit vaikuttaa vain asetuksissa (ks. luku 5.3. Lukemisen asetukset) Voi myös tehdä sivuja toisten sivujen alle. Jos Esimerkkisivu sijoitetaan Eka-sivun alle, tarvitsee määritellä ainoastaan Esimerkkisivun asetuksia. Laitetaan Yläsivuksi Eka. 51
Lopputulos on se, että syntyy allasvetovalikko. 52
12. Kommentit Comments Blogiin lisätyt kommentit. Voi hyväksyä kommentteja tai heittää huonot kommentit roskikseen. Moni kommentti blogisi voi olla botin kirjoittama. Botti on robotti, joka syytää mainoksia kaikkiin paikkoihin, joihin se pääsee käsiksi. Sellaiset viestit kannatta merkata spämmiksi eli roskaviestiksi. 53
13. Ulkoasu Appearance Blogiin ulkoasu ja vimpaimet. Tämä on kaiken keskus, kun on kyse siitä miltä sivustosi näyttää. 13.1. Teemat eli sivupohjat WordPressiin löytyy teemoja eli sivupohjia kuten kuoria kännyköihin ja enemmänkin. Sivupohjan idea on, että ulkoasu pysyy samana, vaikka sisältö muuttuu. Helpoiten löydät sivupohjia sivustolta WordPress Theme Viewer (http://themes.wordpress.net/). Sivuston ideana on, että näet kuinka malli toimii ja sitten vasta suoritat valinnan. Voit myös etsiä mallia värin ja palstojen mukaan. Haluan sinistä ja kahdella palstalla. Lopuksi painike Find Themes. 54
Kun sopiva löytyy klikkaan sen nimeä. Sitten download. Pura zip-paketti kansioon themes. 55
Sitten valitset painikkeen Ulkoasu. Sitten etsit asennetun teeman ja napsautat Ota käyttöön. Uuden mallin asentaminen on juuri noin helppoa. Sinun tarvitsee ainoastaan tehdä kaksi asiaa siirrät mallin oikeaan kansioon, /wp-content/themes/ Ole tarkkana, että jokaisella mallilla on oma kansio ja kansiossa on kaikki mitä malliin kuuluu. mene hallintapaneelin ja aktivoi teemaa napsauttamalla sen pienoiskuva tai sitten pelkää teeman nimeä. Useimmat mallit ovat nykyään mallia "widget-ready", jolloin niillä on tuki plugareille. Jotkut mallit vaativat myös plugien asentamista. Netistä löytyy runsaasti malleja WordPressille. Tässä parhaimmat http://www.noupe.com/design/a-collection-of-great-new-wordpress-themes.html http://designmodo.com/video-multimedia-wordpress-themes/ http://iwebask.com/blog/2011/10/12/10-best-three-column-free-wordpress-themes/ http://designmodo.com/restaurants-cafes-wordpress-themes/ http://iwebask.com/blog/2011/10/12/19-cool-websites-to-design-wordpress-blog/ http://wpdressing.com/medical-wordpress-themes-for-health-care-clinics/ 13.1.1. Oikotie sivupohjan asennukseen Yllä kuvasin sivupohjan asennuksen siten kuin se tavallisesti menee. WordPress on tehnyt tähänkin kohtaan oikotien. Sinun tarvitsee vain valita painike Ulkoasu. 56
Sitten napsautat Asenna teemoja. Voit etsiä suoraan hakusanalla ja sitten napsautat linkkiä Asenna. Voit myös asentaa zip-paketit suoraan tätä kautta. 13.2. Vimpaimet eli widgetit Widgetit tulevat aina sivupalkkiin. WordPressillä on itsellään useita widgettejä, joita voit raahaamalla lisäillä sivullesi. Otat vaan widgetistä kiinni, vedät sen sivuplakkiin ja irrotat. 57
Samalla tavalla voi poistaa widgettejä. Tai sitten alitset poista. Widgettien avulla säädät palkin tismalleen sellaiseksi kuin haluat. Yksi widgetti on ylitse muiden. Se on text eli Teksti. Sen avulla voit itse kirjoittaa ihan vapaasti tekstiä. Se mahdollistaa myös sen, että otat sivustollasi käyttöön muiden tekemiä widgettejä. Esim. Twitterillä on omia widgettejä. 58
https://twitter.com/about/resources/widgets Haet vaan koodin ja liität sen tekstikenttään. 59
Toinen widgetti yli muiden on Mukautettu valikko. Mukautetun valikon avulla voit luoda valikon sivupalkkiin. Luo kuitenkin sitä ennen sivut, jotka haluat valikkoon (ks. luku 8). Varsinaisen valikon luot sitten kohdassa Valikot. Lisää uusi valikko, anna sille nimi ja liitä siihen sivut. 60
Ja tältä se valmis valikko näyttää. 13.3. Yläpalkin asetukset WordPress muuttuu koko ajan kohti helpompaa muokattavuutta. Jotkut sivupohjat mahdollistavat yläpalkin kuvan vaihtamisen suuoraan selaimen kautta. Silloin tarvitsee vain painaa painiketta Header Image an color. 13.4. Muokkain Muokkaimen avulla voit muokata sivupohjien koodia sekä CSS:ää. 61
Valitset vaan mitä muokataan. Esim. tässä muokataan virheilmoitusta Sivu ei löytynyt. Eli suomennettuna tuo olisi fiksumpi. 62
14. Lisäosat eli pluginit Plugins blogin pluginit. Pluginit ovat pieniä ohjelmapätkiä, jotka suorittavat toimintoja. Joku ohjelmoi, jottei sinun tarvitse ohjelmoida. Kyseessä voi olla pieni ohjelma, joka valitse sattumanvaraisesti sivulla näytettävän kuvan. Osa plugineista on sellaisia, ettei sinun tarvitse tehdä mitään paitsi aktivoida ne. Osa vaatii sitten asetusten säätämistä. Tässäkin suhteessa WordPress on kehittynyt. Sinun tarvitsee ainoastaan valita Lisää uusi. Sitten valitset Suositellut. Kun sopiva löytyy, valitset Asenna nyt. Sitten otat lisäosan käyttöön. HUOM! Jos plugin sisältää asetuksia löytyy sen asetukset kohdasta Asetukset. 63
Mitä sitten kannatta asentaa? Tässä muiden tekemiä listoja http://www.thedailyanchor.com/2009/03/23/31-wordpress-plugins-to-enhance-your-blog-and-life/ http://www.sitesketch101.com/15-incredible-wordpress-plugins-you-need/ http://www.tripwiremagazine.com/2011/12/best-wordpress-plugins.html http://speckyboy.com/2008/01/26/top-30-wordpress-plugins-that-are-actually-useful/ http://wphacks.com/wordpress-plugins/ http://bestpluginsforwp.com/19-best-plugins-wordpress/#.t278cdwneso 14.1. Editorin virittäminen WordPressin editori on köykäinen, mutta sekin asia on korjattavissa. Valitse Lisää uusi. Kirjoita hakukenttään Ultimate TinyMCE. Asenna Ulimate TinyMCE. 64
Ota lisäosa käyttöön. Valitse sen jälkeen Lisäosat, koska vielä on tarkoitus säätää asetuksia. Sitten valitset asennetun pluginin asetukset. Laita ruksi siihen kohtaan, jonka toiminnon haluat mukaan. Esim. tässä otan mukaan fonttien määrittelyt, taulukot, kuvien muokkauksen ja youtuben. Lopuksi napsautat painiketta Update options. 65
Nyt editorisi on saanut yläriville uusia painikkeita. 14.2. Kuvagalleria Valitse Lisää uusi Valitse Gallery. Valitse NextGEN gallery. Ota lisäosa käyttöön. Sitten napsauta gallery. 66
Valitse Add gallery/images. laita gallerialle nimi. Liitä sitten sivuille näin kuten alla [nggallery id=x] eli jos esim. gallreia, jonka id 1 [nggallery id=1] 14.3. Monta sivupohjaa samalla sivustolla WordPressin ajatus on, että yksi sivusto ja yksi sivupohja. Jokainen sivu ja blogikirjoitus saa samanlaisen sivupohjan. Jos haluaa jotakin muuta, on otettava plugin avuksi. Etsi Page Theme. 67
Asenna plugin. Ota lisäosa käyttöön. Mene sitten kohtaan Ulkoasu -> Teemat. Valitse Page Theme. Laita ruksi kohtaan, jolle haluat valita teeman. Esim. tässä tapauksessa vain sivuille (pages). Ja kun menet muokkaamaan sivuja, on siellä uusi linkki. 68
Napsauta kohdasta Theme, kun haluat vaihtaa teeman. Valitse teema eli sivupohja ja paina lopuksi Set theme. Ja se on heti valmis. 69
70
15. Käyttäjät Users käyttäjien hallinnointi eli kenellä on oikeus kirjoittaa ja kommentoida. 15.1. Uuden käyttäjän lisääminen Valitse ensin Lisää uusi. Sitten syötät uuden käyttäjän tiedot. Tuossa ei ole muuta ihmeellistä kuin roolit, jotka esittelen tässä alla. 71
Tilaaja (Subscriber) Tilaaja voi lukea ja kommentoida kirjoituksia. Avustaja (Contributor) Avustaja voi edellä mainittujen lisäksi kirjoittaa artikkeleita sekä muokata niitä. Hän ei kuitenkaan voi julkaista kirjoittamiaan artikkeleita itse eikä muokata niitä enää julkaisemisen jälkeen. Kirjoittaja (Author) Kirjoittaja voi edellä mainittujen lisäksi myös itse julkaista kirjoittamansa artikkelit. Hän ei kuitenkaan voi muokata artikkeleita enää julkaisemisen jälkeen. Päätoimittaja (Editor) Päätoimittaja voi edellä mainittujen lisäksi muokata, poistaa ja julkaista myös muiden kuin itsensä tekemiä artikkeleita (myös jo julkaistuja). Toimittaja voi kirjoittaa ja muokata artikkeleiden lisäksi sivuja. Hän voi myös moderoida. Pääkäyttäjä (Administrator) Pääkäyttäjä voi edellä mainittujen lisäksi muokata sivuston ulkoasua, hyväksyä ja poistaa käyttäjiä sekä muokata näiden tietoja ja ottaa käyttöön uusia toimintoja asentamalla lisäosia. Super-Pääkäyttäjä (Super Admin) Jos yhden WordPress-asennuksen kautta hallitaan useita blogeja, pystyy Super-Pääkäyttäjä hallinnoimaan koko verkostoa. (Wordpress 3.0 ohjeet.) 72
16. Työkalut Tools tuo tietoja toisesta blogista tai vie tietoja toisen blogiin. 16.1. Kirjoitusten siirtäminen toisesta blogista Mikäli sinulla on blogi voi tuoda kirjoitukset uuteen WordPress blogiisi. Lopputulos riippuu siitä mistä järjestelmästä tuot tietoja. Useimmilla blogeilla on valmiita tuontifunktioita: Blogger, LiveJournal, Movable Type jatypepad. Tuominen tapahtuu "Manager" -> "Import" ja sitten valitaan blogi, josta tuodaan- Valitse tools ja sitten Import Tämän jälkeen avautuu lista vaihtoehdoista. 73
Tuo tietoja WordPressistä Napsautetaan sitä ja päästään valitseman tiedosto. Otetaan vielä liitetiedostot mukaan. 74
Kun homma toimii, pääsee eteenpäin. Bloggerista tuominen Valitse tools ja sitten Import Sitten listasta Blogger Ja jatketaan eteenpäin Jos olet jo kirjautunut Bloggeriin saat varmistuspyynnön. 75
Sitten pääset valitsemaan mitä tuodaan. 16.2. Kirjoitusten vieminen toiseen blogiin WordPressissä on toiminto vie eli export. 76
17. Offline työkalut Offline työkalujen avulla voit kätevästi kirjoittaa ja muokata blogimerkintöjä. Kokeilemisen arvoinen on ainakin Microsoftin Live Writer. Sen avulla blogikirjoitusten teko on helpompaa kuin Wordin käyttö. Kuvatkin saat mukaan kätevästi ihan CTR+V käskyllä eli copy & paste toimii. Lisää aiheesta löydät seuraavista linkeistä. http://thewrongadvices.com/2007/06/04/offline-blog-editing-tools/ http://smashinghub.com/20-top-desktop-blogger-editors-to-manage-your-blog-easily.htm 77
18. Valmiin teeman muokkaaminen Wordpressin mukana tuli ennen valmis teema nimeltä default. Sen pystyi muokkaamaan, kun kopioi sisällön toiseen kansioon. Teema löytyy seuraavalla kaavalla eli ensin wamp -> www -> kansio -> wp content -> themes Kun kopiointi on valmis eli kansiossa themes on kansio omalla nimelläsi ja sen sisällä on sama sisältö kuin kansiossa default on kaikki kunnossa. HUOM! Yllä on kuvattu aikaa ennen versiota. Suosittelen, että teet kaiken uudemmalla versiolla eli Wordressin versiolla 3.0 tai sitäkin uudemmalla. Jatkossa käsittelen vain versiota 3.0.. Versiossa 3.0 oletusteema muuttui toisenlaiseksi ja samalla vaihtui nimi. Löydät teeman kansiosta themes. Polku sinne on WAMPilla c:\wamp\www\wordpress3\wp-content\themes 78
Teeman nimi ei ole enää default vaan twentyten. Mikäli haluat muokata kyseistä teemaa, kopioi koko kansion sisältö uuteen kansioon. Tässä esimerkissä sisältö on kopioitu kansioon jari. Avaa seuraavaksi omasta kansiostasi (jari) tiedosto style.css ja tee muutokset. Theme Name: (Teeman nimi) Theme URI: (missä lisätietoja teemasta) Description: (kuvaus) Author: (kuka loi teeman?) 79
Version: (versio) Tags: etiketit, joilla teema kuvaillaan Mene tämän jälkeen ylläpitoon ja valitse oma teemasi (Ota käyttöön). Kun olet ottanut teeman käyttöön saat ilmoituksen, että teemasi tukee myös vimpaimia. 80
18.1. Teeman tiedostot Teemalla on aina kaksi tiedostoa style.css ja index.php. Ulkoasun määrää style.css ja mukaan otettavat elementit päättää index.php. Tai on tietenkin muitakin tiedostoja, mutta jotta teeman voi valita tarvitaan nuo kaksi em tiedostoa. Kansiossa images ovat teeman tarvitsemat kuvat ja kansiossa languages sijaitsevat käännökset esim tässä tapauksessa sieltä löytyvät suomenkieliset käännöstiedostot. Oletusteemassa ovat nuo kaksi kansiota, mutta tiedostoja on enemmän. 81
404.php (kun sivua ei löydy eli 404 virheilmoituksen sivu) archive.php (arkisto) attachment (liitteet) author.php (tarvitaan, jos halutaan kirjoittajan mukaan) category.php (luokittelu) comments.php (säätää kommentit, jos puuttuu niin oletusten mukaisesti) editor-style.css (määrää editorin ulkoasun) editor-style rtl.css (tarvitaan, kun pitää kirjoittaa oikealta vasemmalle) footer.php (alapalkki) functions (toiminnallisuutta ilman vimpaimia) header.php (sivuston yläosa eli yläpalkki jse yläpuolella olevat) index.php (kaikista tärkein, se kerää mukaan muut elementit, Pakollinen) license.txt (lisensehdot) loop.php (kaivaa blogimerkinnät) onecolumn-page.php (ei lainkaan sivupalkki) page.php (usein sama kuin index.php tarvitaan lähinnä yksittäistä sivua varten) rtl.css (oikealta vasemmalle tekstiä) screenshot.png (pieni kuva sivun ulkoasusta) search.php (haku) sidebar.php (sivupalkki) single.php (usein sama kuin index.php tarvitaan lähinnä yksittäistä blogimerkintää varten) style.css (sisältää tiedot teeman luojasta ja säätää ulkoasun, Pakollinen) tag.php (etiketit) 18.2. Sanasto Template (malli, pohja). Template säästää työaikaa, koodi kirjoitetaan vain kerran. Template file (mallitiedosto) sisältää sivuston eri osat. Theme (teema) Sisältää kaikki tiedostot sivuston rakennetta ja ulkoasua varten. Sotketaan yleensä templateen. 18.3. Hierarkia Sivupohjan eli hemplaten hierakian ylimmäisenä on index.php. Se kokoaa yhteen muut palaset kuten esim 404.php, joka tarkoittaa löytämätöntä sivua. Tässä kuusi tärkeintä tiedostoa templaten rakentamista varten. 82
83
19. Sivupohja Tässä alla esimerkki siitä miltä sivuston template eli sivupohja voisi näyttää. Yläosan nimi on header.php. Sinne tulee yleensä tietoja blogista kuten esim. blogin nimi ja kuvaus. Index.php sisältää kirjoitukset ja kommentit. Se on merkattu punaisella, koska se muuttuu. Muut osat ovat lähes koko ajan muuttumattomia. Kun kirjoitat esim. blogimerkinnän tapahtuu muutos juuri tuossa osassa sivua. Sidebar.php sisältää yleensä arkiston ja kategoriat. Footer.php on osa, jossa tietoja esim. tekijästä. 84
20. Teeman tekeminen verkossa Verkosta löytyy paikkoja, joissa voit tehdä oman teemasi. Yleensä teema tallennetaan omalle koneelle zip-pakettina. 20.1. WordPress Theme generator http://www.yvoschaap.com/wpthemegen/ Tämä on varsin helppokäyttöinen ja hyvin toimii leiskan koon ja palstojen muuttaminen. Oikealla näkyy syntynyt tilanne Kun ulkoasu on valmis voit tallentaa sen. 85
HUOM! Vanha versio, 20. 2 Dotemplate http://www.dotemplate.com/ Tämä on loistavan helppo käyttää. Aktivoit elementin ja pääset muokkaamaan sitä. Huono puoli on, ettei täysin valmista templatea WordPressille. 20.3. CSSEZ http://www.cssez.com/ Tämä on hankala käyttää ja lopuksi vie kyllä tiedot WordPressiä varten, mutta ei vakuuta. Jotenkin hankala käyttää. Lisäksi pitää vielä reksiteröityä. 86
87
21. Uuden teeman luominen Luo uusi kansio nimellä kubric samaan paikkaan missä muutkin teemat sijaitsevat. Käy tämän jälkeen lataamassa ja asentamassa teema, jonka nimi on Kubrick. Ota teema myös käyttöön. Alla prosessi on kuvattu kuvasarjana. 88
Nyt sivuillasi on vanha kunnon Kubrick teema, joka oli pitkään Wordpressin oletusteema. Käytämme tätä teemaa, koska sen päälle on helppo rakentaa ja sitä on helppo muokata. tavoite on muokkaamme sivut seuraavaan kuosiin. 89
Koodit ja kuvat löydät sivulta www.perttimouhu.net Kubrick käyttää taustaa, joten ne pitää poistaa. Taustat löytyvät CSS koodista ja header.php tiedostosta. <style type="text/css" media="screen"> <?php // Checks to see whether it needs a sidebar or not if ( empty($withcomments) &&!is_single() ) {?> <?php } else { // No sidebar?> #page { background: url("<?php bloginfo('stylesheet_directory');?>/images/kubrickbgwide.jpg") repeat-y top; border: none; } <?php }?> </style> 90
Sivusta tulee riisuttu malli. Laitetaan taustaväri kohdilleen. body { font-size: 62.5%; /* Resets 1em to 10px */ font-family: 'Lucida Grande', Verdana, Arial, Sans-Serif; background: #BFD682; color: #333; text-align: center; } 91
Muutetaan myös sivuston leveys, jotta se on 900 pikseliä ja haemme uuden yläpalkin. Lisäksi muutamme valkoisen värin tekstin taustalle. Laitamme valkoisen kehyksen leveydeksi 5 pikseliä. #page { background-color: #D7DA9E; margin: 20px auto; padding: 0; width: 900px; border: 5px solid #fff; } #header { background-color: #BFD682; margin: 0 0 0 1px; padding: 0; height: 140px; width: 900x; background-image: url('images/ylapalkki.gif'); } Kuvan koko yläpalkissa muutetaan. #headerimg { margin: 0; height: 140px; width: 100%; } Alapalkin leveys muutetaan. #footer { padding: 0; margin: 0 auto; width: 900px; clear: both; } Seuraavaksi muokkaamme alapalkin koodia eli footer.php. Jätämme sinne ainoastaan seuraavat koodit. <?php wp_footer();?> </body> </html> 92
Sitten laitamme navigaatioon ja jälleen käymme sivuilla www.perttimouhu.net, josta kaappaamme navigaatioon tarvittana koodin. Koodi tulee header.php sivun loppuun. <div id="navi"><div id="menycontainer2"> <ul id="navlist"> <?php wp_list_pages('sort_column=menu_order&depth=1&title_li=');?> </ul> </div> Keltaisella on merkitty toiminnallinen osa, joka hakee kaikki sivut. Sitten vielä lopuksi css: loppuun tuon navigaatioon CSS koodi ja sivu on valmis. #menycontainer2 ul{margin:0; padding: 10px 0px 4px 4px ; text-align:left; border:none; background:white; font:120% Verdana,Arial,sans-serif; font-weight:bold; color:#fff; background-color: transparent; } #menycontainer2 li{display:inline; margin-left:0em } #menycontainer2 ul a{text-decoration:none; padding:0px 7px 0 5px; border-width:1px; border-style:none solid none none; border-color:#fff; } #navi {padding: 0px; background-image: url('images/navi.gif'); background-repeat: repeat-x; } #menycontainer2 a:link{color:#fff} #menycontainer2 a:visited{color:#fff} #menycontainer2 a:hover{background-color: transparent; color:#000} #menycontainer2 a#current{background-color: transparent; color:#fff} 93
Käydään vielä header osiosta poistamassa ylimääräiset tekstit. Poista merkatut rivit. <div id="header" role="banner"> <div id="headerimg"> <h1><a href="<?php echo get_option('home');?>/"><?php bloginfo('name');?></a></h1> <div class="description"><?php bloginfo('description');?></div> </div> </div> <div id="navi"><div id="menycontainer2"> <ul id="navlist"> <?php wp_list_pages('sort_column=menu_order&depth=1&title_li=');?> </ul> </div> 94
22. Staattinen sivu leiskasta koodiksi Ensin pitää olla leiska, joka leikataan palasiksi eli saat lopputuloksena html-tiedoston ja csstiedoston. Alkuasetelma on valmis leiska, joka kuvassa alla. Se leikataan tällä kertaa css-muotoon. Kaava on sama kuin tässä alla olevassa kuvassa. Tässä se varsinainen kuva. Seuraavaksi teemme teemalle oman kansion. Sinne sijoitamme css ja html tiedostot. Etusivu menee näin kuten alla. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd" ><html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fi" lang="fi" > <head> <meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> <meta name="author" content="jari Sarja" /> <meta name="keywords" content="mäntyharju, Tapiola, vakuutukset, mökinvuokraus" /> <meta name="description" content="pertti haluaa tarjota ihmisille rauhallisen paikan rentoutumiseen ja vapaa-ajan viettoon. Pertti huolehtii, että kaikki on kunnossa, kun vuokralainen tulee lomanviettoon. Pertti opastaa vuokralaiset mökille ja huolehtii myös laitteiden käytön opastuksesta." /> <title>pertti Mouhu: mökinvuokrausta Mäntyharjussa</title> <link rel="stylesheet" href="tyyli.css" type="text/css" media="screen" /> </head> <body id="etusivu"> <div id="centrering"> <div id="kolumncontainer"> <div id="sidhuvud"></div> <div id="navi"><div id="menycontainer2"> <ul id="navlist"> <li><a href="http://www.perttimouhu.net/index.php" id="etusivunav">etusivu</a></li> 95
<li><a href="http://www.perttimouhu.net/siikanen1/index.php" id="siikanen1nav">siikanen I</a></li> <li><a href="http://www.perttimouhu.net/siikanen2/index.php" id="siikanen2nav">siikanen II</a></li> <li><a href="http://www.perttimouhu.net/akkijarvi/index.php" id="akkijarvinav">äkkijärvi</a></li> <li><a href="http://www.perttimouhu.net/turniemi/index.php" id="turnieminav">turniemi</a></li> <li><a href="http://www.perttimouhu.net/kuvia/index.php" id="kuvianav">kuvia</a></li> </ul> <li><a href="http://www.perttimouhu.net/pertti/index.php" id="perttinav">pertti</a></li> </div></div> <div id="kolumn1"><div class="teksti"> <h1>vuokramökit </h1><p>mökit (4 kpl) sijaitsevat rauhallisella paikalla Kinnin kylässä. Mökit on sähköistetty vuonna 2007. </p> <p>kirkasvetinen Siikanen on karun kaunis, puhdas ja kalaisa järvi, jossa rehevyyttä ei lainkaan. Vastarannalla on noin 2 km rakentamatonta rantaa. Saman rannan lähimmät mökit (2 kpl) sijaitsevat noin 400 m päässä. Matkaa Mäntyharjun keskustaan on 18 km, josta päällystettyä tietä 16 km. Alueella on hyvät sienestys- ja marjastusmaastot.</p> <p>kysy myös Tapiolan edulliset vakuutukset: Pertti Mouhu puh. 0400-395955. </p> </div> </div> <div id="kolumn2"> <img src="kuvat/etusivu.jpg" alt="siikanen I" align="right" /></div> </div> </div> </body> </html> CSS menee näin body {margin: 0; padding: 0; background: #BFD682; } #centrering { width: 900px; margin-right: auto; margin-left: auto; 96
background: #fff; } #kolumncontainer { float: left; border: 5px solid #fff; background: #D7DA9E; } #sidhuvud {padding: 0px; background-image: url('gfx/ylapalkki.gif'); background-repeat: no-repeat; height:140px; width:900px; } #navi {padding: 0px; background-image: url('gfx/navi.gif'); background-repeat: repeat-x; height:36px; width:900px; } #kolumn1 {float: left; width: 350px; padding: 10px;background: #D7DA9E;} #kolumn2 {float: left; width: 500px; padding: 10px;background: #D7DA9E;} #menycontainer2 ul{margin:0; padding: 10px 0px 4px 4px ; text-align:left; border:none; background:white; font:100% Verdana,Arial,sans-serif; font-weight:bold; color:#fff; background-color: transparent; } #menycontainer2 li{display:inline; margin-left:0em } 97
#menycontainer2 ul a{text-decoration:none; padding:0px 7px 0 5px; border-width:1px; border-style:none solid none none; border-color:#fff; } #menycontainer2 a:link{color:#fff} #menycontainer2 a:visited{color:#fff} #menycontainer2 a:hover{background-color: transparent; color:#000} #menycontainer2 a#current{background-color: transparent; color:#fff} body#etusivu a#etusivunav, body#siikanen1 a#siikanen1nav, body#siikanen2 a#siikanen2nav, body#akkijarvi a#akkijarvinav, body#turniemi a#turnieminav, body#kuvia a#kuvianav, body#pertti a#perttinav { text-decoration: underline; color: #fff; background-color: transparent;}.teksti, p { font-family: verdana, helvetica, sans-serif; font-size:90%; line-height:140%; color:#000; } h1 {font-family: verdana, helvetica, sans-serif; color:black; font-size:130%; font-weight:bold;} h2 {font-family: verdana, helvetica, sans-serif; color:black; font-size:120%; font-weight:bold;} 98
h3 {font-family: verdana, helvetica, sans-serif; color:#000; font-size:110%; font-weight:bold;}.kuva { margin: 10px; clear: both; } Siirrä seuraavaksi molemmat tiedostot kansioon wp-content/themes kansioon, jonne teet vielä oman kansion. Sitten kopsaat oletustyllistä tiedostot comments.php ja searchform.php luomaasi kansioon. Tyyli voisi valmiiksi olla nimeltään style.css ja html-tiedosto index.php. Style.css Kansiosat default käyt kopsaamassa tyylin yläosasta tiedot ja laitat oman tiedoston (style.css) alkuun. /* Theme Name: Mouhu Theme URI: http://www.perttimouhu.net Description:Pertti Mouhun kotisivut 99
Version: 1.0 Author: Jari Sarja Author URI: http://www.jarisarja.fi */ Muokkaa tuonne omat tietosi. Sen jälkeen tyyli on valmis eikä siihen enää tarvitse koskea. Header.php Kopioi seuraavaksi kaikki yläpalkkiin koodi index.php-tiedostosta ja tallenna se tiedostoon header.php Seuraavaksi menet kansioon default ja sieltä tiedostosta head.php kopsaat omaan kansiosi header.php-tiedostoon seuraavat palikat. Seuraavaksi Navigation Menu (wp_list_pages) Muuta LI kohdat pois ja tilalle <?php wp_list_pages('sort_column=menu_order&depth=1&title_li=');?> Header on sen jälkeen näin: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/tr/xhtml1/dtd/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" <?php language_attributes();?>> <head profile="http://gmpg.org/xfn/11"> <meta http-equiv="content-type" content="<?php bloginfo('html_type');?>; charset=<?php bloginfo('charset');?>" /> <title><?php wp_title('«', true, 'right');?> <?php bloginfo('name');?></title> <link rel="stylesheet" href="<?php bloginfo('stylesheet_url');?>" type="text/css" media="screen" /> <link rel="pingback" href="<?php bloginfo('pingback_url');?>" /> 100
<style type="text/css" media="screen"> <?php // Checks to see whether it needs a sidebar or not if ( empty($withcomments) &&!is_single() ) {?> #page { background: url("<?php bloginfo('stylesheet_directory');?>/images/kubrickbg-<?php bloginfo('text_direction');?>.jpg") repeat-y top; border: none; } <?php } else { // No sidebar?> #page { background: url("<?php bloginfo('stylesheet_directory');?>/images/kubrickbgwide.jpg") repeat-y top; border: none; } <?php }?> </style> <?php if ( is_singular() ) wp_enqueue_script( 'comment-reply' );?> <?php wp_head();?> </head> <body id="etusivu"> <div id="centrering"> <div id="kolumncontainer"> <div id="sidhuvud"></div> <div id="navi"><div id="menycontainer2"> <ul id="navlist"> <?php wp_list_pages('sort_column=menu_order&depth=1&title_li=');?> </ul> </div></div> Index.php Tämän jälkeen laitetaan index.php kuosiin eli aluksi haetaan heder.php paikoilleen. 101
<?php get_header();?> <div id="kolumn1"><div class="teksti"> <?php if (have_posts()) :?> <?php while (have_posts()) : the_post();?> <div <?php post_class()?> id="post-<?php the_id();?>"> <h2><a href="<?php the_permalink()?>" rel="bookmark" title="permanent Link to <?php the_title_attribute();?>"><?php the_title();?></a></h2> <?php the_author()?> --></small> <small><?php the_time('f js, Y')?> <!-- by <div class="entry"> rest of this entry»');?> <?php the_content('read the </div> <p class="postmetadata"><?php the_tags('tags: ', ', ', '<br />');?> Posted in <?php the_category(', ')?> <?php edit_post_link('edit', '', ' ');?> <?php comments_popup_link('no Comments»', '1 Comment»', '% Comments»');?></p> </div> <?php endwhile;?> <div class="navigation"> Older Entries')?></div> <div class="alignleft"><?php next_posts_link('«<div previous_posts_link('newer Entries»')?></div> class="alignright"><?php 102
</div> <?php else :?> <h2 class="center">not Found</h2> here.</p> <p class="center">sorry, but you are looking for something that isn't <?php get_search_form();?> <?php endif;?> </div> </div> <div id="kolumn2"> <img src="kuvat/etusivu.jpg" alt="siikanen I" align="right" /></div> </div> </div> </body> </html> Page.php Tee lopuksi kopio index-tiedostosta ja laita sille nimeksi pagephp. Lopuksi sinulla on tällainen lopputulema. 103
Screenshot.png Laita vielä kansioon screenshot.png eli kuva käyttöliittymstä ja sen leveys 300 pikseliä ja muotona png. 104
23. Hyvä tietää navigaatiosta Navigaatio on usein hukassa. Asennetaan jälleen Kubrickin teema, mutta haetaan sitten seuraavanlainen plugin: PixoPoint Menu Plugin. Eli Kubrickin sivupohja on tällainen kuin kuvassa. Siitä puuttuu yläpalkki, jokaon lähes jokaisessa julkaisujärjestelmässä. Korjaamme tilanteen. Asennamme plugarin plugin: PixoPoint Menu Plugin. 105
Ja nyt ihan erilainen näkymä jahka ensin muokkaamme tiedostoa heder. php. Heitä pois keltaisella merkattu alue ja laita tilalle alla oleva koodi. <div id="header" role="banner"> <div id="headerimg"> <h1><a href="<?php echo get_option('home');?>/"><?php bloginfo('name');?></a></h1> <div class="description"><?php bloginfo('description');?></div> </div> </div> <hr /> <div id="header" role="banner"> <div id="headerimg"> <h1><a href="<?php echo get_option('home');?>/"><?php bloginfo('name');?></a></h1> 106
<div class="description"><?php bloginfo('description');?></div> </div> </div> <?php if (function_exists('pixopoint_menu')) {pixopoint_menu();}?> <hr /> Sitten pientä säätöä, jotta navigaatio osusi nappiin. Versiossa 3.0 tuo navigaatio on mukana automaattisesti eli alla olevassa kuvassa Etusivu, Kolmas, Toinen. 107
Eli CSS:ää näin. 108
Ja siellä CSS: alku näin. #pixopoint_menu1 { width:740px; height:35px; background:#b41520 url("../images/dazzle_red.png") repeat-x; background-position:50% 0; margin:0 0 0 10px ;} 24. Blogi mukaan fiksusti Blogin saat fiksusti mukaan seuraavalla kaavalla. Teet blogille oman sivun ilman sisältöä. Sitten asetuksista määrittelet, että etusivu on etusivu ja blogisivu on tavallinen blogi. 109
Eli asetukset näin kuten kuvassa. HUOM! Artikkeleiden sivu tarkoittaa sivua, jolla näytetään kaikki blogimerkinnät. Blogimerkinnän käännös artikkeliksi on hämäävä. 23.2. Alasivut Voi tehdä alasivuja kaikkialle muualle paitsi etusivulle. Valitset vaan sivun, jonka alle haluat toisen sivun. Tässä kuvassa näet kuinka alasivu on erilainen kuin muut. 110
Ja kuinka se on tehty? Ei tarvitse kuin valita isäntäsivu eli minkä alle sivu tulee. Ja noin se sitten näkyy. 111
112
24. Wordpress julkaisujärjestelmänä Wordpress on lähinnä blogia varten, mutta kun hieman taivuttelet niin se on myös julkaisujärjestelmä. Tarvitset pluginin://pixopoint.com/products/simplecms/ Purat kansioon plugins ja sen jälkeen otat sen käyttöön. Sitten ylläpidosta kaikki turha on poissa. 113
Seuraavasi kannattaa asentaa yksinkertainen teema, jota voi muokata. http://pixopoint.com/2008/03/14/simplecms_theme/ 24.1. Frontendin kautta muokkausta Tähän vaivaan on lääkkeenä Front-end Editor 114
Tämän jälkeen sivuilla tuplaklikkaus siellä missä muutosta tarvitaan. 115
Lähteet Helppokäyttöiset blogipalvelut. [Online http://fi.wikibooks.org/wiki/helppok%c3%a4ytt%c3%b6iset_blogipalvelut] Luettu 22.3.2012. Lipsanen, N. (2012). Wordpress 3.0 ohjeet. [Online: http://www.domnik.net/info/wordpressohjeet/30/kayttajatasot.shtml]. Luettu 25.3.2012. Samarbeta online. [Online: http://sites.google.com/site/samarbetaonline/skrivatillsammans/posterous]. Luettu 22.3.2012. Wikipedia [Online: http://en.wikipedia.org/wiki/wordpress]. Luettu 21.3.2012. Wikipedia [Online: http://fi.wikipedia.org/wiki/blogger] Luettu 21.3.2012. 116
Liite 1. Sanasto BlogRoll. BlogRoll on kokoelma linkkejä toisiin blogeihin. Mikäli BlogRoll on käytössä, se löytyy useimmiten etusivulta sivupalkista. Blogeoisie. Sanojen "Blog" ja "Bourgeoisie" sekoitus. Ironiaa sisältävä sana, joka viittaa bloggaajien "eliittiin", eli suosituimpiin ja kuuluisimpiin bloggaajiin. Bloggaaja. Henkilö, joka pitää blogia. Blogi tai weblog. Blogi on verkkosivu, johon kirjoitetaan sisältöä aikajärjestyksessä ja sisältö näytetään tavallisesti käänteisessä aikajärjestyksessä. Monien blogien tärkeä ominaisuus on, että lukijoilla on mahdollisuus kirjoittaa blogiin kommentteja interaktiivisesti. Blogosfääri. Monen blogin yhteenliittymä. Ping. Tarkoittaa signaalin lähettämistä toisiin sivustoihin tai blogeihin kun uusi artikkeli on julkaistu. Useat sivustot ylläpitävät jatkuvasti ja reaaliajassa listan blogeista jotka lähettävät niille ping-viestejä. Näiden sivustojen avulla on mahdollista seurata viimeksi päivitetyt blogit. Pingback. Pingback on menetelmä jonka avulla blogaaja saa automaattisesti viesti kun linkki toisessa blogissa osoittaa hänen blogiinsa. RSS. RSS on joukko verkkosyötemuotoja joita käytetään usein päivitetyn digitaalisen sisällön julkaisemiseen. Tällaista sisältöä ovat esimerkiksi blogit, uutiset ja podcastit. RSS-dokumentti, jota kutsutaan "syötteeksi", "verkkosyötteeksi" (feed, web feed) tai "kanavaksi", pitää sisällään joko tiivistelmän kyseisen www-sivun sisällöstä tai koko tekstin. RSS:n käyttö mahdollistaa, että ihmiset voivat seurata suosimiensa sivustojen muutoksia automaattisesti. RSS-lukijaohjelma. Lukijaohjelma tai RSS-lukijaohjelma (RSS on lyhenne sanoista Really Simple Syndication) on ohjelma, joka mahdollistaa tavan välittää materiaalia tiedon tuottajilta tiedon kuluttajille. Perusidea on, että RSS-lukijaohjelma käy katsomassa käyttäjän puolesta, ovatko esimerkiksi suosikki blogin sivut päivittyneet, ja ilmoittaa käyttäjälle mahdollisesta uudesta sisällöstä. 117
Liite 2. Webpalvelin omalle tietokoneelle Jotta voisit kokeilla WordPressiä omalla koneellasi tarvitset sitä varten palvelimen omalle koneelle sekä tulkin, joka tulkaa skriptikielen. Vaihtoehtoja ovat Windowsille: EasyPHP, XAMPP ja WAMP. Mackäyttäjien on tyydyttävä joko XAMPPiin tai MAMpiin. Asenna itsellesi joku edellä mainituista ohjelmista. Tässä nauhoitettuja ohjeita asennukseen. MAMP Macille http://www.screencast.com/t/nzg3njfjzje XAMPP Windowsille (Suosittelen) http://screencast.com/t/svf2opazi Easyphp Windowsille http://screencast.com/t/ysxzntawxp5t WAMP Windowsille (Suosittelen) http://screencast.com/t/8qpzlhaxew Windowskäyttäjille löytyy kirjoitettuja ohjeita seuraavista linkeistä. WAMP XAMPP HUOM! Macissä toimii myös XAMPP, mutta yllä olevan listan XAMPP ohje on tehty Windowsille. 118
Liite 3. WAMPIn asennus WordPressin käyttöön omalla koneella tarvitaan webpalvelin jossa on PHP-tuki ja MySQL-toetokanta. Helpoiten noiden asentaminen onnistuu, kun asennetaan WAMP. WAMP on muunnosta LAMPista eli kyseessä on ohjelmistokokonaisuus ja alkukirjain osoittaa onko käyttöjärjestelmänä Windows vai Linux. Tässä lyhyesti koko paketti W tarkoittaa Windowsia A tarkoittaa Apace serveriä M tarkoittaa MySqlää P tarkoittaa PHP:tä Nykyisin WAMPin asennus on helppoa, koska kaikki osaset eli AMP ovat saatavissa yhdessä paketissa. WAMP on ilmainen ohjelma ja sitä jaetaan GPL lisenssillä. Asennettuasi WAMPin pääset tekemään omalla koneella kokonaisia sivustoja ja myös testaamaan niitä omalla koneellasi. Et tarvitse webhotellia, kaikki on koneellasi. WAMPin käyttö on suositeltavaa monestakin syystä. Ehkä painavin syy on, että kannattaa tehdä virheet omalla koneella. Silloin koko maailma ei huomaa, että sivustosi on ihan sekaisin. Toinen painava syy on, että päästään eroon FTP:n käytöstä. Eli jokaista pientä muutosta ei tarvitse aina tehdä niin että muutat, jonka jälkeen siirrät ftp:llä tiedoston ja taas testaat. WAMPin asennus Suunnista ensin WAMPin sivuille: http://www.wampserver.com/en/ 119
Valitse Downloads ja viimeisin paketti. Tässä kuvassa viimeisin on heinäkuulta 2009. Jos lataus ei ala niin paina linkkiä. Mennään suoraan asennukseen eli Run. Paina seuraavaksi Run. 120
Paina Next. Hyväksy lisenssiehdot ja paina Next. 121
Älä vaihda kansiota. Laita ruksit sen mukaan haluatko piikäynnistyspainikkeen ja/tai pikakuvakkeen. 122
Paina Install painiketta. Valitse oletusselain. Tässä Explorer, koska koneellani ei muuta. 123
Tällä ei niin kovin väliä. Voit antaa olla kuten kuvassa. Sitten polkaistaan WAMP käyntiin. HUOM! Sammuta Skype viimeistään tässä vaiheessa. 124
Palomuuri vinkaisee tässä vaiheessa, koska koneellesi asennetaan serveriä. Tällä kertaa ei kuitenkaan mikään haittaohjelma, joten sallitaan. Katso alaplakista kuvake. Suunnista paikkaan http://localhost 125
Nyt WAMP on asennettu ja se on toiminnassa. 126