Sisällöntuotanto eli kirjoittaminen

Sivujen ja artikkelien ero

Sivujen ja artikkelien pääasialliset erot on selvitetty osiossa Kirjautuminen ja Ohjausnäkymä. Lyhyesti: Sivut ovat navigointipalkista löytyviä, staattisempia kokonaisuuksia ja artikkelit ovat esimerkiksi blogipäivityksiä, uutisia tai mitä tahansa julkaistavaa sisältöä. Esimerkiksi sisältönikkari.fi -sivulla oleva WordPress Helposti –sivu näyttää kaikki WordPress-kategorian artikkelit. Oletusasetuksena kaikki luodut sivut yleensä tallentuvat sivuston navigointivalikkoon ja artikkelit näkyvät sivulla, joka on sivuston asetuksissa määritetty ”julkaisujen sivuksi” – oletuksena etusivu.

Sekä sivujen, että artikkelien luominen ja editointi tapahtuu samassa käyttöliittymässä, ainoat käytännön erot ovat siinä, että sivuille voi valita sivupohjan ja artikkeleille voi valita kategorian ja antaa avainasanoja. Lisäksi teemassa voi olla lisätoimintoja, kuten artikkelimuotoja, joiden mukaan artikkelin visuaalinen olemus ja paikka sivustolla määräytyy. Lisäksi yleisesti sivun luomisesta ei lähde esim. Jetpack-lisäosan kautta julkaisua sosiaaliseen mediaan, mutta artikkelin luomisesta lähtee. Seuraavaksi käymme läpi perusasiat WordPressin tekstieditorista ja kaikki kuvatut toiminnot koskevat sekä sivujen, että artikkelien tuottamista.

Uuden tekstin luominen tai vanhan muokkaaminen

Sivuja artikkeleita pääsee muokkaamaan monta eri reittiä käyttäen. Jos teemasi tukee WordPress -palkkia, siitä löytyy -painike, josta voi avat editorin suoraan viemällä hiiren sen päälle ja valitsemalla joko artikkelin tai sivun tai voit klikata samassa palkissa näkyvää Muokkaa -painiketta. Tai voit valita Ohjausnäkymän vasemmasta palkista kohdan Artikkelit tai Sivut ja sen alta Lisää Uusi, tai klikata Muokkaa-nappulaa Kaikki artikkelit tai Kaikki Sivut -luettelossa. Lisäksi suurimmassa osassa teemoja näet Muokkaa/Edit -valinnan sivujen ja artikkelien päällä kun selaat sivustoasi kirjautuneena. Käytit editorin avaamiseeen sitten mitä tahansa yllämainituista menetelmistä, eteesi avautuu yleensä seuraavankaltainen näkymä:

Aivan aluksi annetaan artikkelille otsikko. Jos kysessä on sivu, otsikko tulee periaatteessa näkymään myös navigointipalkissa, joten sana tai pari pitäisi riittää. WordPress ei pakota käyttämään yksilöllisiä otsikoita, joten sivustollasi voi olla useita samannimisiä artikkeleita ja sivuja jos et itse pidä huolta siitä, että otsikot ovat uniikkeja.

Seuraavaksi aletaan vain yksinkertaisesti kirjoittaa sisältöä. Jos olet koskaan käyttänyt tekstinkäsittelyohjelmaa, osaat myös tuottaa sisältöä WordPressillä. Kuvassa näkyvä n WordPressin vakioeditori, mutta teeman mukana voi tulla myös muun näköinen versio. Lisäksi teemat ja lisäosat voivat asentaa uusia painikkeita editorin nappulastoon, mutta oletamme nyt, että käytössäsi on vakioeditori.

Graafinen editointitila

Kun editoit tekstiä graafisessa tilassa, eli editorin oikean yläreunan välilehdistä on valittu se, jossa lukee ”Graafinen” 😉 näyttää WordPress sinulle tuotoksesi lähes WYSIWYG-tilassa, eli melkein-sitä-saa-mitä-tilaa -tilassa. Tämä tarkoittaa sitä, että rivinvaihdot, tekstimuotoilut ja kuvat näkyvät visuaalisessa tilassa ja eri tyylit ja asemoinnit erottaa toisistaan, mutta näkymä ei kuitenkaan vastaa sitä, millaisena se esittäytyy lopullisessa muodossaan sivustolla. Tästä on käyty eri foorumeilla debattia ja mm oma kantani on se, että näin on parempi, koska sisällöntuottaja voi keskittyä sisältöön ja teeman tehtävänä on luoda visuaalinen ilme. Lisäksi teema saatetaan vaihtaa ja kovin tarkasti asemoidut ja säädetyt kuvat ja tekstit voivat mennä sivustolla täysin sekaisin.

Graafisessa editointitilassa tekemäsi rivinvaihdot tulkitaan joko rivinvaihdoiksi tai kappalejaoksi teemasta riippuen ja tekstin muotoilua voi tehdä myös pikanäppäimillä, kuten ctrl/cmd + B (lihavointi)

Muotoiluvalinnat

Perustilassaan Graafisen tilan valikkopalkki näyttää tältä, poislukien punaiset numerot, jotka on lisätty jälkikäteen. Suurin osa nappuloista varmastikin näyttää tutulta, mutta tässä lyhyesti niiden toiminnot. Valitse, eli maalaa teksti ensin ja sitten paina haluaamassi muotoilupainiketta:

Tekstin lihavointi lihavoi tai poistaa lihavoinnin valitusta tekstistä (ctrl/cmd + B)
Tekstin kursivointi (ctrl/cmd + I)
Tekstin yliviivaus
Numeroimaton luettelo
Numeroitu luettelo
Lainaus
Vaakasuora erotinviiva
Tasaa teksti vasemmalle
Keskitä teksti
Tasaa teksti oikealle
Liitä linkki avaa Liitä linkki -dialogin, johon voit kirjoittaa tai liittää internet-linkin (esim: https://www.sivustonikkari.fi) Huom! jos olet kopioinut linkin leikepöydälle, voit vain valita tekstin ja painaa ctrl/cmd + V, WordPress lisää linkin automaattisesti valittuun tekstiin.
Poista linkki poistaa valitusta tekstistä linkin
Lue lisää (more) tätä käytetään jossain teemoissa katkaisemaan teksti ja näyttämään ”Lue lisää” linkki tai nappula.
Oikoluku (ei toimi suomeksi)
Näytä/piilota kaikki työkalut

Viimeistä nappulaa painamalla saat näkyviin toisen rivin valintoja

Edellisten lisäksi on nyt käytössäsi seuraavat toiminnot

Tyylin valinta tämän pudotusvalikon avulla voi valita perustyylien, kuten otsikkojen ja kappaletekstin välillä. Se miten nämä esitetään määritetään teemassa
Alleviivaus
Tekstin tasaus molempiin reunoihin
Tekstin väri tällä valinnalla voit muuttaa teemassa valmiiksi määritellyn tekstin värin.
Liitä ilman muotoiluja tämä on tärkeä näppäin. Normaali crtl/cmd+V tuo leikepöydältä kaikki mahdolliset lisämuotoilut mukanaan. Yleensä et halua näitä muotoiluja omaan tekstiisi. Joskus muotoilujen säilyttäminen voi olla toimivakin ratkaisu, WordPress osaa melko hyvin muotoilla automaattisesti Microsoft Wordistä ja verkkosivuilta tuodut tekstit, joissa on käytetty vakiomuotoiluja, mutta aika usein tekstin muotoilut menevät miten sattuu. Silloin kannattaa poistaa teksti (tai kumota toiminto) ja liittää se muotoilemattomana tätä nappulaa käyttämällä.
Poista muotoilut poistaa kaikki valitun tekstin ja kuvien erikoismuotoilut.
Erikoismerkki-painikkeella voit turvallisesti liittää tekstin sekaan erikoisemerkkejä, joita ei löydy näppäimistöstä, esim: ©, ♥, ∇ jne. Näiden pitää myös olla tuettu sivustollesi valitussa fontissa.
Vähennä sisennystä vähentää valitun tekstin sisennystä yhdellä askeleella
Lisää sisennys sisentää valittua tekstiä yhdellä askeleella. Useampi painallus lisää useamman askeleen.
Kumoa (ctrl/cmd + Z) kumoaa edellisen tässä editorissa tekemäsi toiminnon
Tee sittenkin (ctrl/cmd + Y) toistaa kumotun toiminnon
Näytä pikänäppäimet

Tekstimuokkain, eli html-koodin editointitila

Jos et ole perehtynyt html-koodiin, kannattaa käyttää pääasiassa graafista editointitilaa. HTML-koodiin pääset tutustumaan mm. täällä (englanniksi). Periaattessa html-koodissa merkitään elementtejä alku- ja lopputägeillä, joille voidaan antaa lisämääritteitä.

<h2>Toisen tason otsikko</h2>
<h3>Kolmannen tason otsikko</h3>
<p>Kappale tekstiä <strong>tämä on lihavoitu</strong> ja tältä näyttää <em>kursivointi</em> näin lisätään kuva:<img src="https://sivusto.fi/kuva.jpg" /> ja <a href="http://sivusto.org/linkki/tata_tekstia_ei_nayteta_lukijalle">Tämä teksti on linkki</a>.</p>

<span style="color:#333333; font-size:30px>Tähän tekstiin on tehty lisämääritteitä</span>

<br /> rivinvaihto

/&nbsp; katkeamaton sanaväli (non-breaking-space)

<!-- näin tehdään taulukko (sisennykset vain lukemisen helpottamiseksi-->
<table>
   <tbody>
      <tr>
        <td>Solun teksti</td><td>Toisen solun teksti</td>
      </tr>
   </tbody>
</table>

HUOM! WordPress muokkaa koodia automaattisesti aina kun siirryt Teksti- ja Graafinen -välilehtien välillä. yleisesti ottaen kaikki Javascript poistetaan, kuten myös jotkut ei-tuetut html-elementit. Jos olet lisännyt Javascriptiä, tallenna tuotoksesi tekstitilassa, äläkä enää avaa sitä Graafiseen muokkaustilaan!

Joskus, jos tekemiesi muokkausten jälkeen tekstisi näyttää aivan erilaiselta, kuin mitä olisit halunnut, voit vilkaista pystytkö ehkä säätämään sitä tekstitilassa. Jos se, mitä näet Teksti-välilehdellä alkaa pelottaa, vaihda äkkiä takaisin Graafiseen tilaan ja soita osaavalle Sivusto- tai sisältönikkarille 😉

Kuvien, videoiden ja liitetiedostojen lisääminen

Tämä on ehkä WordPressin parhaita ominaisuuksia. Kaikki lisätään yksinkertaisesti klikkaamalla -nappulaa, jonka jälkeen eteen avautuu seuraavanlainen näkymä:

Tähän voit pudottaa tiedostosi suoraan tai käyttää ”Valitse tiedostot” -painiketta ja etsiä tiedostot omalta laitteeltasi. Jos kuva on jo aikaisemmin siirretty, se löytyy ”Mediakirjasto” -välilehdeltä. Ensin kuvat ladataan, jonka yhteydessä WordPress luo joka kuvalle automaattisesti kolme eri kokoista versiota: Kuvake, keskikokoinen ja suuri. Jos kuva on valmiiksi pienempi kuin nämä automaattiversiot, niitä ei luoda. Näiden automaattisten versioiden koot määritetään joko teemassa tai kohdassa Asetukset/Media. Jos käytössäsi on esimerkiksi loistava Imsanity -lisäosa, pienennetään alkuperäiset kuvatkin lisäosan asetuksissa valitsemaasi kokoon, eikä sinun tarvitse huolehtia siitä, että esimerkiksi järjestelmäkameralla otettu 20 megatavun kokoinen jättikuva tukkisi kävijöiden internet-kaistan tai sinun palvelintilasi. Liitetiedostojen maksimikoko on määritetty yleensä palveluntarjoajasi toimesta. Jos se on sinulle liian pieni, ota yhteyttä palveluntarjoajaasi tai osaavaan Sivustonikkariin.

Kun kuva on ladattu, tehdään muutama valinta seuraavassa näkymässä:

Valinnaiset osat

URL: Kuvan osoite, ei voi muuttaa
Otsikko: Näytetään esimerkiksi kuvagalleriassa tai teemasta riippuen kuvan yhteydessä
Kuvateksti: Näytetään esimerkiksi kuvagalleriassa tai teemasta riippuen kuvan yhteydessä
Vaihtoehtoinen teksti: ns. alt-määrityksen teksti, joka näytetään, jos käyttäjä ei voi tai ei halua nähdä kuvia
Kuvaus: Pidempi kuvausteksti, voidaan näyttää kuvagalleriassa tms.

Pakolliset osat – liitteen esitystapa

Asettelu: (Ei mitään, Oikealle, Vasemmalle, Keskelle) Määrittää kuvan asemoinnin tekstin suhteen.
Linkin kohde: (Mediatiedosto, Liitteen sivu, Ei mitään, Muu URL) Mitä tapahtuu, kun käyttäjä klikkaa kuvaa. Jos olet asentanut Lightbox – lisäosan, se kaappaa ”Mediatiedosto”-linkit kaikille kuville ja ne näytetään sen sijaan LightBox-tyyliin.
Koko (Pienoiskuva, Keskikokoinen, Suuri, Täysikokoinen) Nämä on määritetty joko teemassa tai kohdassa Asetukset/Media

Kun kaikki valinnat on tehty, klikataan ”Lisää tekstiin” -nappulaa ja kuva liitetään tekstieditoriin. Kuvan asettelua ja muita ominaisuuksia voi muuttaa vielä klikkaamalla kuvaa ja valitsemalla kuvanmuokkausriviltä halutun toiminnon.

Toiminnot ovat (vasemmalta oikealle): Tasaa vasemmalle, Keskitä, Tasaa oikealle, Poista tasaus, Muokkaa ja Poista. Muokkaa-valinta avaa kuvan muokkausikkunan, jossa voit muuttaa sen kaikkia ominaisuuksia. Kuvan kokoa voi yleensä myös muuttaa klikkaamalla sitä kerran ja raahaamalla sen nurkkiin ilmestyviä neliöitä.

HUOM! Kuvien asettelut koskevat vain niiden sijoitusta tekstin suhteen. Näillä valinnoilla et pysty saamaan yleensä aikaiseksi hyvän näköistä kuvagalleriaa, vaan kuvat sijoittuvat aina koko tekstikentän oikeaan tai vasempaan reunaan tai keskelle. Keskitetyn kuvan vasemmalla ja oikealla puolella ei yleensä näytetä mitään. Jos haluat lisätä kuvia ruudukkonäkymässä, käytä Kuvagalleria-valintaa tai kilauta osaavalle Sisältönikkarille, joka auttaa sinua 😉

Kuvagallerian lisääminen

Kuvagalleria on kokoelma kuvia, jotka näytetään joko ruudukkonäkymässä tai esimerkiksi diashowna. WordPressiin voi lisätä monenlaisia gallerioita lisäosien avulla. Peruskuvagalleria lisätään valitsemalla ensin ”Lisää media” -painike ja sen jälkeen valitaan gallerian kuvat, sarakkeiden määrä ja esitysmuoto/koko. Jetpack lisäosan mukana tulee mm. Thumbnail Grid ja Diashow -galleriamuodot, jotka ovat vakioruudukkoa mukavampia. Lisäksi teeman mukana voi tulla erilaisia galleriaesityksiä.

Galleriaa muokataan samalla tavoin kuin yksittäistä kuvaakin, eli valitaan editorissa ensin haluttu galleria klikkaamalla sitä ja sitten kynäkuvaketta.

Jos teemasi tukee artikkelikuvaa, kannattaa sellainen aina valita. Sitä käytetään yleensä myös SEO-lisäosien kautta sosiaalisessa mediassa julkaisuun ja hakukoneoptimointiin. Artikkelikuva lisätään yleensä kaikken alimpana olevasta laatikosta, joka on osuvasti nimetty otsikolla Artikkelikuva. Nimi on sama, vaikka kirjoittaisitkin sivua, etkä artikkelia.

Videon lisääminen

WordPress tukee suurinta osaa yleisistä videopalveluista hyvin. Siksi videoita ei kannata ladata omalle sivustolle kaistanleveyttä ja palvelintilaa syömään vaan käyttää esimerkiksi Youtubea tai Vimeota. Video lisätään myös ”Lisää Media” -painikkeella ja sen jälkeen valitaan ”URL-osoitteesta” ja kirjoitetaan tai liitetään halutun videon osoite. WordPress näyttää esikatselun, jos videon liittäminen onnistuu. Helpompi tapa on lisätä video vain liittämällä sen osoite suoraan leikepöydältä. Tällöin kannattaa tehdä ensin yksi rivinvaihto ja lisätä videolinkki tyhjän rivin alkuun (ctrl/cmd + V). Jos liittäminen onnistui, WordPress näyttää esikatselukuvan videosta.

Eri videopalveluilla on lisäksi erilaisia tapoja liittää videoita ja koska WordPress on niin yleinen, osataan niissä yleensä neuvoa kuinka liittäminen kannattaa tehdä.

Esikatselu, näkyvyys, luonnokset ja ajoitus

Koska WordPressin editori ei näytä sisältöä täsmälleen samanalaisena kuin sen lopullinen ulkoasu sivustolla on, kannattaa käyttää esikatselutoimintoa. Se löytyy julkaisulatikosta, joka on joko näytön oikeassa yläkulmassa tai editorikentän alla, riippuen siitä, minkä kokoisessa ikkunassa olet.

Tallenna luonnos-nappula tallentaa version editoimastasi tekstistä, mutta ei vielä julkaise sitä. Se näkyy silloin tilassa Luonnos. Esikatsele avaa uuden välilehden, jossa editoimasi artikkeli tai sivu näytetään täsmälleen siinä muodossa kuin se sivulla tulee olemaan. Näkyvyys-valinta määrittää näytetäänkö sivu tai artikkeli kaikille vai vain sivuston pääkäyttäjille ja sinulle tai suojataanko se salasanalla.

Lisäksi voit valita, julkaistaanko tuotoksesi heti vai ajastetaanko sen julkaisu. Lisäksi voit määrittää julkaisupäivän uudelleen jo julkaistulle artikkelille. Tämä on hyödyllinen toiminto esimerkiksi silloin, kun inspiraatio on päässyt iskemään ja olet kirjoitellut useamman artikkelin putkeen. Niitä ei nimittäin kannata julkaista välttämättä samana päivänä, koska lukijat eivät aina jaksa ahmia kaikkia hengentuotteitasi lämpimiltään ja jotain tärkeää saattaa jäädä väliin. Yleensä blogissa ei kannata julkaista usempaa kuin yksi artikkeli päivässä tai – kahdessa, toki riippuen kohderyhmästäsi.

Ennen kuin painetaan Julkaise-nappulaa, kannattaa vielä varmistaa, että sosiaalisessa mediassa julkaisemiseen tarvittavat tiedot on lisätty ja SEO-optimoinnille tärkeät avainsanat ovat käytössä.

Somejulkaisu, kategoriat ja avainsanat

Kategorioiden ja avainsanojen merkitys on selitetty aiemmassa osiossa, kuten somejulkaisunkin, mutta kerrataan lyhyesti. Kun olet asentanut kaikki suositellut lisäosat, sinulla on käytössäsi automaatti, joka julkaisee tuotoksesi puolestasi sosiaaliseen mediaan ja pitää huolen siitä, että hakukoneet löytävät sivusi ja artikkelisi. Allaolevassa kuvassa on esitetty tämän kyseisen artikkelin valinnat. Kategoria siis määrittää sen, että tämä artikkeli näytetään sivulla WordPress kansantajuisesti ja helposti, Julkaisuasetuksissa on määritetty, että Facebook-julkaisua ei tehdä (koska Facebook-julkaisu kulkee Twitterin kautta) ja lisäksi on määritetty erillinen viesti, jota käytetään somejulkaisussa, Jos erillistä viestiä ei määritetä, julkaistaan vain artikkelin otsikko ja linkki artikkeliin. Avainsanoiksi on valittu allaoleva luettelo tähän artikkeliin soveltuvia termejä. Somejulkaisun lisäksi avainsanoilla voidaan linkittää artikkelit toisiinsa ja luoda esimerkiksi tälläkin sivustolla käytetty avainsanapilvi.

Lopuksi kannattaa vielä tarkistaa, että joko sivun artikkelikuvaksi, tai esim. lisäosan kautta (kuten allaolevassa kuvassa) on määritetty vähintään 1200 x 630 pikselin kokoinen kuva.

Jos artikkelikuvaa tai muuta käytettävää kuvaa ei ole määritetty, käytetään yleensä ensimmäistä artikkelista löytyvää kuvaa tai sivuston yleisesti käytetyksi kuvaksi määriteltyä kuvaa jakamisen yhteydessä.

Julkaiseminen

Kun kaikki yllä kuvattu on tehty ja olet tyytyväinen tekstiisi, olet tarkistanut miltä se näyttää esikatselutoiminnon avulla ja varmistanut sosiaalisen median ja hakukoneoptimoinnin tarvitsemat lisukkeet (tai luotat automaattisesti luotuihin), voit rauhassa painaa Julkaise-nappulaa 😀

Nyt hengetuotteesi lähtee lähes välittömästi jakoon valitsemiisi sosiaalisin medioihin. Voit käydä esim Facebookissa tai Twitterissä katsomassa, miltä lopputulos näyttää ja alkaa seurata Google Analytics- ja WordPress-stats -analytiikan tuloksia siitä, kuinka moni on klikkanut somejulkaisuasi. Lisäksi näet yksittäisen artikkelin kohdalla, montako kertaa se on jaettu kussakin sosiaalisessa mediassa.