Lomakkeet GravityForms-lisäosalla

Gravity Forms on helppokäyttöinen, luotettava ja monipuolinen lomaketyökalu. Gravity Forms -lisäosalla voi tehdä WordPress-sivustolle helposti uusia ja editoida olemassa olevia lomakkeita. Tässä ohjeessa kerrotaan yleisimpien lomakkeiden rakentamisesta, editoimisesta ja julkaisemisesta.

Täyden listan ohjeista ja neuvoista löydät Gravity Formsin omista käyttöohjeista.

1. Uuden lomakkeen luominen

Kirjaudu sisään WordPress-sivustollesi ja navigoi vasemmasta reunasta kohtaan Lomakkeet. Valitse valikosta Uusi lomake.

Anna lomakkeelle informatiivinen nimi sekä lyhyt kuvaus. Kerro kuvauksessa esimerkiksi, mitä tietoa lomakkeella kerätään ja mille sivulle se on tarkoitus laittaa.

Paina Luo lomake -painiketta ja Gravity Forms luo sinulle uuden, tyhjän lomakkeen.

Jokaiseen lomakkeeseen pitää huomioida seuraavat osat, joita käsitellään tässä ohjeessa seuraavissa luvuissa:

  • Lomakkeen kentät
  • Asiakkaalle näkyvät vahvistukset lomakkeen lähetyksestä (kiitos viestistä, uudelleenohjaus toiselle sivulle)
  • Sähköpostiviestit (GravityFormsissa ”ilmoitukset”)

2. Kenttien lisääminen lomakkeeseen

Gravity Forms -työkalussa on paljon erilaisia kenttävaihtoehtoja. Eri vaihtoehdot on ryhmitelty työkalun oikeaan reunaan: Standardikentät, Edistyneet kentät, Artikkelikentät, Hinnoittelukentät. Tässä ohjeessa käsittelemme Standardikenttiä sekä muutamia tärkeimpiä edistyneitä kenttiä.

Voit lisätä uuden kentän klikkaamalla haluamaasi vaihtoehtoa oikeasta reunasta. Voit myös raahata uuden kentän haluamaasi kohtaan.

Voit järjestellä kenttiä raahaamalla niitä uuteen järjestykseen ja valmis lomake noudattaa samaa järjestystä, kuin missä kentät ovat editointitilassa. Esimerkiksi valitsemalla kentät Yksi rivi tekstiä, Pudotusvalikko sekä Tekstikappale lomake näyttää editoimattomana seuraavanlaiselta.

Kenttien editoiminen käsitellään Seuraavassa luvussa. Eri kenttävaihtoehdot ja niiden variaatiot käsitellään luvussa 3. Kenttävaihtoehdot.

2.1. Kenttien editoiminen

Pelkkä kentän valitseminen ei vielä riitä, vaan kenttää täytyy editoida. Vie hiiri kentän päälle ja editointinäppäimet ilmestyvät. Pieni nuoli avaa editointi-ikkunan. X-ikonista voit poistaa kentän ja keskimmäinen ikoni kopioi kentän. Avaa editointivaihtoehdot nuolesta.

Jokaisella kentällä on omanlaisensa editointimahdollisuudet. Tässä luvussa käsittelemme niitä asetuksia, jotka ovat kaikille samat ja käytämme esimerkkinä Yksi rivi tekstiä -kenttää. Muiden kenttätyyppien erikoisominaisuudet käsitellään luvussa 3. Kenttävaihtoehdot.

Yleiset-asetukset

Yleiset välilehdellä voit muokata kentän perustietoja.

Kentän nimiö -kohtaan kirjoitettu nimi näkyy sivustolla lomakkeen täyttäjälle. Nimi-teksti näkyy oletusarvoisesti kentän yläpuolella.

Kuvaus-teksti antaa lisätietoja käyttäjälle, kuinka kenttä tulisi täyttää. Kuvausteksti näkyy oletusarvoisesti kentän alapuolella.

Merkkien enimmäismäärä määrittelee, montako merkkiä vastauksessa saa olla.

Sallittujen arvojen maski -kohdan valitsemalla voi muokata kentän oletusarvoa. Tätä kenttää voidaan käyttää, jos vastaus halutaan ehdottomasti tietyssä formaatissa, kuten päivämääränä, puhelinnumerona tai postinumerona.

Suosittelemme kuitenkin mieluummin valitsemaan oikeanlaisen kentän Edistyneet kentät -valikon alta, kuin kikkailemaan sallittujen arvojen maskilla.

Edistyneistä kentistä löydät kaikki peruslomakkeita varten tarvitsemasi vaihtoehdot. Eri kenttävaihtoehtoihin päästään luvussa 3. Kenttävaihtoehdot.

Säännöt-kohdalla rajoitetaan ja hallitaan lomakkeen täyttöä.

Jos valitset kohdan Pakollinen, kenttään ilmestyy tähti pakollisen kentän merkiksi eikä lomaketta voi lähettää, jos kenttä on täyttämättä.

Jos valitset kohdan Ei kopioita, käyttäjä ei pysty täyttämään lomaketta samalla arvolla kahta kertaa. Valinnalla estetään esimerkiksi yhden ihmisen osallistuminen arvontaan monta kertaa tai täyttämästä rekrylomaketta useampaan otteeseen.

Muista tallentaa muutokset painamalla aika ajoin oikeassa reunassa olevaa Päivitä-nappia.

Ulkoasu-asetukset ja Lisäasetukset

Ulkoasu-välilehdellä tehdään tarkentavia määrityksiä ja Lisäasetukset-välilehdellä säädetään kentän oletusarvoa ja näkyvyyttä.

Vihjeteksti syöttää kentän sisälle himmeällä näkyvän selitystekstin.

Kuvauksen sijainti -valinnalla voit vaihtaa Yleiset-välilehdellä lisätyn kuvaustekstin paikkaa.

Vahvistusviesti-kenttään voit lisätä oman tekstin, joka näytetään käyttäjälle, jos hän on täyttänyt kentän väärin.

CSS-luokan nimi -kenttä täytetään vain, jos lomakkeeseen halutaan tehdä ulkoasupoikkeuksia. Yleensä siihen ei ole tarvetta.

Kentän koko säätelee, onko kenttä pieni, keskikokoinen vai suuri.

Lisäasetuksista tarvitsee peruslomakkeessa säätää yleensä korkeintaan Oletusarvoa tai Näkyvyyttä.

Jos haluat esitäyttää kentän, syötä haluamasi arvo Oletusarvo-kenttään.

Jos haluat piilottaa kentän näkyvistä poistamatta sitä, valitse Näkyvyys-kohdasta Piilotettu. Jos valitset kohdan Ylläpidollinen, kenttä ei näy sivustolla, vaan pelkästään ylläpitonäkymässä.

Muut eri lomakekenttien muotoilut käydään läpi kunkin kenttävaihtoehdon kohdalla seuraavassa kappaleessa.

3. Kenttävaihtoehdot

Gravity Formsin Standardikentistä löydät kaikki normaalien lomakkeiden kenttätyypit. Loput peruslomakkeissa tarvittavat kentät löytyvät Edistyneistä kentistä. Käymme tässä läpi yleisimmin käytetyt kenttävaihtoehdot.

3.1. Yksi rivi tekstiä

Melkein jokaisesta lomakkeesta löytyy yksi tai useampi kenttä, johon lisätään yksi rivi tekstiä. Tällaisia ovat muun muassa nimi, puhelinnumero, sähköpostiosoite. Kenttä pyytää nimensä mukaisesti yhden rivin tekstiä ja asetuksista voi säätää esimerkiksi maksimimerkkimäärän. Ohjeet tämän kentän editoimiseen löydät edellisestä luvusta 2.1. Kenttien editoiminen.

Useimmiten on kuitenkin tarpeen tarkentaa, millaista tietoa halutaan. Silloin sopivampia kenttiä ovat esimerkiksi Nimi, Puhelin, WWW-sivusto, Sähköposti, Päivämäärä tai Aika.

3.2. Nimi

Nimi kerää nimensä mukaisesti nimitiedon ja antaa oletuksena kaksi kenttää Etunimen ja Sukunimen. Nimikenttiä editoimalla voi lomakkeeseen lisätä myös paikat etuliitteelle tai toiselle nimelle.

3.3. Puhelin ja osoite

Puhelin-kenttää voi editoida sen mukaan, haluaako puhelinnumeron kotimaisessa vain kansainvälisessä muodossa. Muista kuitenkin kertoa myös käyttäjälle, missä muodossa haluat vastauksen, esimerkiksi täyttämällä Kuvaus- tai Vihje-kenttä.

Osoite-kenttä antaa valmiin mallin osoitetietojen syöttämiselle.

Jos haluat tyypillisen suomalaisen osoitemallin:

  • Valitse Otsikon tyypiksi ”Kansainvälinen”.
  • Piilota ”Lähiosoite (2. rivi)” sekä ”Maakunta” -valinnat.
  • Nimeä Lähiosoitteen alanimiöksi Katuosoite.

Puhelin ja Osoite -kentät näyttävät esimerkiksi tältä:

3.4. WWW-sivusto ja Sähköposti

WWW-sivusto-kenttä on käyttövalmis sellaisenaan. Sähköposti-kenttää ei myöskään tarvitse muuten editoida, mutta mikäli haluat, että vastaanottaja vahvistaa sähköpostinsa kahteen kertaan, niin klikkaa Ota käyttöön sähköpostivahvistukset.

WWW-sivusto ja Sähköposti -kentät näyttävät yksinkertaisuudessaan tältä:

3.5. Päivämäärä ja aika

Päivämäärää voi pyytää joko päivämäärävalitsimella, alasvetovalikolla tai päivämääräkentillä. Päivämäärän muotoilu määrittelee missä järjestyksessä päivät, kuukaudet ja vuodet esitetään ja erottaako niitä piste, viiva vai kauttaviiva. Ajan muotoilu puolestaan määrittelee, onko käytössä 12 vai 24 tunnin kello.

3.6. Tekstikappale

Tekstikappaleeseen lomakkeen täyttäjä pystyy kirjoittamaan useamman lauseen mittaisen tekstin. Tyypillisesti tekstikappale-kentällä lomakkeen täyttäjä voi lähettää viestin, kommentin tai palautteen. Tekstikappaleen asetukset ovat samat kuin Yksi rivi tekstiä -kentän, jonka editointiohjeet löydät luvusta 2.1. Kenttien editoiminen.

Tekstikappale-kenttä on yksinkertaisimmillaan tällainen:

3.7. Pudotusvalikko

Pudotusvalikolla annat käyttäjälle vaihtoehtoja, joista hänen tulee valita yksi. Pudotusvalikossa vaihtoehdot ovat aluksi yhtä lukuun ottamatta piilossa, siksi pudotusvalikko on hyvä vaihtoehto, jos vaihtoehtoja on runsaasti. Tyypillisiä esimerkki ovat maavalinta tai syntymävuodet ja -kuukaudet. Pudotusvalikolla voidaan kysyä myös esimerkiksi tuotetta, palvelua tai yhteydenottotyyppiä.

Syötä eri vaihtoehdot Pudotusvalikon Valinnat-kohdassa.

Syötä vaihtoehdot kukin omaan valintakenttäänsä. Lisää tai poista vaihtoehtoja plus- ja miinusnäppämillä. Valitse jokin vaihtoehto oletusarvoksi radiopainikkeista. Vaihda kenttien järjestystä tarttumalla vasemmassa reunassa oleviin nuolinäppäimiin ja raahaamalla. Voit myös valita Lisää kerralla ennaltamäärätyt vastausvaihtoehdot ja hyödyntää valmiiksi rakennettuja vaihtoehtolistoja.

Pudotusvalikko voi näyttää esimerkiksi tältä:

3.8. Monivalinta

Monivalinta-kenttää emme suosittele kenellekään. Se ei ole käyttäjälle yksiselitteinen. Käytä monivalintaa vaativaan kenttään mieluummin valintaruutuja (3.10. Valintaruudut ja Radiopainikkeet).

3.9. Luku

Luku on nimensä mukaisesti lukuarvoja keräävä kenttä. Tätä kenttää kannattaa käyttää silloin, kun erityisen tärkeää, ettei käyttäjä syötä kenttään mitään muuta, kuin numeroita.

Määrittele Luku-kentälle Numeron muotoilu sekä Väli.

Valitse Numeron muotoilusta suomalainen tapa ilmaista numeroita: desimaaleja erottaa pilkku, tuhansia piste.

Väli-vaihtoehdoilla voit antaa kentälle raja-arvot.

Luku-kenttä voi näyttää esimerkiksi tältä:

3.10. Valintaruudut ja Radiopainikkeet

Valintaruuduilla ja radiopainikkeilla annetaan lomakkeen täyttäjälle vaihtoehtoja, joista valita. Toisin kuin pudotusvalikossa, valintaruuduissa ja radiopainikkeissa kaikki vaihtoehdot ovat heti nähtävillä, joten vaihtoehtoja ei yleensä anneta kovin montaa. Valintaruuduilla ja radiopainikkeilla kysytään usein esimerkiksi mielipidettä (hyvä/huono tai samaa mieltä/eri mieltä).

Valintaruutujen ja radiopainikkeiden ero on se, että valintaruuduissa voi valita useamman kuin yhden vaihtoehdon, radiopainikkeissa ei. Valintaruudut ja radiopainikkeet editoidaan muutoin samalla tavalla kuin pudotusvalikkokin (3.7. Pudotusvalikko), mutta radiopainikkeisiin on mahdollista lisätä myös Muu-kohta. Salli ”Muu” -valinta sallii siis käyttäjän lisätä loppuun oman vaihtoehtonsa.

Valmiit radiopainikkeet näyttävät esimerkiksi tältä:

Valintaruudut puolestaan näyttävät tältä:

Tässä ovat kaikki Gravity Forms -työkalun peruskentät, joita normaaleissa lomakkeissa käytetään. Mikäli näistä ei löydy sopivaa kenttää lomakkeeseesi, lähde tutkimaan edistyneempiä kenttävaihtoehtoja joko itse kokeillen tai Gravity Forms -ohjeiden avulla.

4. Lomakkeen asetukset

Lomakkeen asetuksista pääset säätämään loput lomakkeelle erittäin tärkeät ominaispiirteet.

Muista täyttää myös Vahvistukset ja Ilmoitukset, jotta lomakkeen tiedot tulevat oikeaan paikkaan ja lomakkeen täyttäjä saa oikeanlaisen vahvistusviestin.

4.1. Lomakeasetukset

Lomakeasetuksista pääset säätelemään lomakkeen perustietoja sekä ulkoasua. Lomakkeen perustiedoista vaihdat lomakkeen otsikon ja kuvauksen. Lomakkeen asettelusta pääset säätämään kerralla kenttien Nimiön, Kuvauksen sekä Alanimiön paikkaa. Lomakepainikkeesta pääset määrittelemään, mitä lomakkeen lähettävässä painikkeessa lukee.

4.2. Vahvistukset

Älä anna pienen sähköposti-ikonin hämätä, sillä Vahvistuksista määritellään se viesti, jonka käyttäjä näkee sivulla lomakkeen lähetettyään. Vaihtoehtoisesti voit ohjata lomakkeen täyttäjän sivulle joko Sivu tai Edelleenohjaus -vaihtoehdoilla.

Teksti-valinnalla lähetetty lomake katoaa ja Teksti-kenttään syötetty viesti ilmestyy.

4.3. Ilmoitukset (sähköposti)

Ilmoitukset ovat sähköpostiviestejä, joita järjestelmä lähettää automaattisesti, kun käyttäjä täyttää lomakkeen. Gravity Forms luo automaattisesti Ylläpitäjän ilmoitukset -nimisen sähköpostin, joka kertoo ylläpitäjälle, että joku on täyttänyt lomakkeen.

Liukupainikkeella sähköposti-ilmoitukset voi kytkeä pois päältä. Lisää uusi -näppäimellä luot uusia ilmoituksia. Klikkaamalla ilmoituksen nimeä sitä pääsee editoimaan.

Ylläpitäjän ilmoitukset

Oletuksena lomakkeesta löytyy ylläpitäjän ilmoitus, josta täytyy tarkistaa, mihin sähköpostiin ilmoitukset uusista lähetyksistä tulee. Lähtökohtaisesti ne tulevat sivuston admin-sähköpostiin, joka ei välttämättä ole aktiivisessa käytössä tai seurannassa. Vaihda siis Lähetä sähköpostiosoitteeseen -kenttään oikea osoite.

Voit editoida myös lähtevän sähköpostin aihetta ja viestiä sekä lähettäjän sähköpostiosoitetta.

Muista painaa lopuksi Päivitä ilmoitus -nappia sivun alareunasta.

Uusi ilmoitus

Luo uusi ilmoitus, jos haluat esimerkiksi lähettää lomakkeen täyttäjälle automaattisen vastaussähköpostin. Anna ilmoitukselle kuvaava nimi, esimerkiksi: ”Automaattinen vahvistusviesti lomakkeen täyttäjälle”.

Kun haluat lähettää sähköpostin lomakkeen täyttäjälle, valitse ”Valitse kenttä” ja sen jälkeen Sähköpostin vastaanottaja -kentän alasvetovalikosta oikea sähköposti. Huomaa, että jotta voit lähettää lomakkeen täyttäjälle sähköpostin, sinun tulee lisätä lomakkeeseen pakollinen Sähköposti-kenttä (3.4. WWW-osoite ja Sähköposti).

Määrittele Sähköpostin lähettäjän nimi (henkilön tai yrityksen nimi) sekä Sähköpostin lähettäjä (henkilön tai yrityksen sähköposti). Voit määritellä myös, mihin osoitteeseen sähköpostin vastaus lähtee.

Lisää ilmoitukselle Aihe sekä Viesti ja muista tallentaa ilmoitus sivuston alalaidasta.

5. Lomakkeen asettaminen sivustolle

Nyt lomake on valmis asetettavaksi sivustolle. Tai jos et ole ihan varma, Esikatsele lomaketta ja täytä se kokeeksi muutaman kerran.

Kun olet tyytyväinen lopputulokseen, paina mieleesi lomakkeen nimi ja siirry editoimaan sivua, jolle haluat lomakkeen asettaan.

Kun avaat sivun editointitilassa, tekstieditorin yläpuolelta löytyy Lisää lomake -nappi.

Klikkaamalla nappia pääset valitsemaan, minkä lomakkeen haluat sivulle asettaa.

Tästä syystä lomakkeelle kannattaa antaa selkeä ja helposti muistettava nimi. Lomake 5 ja Lomake 6 on vaikea erottaa toisistaan pitkästä nimilistasta.

Mikäli haluat käyttää lomakkeen omaa otsikkoa ja kuvausta, valitse nämä kohdat. Jos taas haluat antaa lomakkeelle oman otsikon ja kuvauksen, ota nämä valinnat pois päältä.

Paina Lisää lomake ja tekstikenttään ilmestyy tämänkaltainen teksti:

[gravityform id=”6″ title=”false” description=”false”]

Lomake näkyy esikatselussa ja sivulla julkaisun jälkeen.

6. Lomakkeen poistaminen

Jos haluat poistaa lomakkeen sivulta, siirry muokkaamaan sivua. Poista sivun tekstinkentästä lomakkeen teksti, joka näyttää kutakuinkin tältä: [gravityform id=”6″ title=”false” description=”false”].

Jos taas haluat poistaa koko lomakkeen, mene Lomakkeet-listaan ja valitse lomakkeesi listasta. Sen jälkeen valitse Massatoiminnot-alasvetovalikosta ”Siirrä roskakoriin” ja klikkaa Hyväksy-painiketta.

Voit myös asettaa lomakkeen epäaktiiviseksi joko Massatoiminnot-valikosta tai liukunäppäimellä.