Yhteydenottolomakkeen räätälöinti
Muokkaa yhteydenottolomake kaupan tarpeisiin selkeäksi, turvalliseksi ja asiakaspalvelua tukevaksi kokonaisuudeksi.
Written by Petro Mäntylä
Updated at March 5th, 2026
Sisällysluettelo
Muokkaa yhteydenottolomake kaupan tarpeisiin selkeäksi, turvalliseksi ja asiakaspalvelua tukevaksi kokonaisuudeksi.
Johdanto
Tässä ohjeessa kerrotaan, mitä AI Commercen yhteydenottolomakkeessa voidaan räätälöidä, mitä backend tukee ja miten liitteet kannattaa toteuttaa. Ohjeen avulla voit suunnitella lomakkeesta asiakkaalle mahdollisimman helpon käyttää ja samalla varmistaa, että asiakaspalvelu saa käsittelyyn tarvittavat tiedot ilman turhia kenttiä.
Mitä yhteydenottolomakkeessa voi räätälöidä
Yhteydenottolomake on AI Commercessa muokattava ja integroitavissa kaupan tarpeisiin. Integraatiokumppani voi päättää esimerkiksi seuraavista asioista:
- kenttien määrä ja järjestys
- otsikot, placeholderit ja painiketekstit
- lisäkentät, kuten puhelin, yritys, tilausnumero tai aihe
- liitetiedoston lataus
- sijoittelu popupina, sisältöblokissa tai Builderio-rakenteessa
Suositukset ja parhaat käytännöt
- Pidä pakolliset kentät minimissä: nimi, sähköposti ja viesti riittävät useimmissa tapauksissa.
- Käytä viestikentässä merkkilaskuria, jos haluat ohjata asiakasta kirjoittamaan tarkemman kuvauksen.
- Lisää lisäkenttiä, kuten tilausnumero tai yrityksen nimi, vain jos ne tukevat asiakaspalvelun prosessia.
- Jos liitteet ovat hyödyllisiä, käytä olemassa olevaa upload-komponenttia ja lähetä backendille vain valmiit tiedostolinkit.
- Säilytä roskapostisuojaus käytössä: reCAPTCHA ja honeypot kannattaa pitää mukana kaikissa toteutuksissa.
Suositeltu toteutustapa vaiheittain
-
Määritä lomakkeen minimisisältö
Aloita mahdollisimman kevyestä lomakkeesta. Useimmissa tapauksissa riittää, että asiakkaalta pyydetään:- nimi
- sähköposti
- viesti
-
Lisää vain tarpeelliset lisäkentät
Lisää kenttiä vain silloin, kun ne aidosti helpottavat käsittelyä asiakaspalvelussa. Tyypillisiä lisäkenttiä ovat:- puhelin
- yritys
- tilausnumero
- aihe
-
Ohjaa viestin laatua viestikentässä
Tee viestikentästä riittävän väljä ja harkitse merkkilaskurin käyttöä, jos haluat ohjata asiakasta kirjoittamaan tarkemman kuvauksen. -
Pidä roskapostisuojaus mukana
Varmista, että toteutuksessa säilyvät:- reCAPTCHA
- honeypot-kenttä
-
Toteuta liitteet erillisellä upload-flow’lla
Jos yhteydenottolomakkeessa tarvitaan liitteitä, suositeltu toimintamalli on:- uploadataan tiedosto ensin olemassa olevalla upload-flow’lla
- talletetaan palautunut destination-linkki
- lähetetään contact submitin mukana
files-taulukossa
-
Valitse lomakkeelle sopiva sijoittelu
Lomake voidaan toteuttaa esimerkiksi:- popupina
- sisältöblokissa
- Builderio-rakenteessa
Mistä editoidaan
Nykyisestä frontendistä löytyy valmiita esimerkkejä kontakti- ja upload-toteutuksista:
-
Popup-yhteydenottolomake:
src/popups/contact/Contact.svelte -
Builder / sisältöblokkiin tarkoitettu lomake:
src/modals/custom/ContactForm.svelte -
Tiedostojen upload-logiikan esimerkkitoteutus:
src/pages/quote/Uploads.svelte -
Tiedoston valintakomponentti:
src/modals/inputs/FileUpload.svelte
Käytännössä liitteellinen contact form kannattaa toteuttaa niin, että upload hoidetaan quote-toteutuksen mallilla ja lopullisessa contact submitissä backendille lähetetään vain tiedostojen destination-linkit.
Mitä backend tukee
Normaali yhteydenottolomakkeen backend tukee viestin lähettämistä ja tallentamista. Viestin pituus voi olla tällä hetkellä vähintään 20 merkkiä ja enintään 2000 merkkiä.
Lisäksi backend tukee valinnaisia lisäkenttiä ja liitteitä. Frontend voi siis lähettää vain tarvitsemansa kentät, eikä kaikkia tarvitse näyttää asiakkaalle.
Integraatiokumppaneille
Pääpolku: POST /service/contact/send
Alla on kevyt kuvaus niistä kentistä, joita backend tukee normaalissa yhteydenottolomakkeessa.
Pakolliset kentät
| Kenttä | Kuvaus |
|---|---|
name |
Asiakkaan nimi. |
email |
Asiakkaan sähköpostiosoite. Käytetään vastausosoitteena ja validointi on pakollinen. |
enquiry |
Varsinainen viesti. Backend hyväksyy 20–2000 merkkiä. |
recaptcha |
reCAPTCHA-token lähetyksen validointiin. |
Valinnaiset kentät
| Kenttä | Kuvaus |
|---|---|
company |
Yrityksen nimi. |
telephone |
Puhelinnumero. |
orderId |
Tilausnumero, jos yhteydenotto liittyy tilaukseen. |
subject |
Yhteydenoton aihe. Näkyy viestin otsikoinnissa ja tallennuksessa. |
warehouse |
Toimipiste- tai varastotieto, jos halutaan ohjata viestiä tai lisätä kontekstia. |
source |
Lähde- tai lisätietokenttä, jos integraatio haluaa välittää mistä yhteydenotto tuli. |
files |
Lista tiedostolinkkejä. Muoto on taulukko merkkijonoja, esimerkiksi valmiiksi uploadattuja destination-URL-osoitteita. Backend ei odota binääristä tiedostoa tässä pyynnössä, vaan valmiit linkit. |
honeypot |
Roskapostisuojan kenttä. Tulee jättää tyhjäksi. |
Frontend-toteutuksen huomio liitteille
Jos haluat lisätä liitteet contact formiin, suositeltu toteutustapa on seuraava:
- Uploadataan tiedosto ensin olemassa olevalla upload-flow’lla.
- Talletetaan palautunut destination-linkki.
- Lähetetään contact submitin mukana
files-taulukossa.
Hyvä referenssi tähän on frontendissä:
src/pages/quote/Uploads.sveltesrc/modals/inputs/FileUpload.svelte
Yhteenveto
Paras lopputulos syntyy, kun yhteydenottolomake pidetään asiakkaalle mahdollisimman selkeänä ja näkyvissä ovat vain käsittelyn kannalta olennaiset kentät. Hyvä seuraava toimenpide on tarkistaa nykyinen lomaketoteutus, päättää tarvittavat lisäkentät ja varmistaa, että mahdolliset liitteet lähetetään backendille valmiina tiedostolinkkeinä.
Avainsanat
- AI Commerce yhteydenottolomake
- contact form
- liitetiedostot lomakkeella
- reCAPTCHA honeypot
- POST /service/contact/send
- frontend upload flow
- tilausnumero yhteydenotto
- Builderio lomake
- contact submit files