Hjem Guider Slik lager du et kontaktskjema i WordPress

Slik lager du et kontaktskjema i WordPress

av naldy
Slik lager du et kontaktskjema i WordPress

Ønsker du å lage et kontaktskjema i WordPress? Alle nettsted trenger et kontaktskjema, slik folk kan kontakte deg om dine innlegg, produkter og tjenester.

I denne guiden vil vi vise deg hvordan du lager et kontaktskjema, steg for steg, uten å røre en eneste linje med kode.

Hvorfor trenger du et kontaktskjema?

Lurer du på hvorfor du trenger et kontaktskjema? Kan jeg ikke bare publisere e-post adressen min på nettstedet, så kan folk kontakte meg på e-post?

Som nybegynner er det mange som er redd for å legge til et kontaktskjema fordi det krever kunnskap om kode som HTML, CSS osv. Da skal vi komme med en gledelig nyhet – i denne guiden trenger du ikke røre en eneste linje med kode.

Tre gode grunner til at et kontaktskjema i WordPress er bedre enn å publisere e-postadressen:

  • Spambeskyttelse – Boter skanner gjennom nettsted regelmessig etter e-post adresser. Når du legger inn e-postadressen din, vil du innen kort tid begynne å motta spam i innboksen.
  • Nødvendig informasjon – Det er ikke alltid når noen sender deg en e-post at du får de opplysningene du trenger. Med et kontaktskjema i WordPress, kan du fortelle brukeren nøyaktig hvilken informasjon du trenger, som for eksempel nettadresse eller telefonnummer.
  • Flere henvendelser – Et kontaktskjema i WordPress som er synlig fra menyen, oppfordrer til at flere tar kontakt. Kontaktskjemaer fungerer også på smarttelefoner og nettbrett, uten å måtte åpne en ny app for e-post.

Hvordan lage et kontaktskjema i WordPress

Nedenfor er et eksempel på et kontaktskjema i WordPress. I denne guiden skal vi vise deg hvordan du kan lage det. Etterpå viser vi deg hvordan du kan legge skjemaet til på en side, eller i sidekolonnen ved hjelp av en widget.

Kontaktskjema i WordPress

STEG 1: Velg en utvidelse for skjemaer

Det første du må gjøre er å installere en utvidelse (plugin) for skjemaer i WordPress.

Tidligere har vi anbefalt å bruke Contact Form 7, som i utgangspunktet en god utvidelse, men den er hverken enkel eller særlig brukervennlig.

Vi anbefaler å bruke WPForms i stedet, fordi:

  • Det er den mest brukervennlige av alle utvidelsene for å lage et kontaktskjema i WordPress.
  • WPForms Lite er helt gratis, og du kan bruke den til å lage et enkelt kontaktskjema.
  • Når du trenger kraftigere funksjoner, kan du oppgradere til premiumutgaven WPForms Pro.

Med WPForms kan du bruke dra- og slipp metoden, og det er ingen krav til å redigere kode.

Installer en utvidelse (plugin) for skjemaer

I denne guiden bruker vi WPForms Lite, fordi det er gratis og enkelt å bruke. For mer avanserte skjemaer bør du vurdere å kjøpe premium-utgaven WPForms.

Du kan installere utvidelsen på nettstedet ditt ved å gå til Utvidelser > Legg til ny.

WPForms - Installer utvidelse

Skriv in «WPForms» i søkefeltet, klikk deretter på «Installer nå». Når utvidelsen er installert, må du aktivere den fra Utvidelser > Installerte utvidelser.

For mer detaljerte instruksjoner, se hvordan installere en utvidelse i WordPress.

Opprett et kontaktskjema med WPForms

Nå som du har installert og aktivert WPForms, er du klar for å opprette et kontaktskjema i WordPress.

Velg WPForms > Add new fra menyen i kontrollpanelet. Dette åpner WPForms sin skjemabygger. Start med å gi skjemaet et navn, velg deretter «Contact Form».

WPForms - Opprett et kontaktskjema

WPForms har flere innebygde maler å velge fra. Disse kan du bruke til å lage (nesten) alle typer skjema, men i vårt eksempel bruker vi altså «Simple Contact Form».

I sidekolonnen til venstre, viser flere felt du kan sette inn i skjemaet. For å legge til et nytt felt, dra det fra sidekolonnen og inn i skjemaet.

WPForms - Dra og slipp felt

Du kan organisere feltene slik du vil ha de med dra- og slipp metoden.

WPForms - Organiser felt med dra- og slipp

Trykk på et felt for å redigere det. På skjermbildet under har vi gjort det, og endret etiketten (label) fra engelsk til norsk.

WPForms - Rediger felt

Når du er ferdig, klikk på «SAVE» knappen (oppe til høyre) for å lagre endringer.

Konfigurer varsler og bekreftelser

Nå som du har laget kontaktskjemaet, er det viktig å konfigurere varsler og bekreftelser på riktig måte. Du kan tilpasse disse ved å gå til fanen «Settings» fra skjemabyggeren i WPForms.

Varsler er til eksempel e-postmeldingen du får når noen fyller ut og sender en henvendelse fra kontaktskjemaet.

Meldingen sendes (vanligvis) til e-postadressen som er registrert på administratorkontoen. Hvis du vil sende den til en annen e-postadresse, endrer du den. Du kan også sende melding til flere adresser ved å skrive inn flere adresser adskilt med komma.

I eksempelet nedenfor har vi valgt å endre emnet i e-posten (email subject) til «Ny melding fra kontaktskjema».

WPForms - Varsler

Bekreftelser er hva den besøkende ser etter at de har sendt en melding med skjemaet du har laget. Det er typisk en melding hvor du takker for henvendelsen, eller du kan omdirigere brukeren til en side du har laget.

Nedenfor har vi skrevet inn en enkel melding (message) til avsenderen, hvor vi bare takker for henvendelsen.

WPForms fyller automatisk inn de mest brukte alternativene for deg, derfor er det få endringer du må gjøre selv.

Når du er ferdig, trykk på «SAVE» knappen (oppe til høyre) for å lagre alle endringer.

Legg kontaktskjemaet til på en side

Nå som du har laget ferdig kontaktskjemaet du vil bruke, kan du sette det inn på en side på nettstedet. Det første du må gjøre er å lage en ny side i WordPress, eller redigere en eksisterende hvor du vil sette inn skjemaet.

I eksempelet nedenfor, har vi laget en helt ny side. Velg Sider > Legg til ny fra kontrollpanelet. Vi har gitt siden tittelen «Kontaktskjema».

Når du installerer WPForms, vil utvidelsen automatisk legge til en ny blokk i Gutenberg. For å sette inn et skjema, lag en ny blokk og velg WPForms.

WPForms - Legg til kontaktskjema på en side

Velg kontaktskjemaet du har laget fra listen. Du kan se hvordan det ferdige skjemaet ser ut ved å velge «Forhåndsvisning» oppe til høyre.

Du kan skrive inn tekst over eller under skjemaet, men hvis du bare vil legge til skjemaet slik vi har gjort, er du ferdig nå. Klikk på «Publiser» når du er fornøyd.

WPForms - Velg kontaktskjemaet fra listen

Legg kontaktskjema til i sidekolonnen

WPForms kommer med en ferdig widget du kan bruke for å legge kontaktskjemaet til i sidekolonnen eller et annet sted med widgeter.

For å legge kontaktskjemaet til i sidekolonnen, gå til Utseende > Widgeter. Dra- og slipp WPForms widgeten i sidekolonnen. Velg kontaktskjemaet du har laget fra listen, skriv inn en tittel og klikk «Lagre».

WPForms - Legg til kontaktskjema i sidekolonnen

Opprett andre praktiske skjemaer

Du har nå lært hvordan du lager et kontaktskjema i WordPress. Et kontaktskjema er trolig viktigste, men det finnes nesten ingen grenser for hvilke skjemaer du kan lage.

En kort liste over innlegg på WPologi om skjemaer i WordPress:

For flere veiledninger kan du benytte søkefeltet oppe i høyre hjørne på våre nettsider. Skriv inn hva du leter etter og trykk «ENTER».

Bruk søkefunksjon på WPologi for å lete etter innlegg eller sider

Oppsummering

Alle nettsted trenger et kontaktskjema slik at folk kan kontakte deg om innlegg, produkter, tjenester eller andre viktige ting.

Et kontaktskjema er ofte bedre enn å bare publisere e-postadressen din på nettstedet.

WPForms er den mest brukervennlige utvidelsen for å lage skjemaer i WordPress. Hvis du ikke har behov for avanserte funksjoner kan du bruke WPForms Lite, som er helt gratis.

Har du spørsmål eller tilbakemeldinger, hører vi gjerne fra deg i kommentarfeltet nedenfor eller bruk kontaktskjemaet. Vi svarer på alle henvendelser.

Kanskje du liker

2 kommentarer

Ann Christin 18/03/2020 - 10:25

Hei
Jeg har installert kontaktskjema på min hjemmeside som er satt opp i WordPress. Jeg har ikke javascript installert på min pc men har McAffe. Nå står dette på min hjemmeside:
Please enable JavaScript in your browser to complete this form.

Svar
naldy 18/03/2020 - 10:56

Hei Ann Christin! Bruker du utvidelsen AMP på nettsidene dine? Jeg vet denne feilen oppstod med en tidligere utgave, men som nylig ble fikset etter at utvikleren oppdaterte utvidelsen. Hvis det ikke hjelper å oppdatere utvidelser, send oss en mail med litt mer info så skal vi se om vi kan hjelpe deg.

Svar

Skriv en kommentar

* Vennligst gjør deg kjent med vår personvernerklæring.

Vi benytter cookies for utvidet funksjonalitet, bedre nettleser-opplevelse, statistikk og målrettede annonser. OK Les mer

LIKTE DU INNLEGGET?
MELD DEG PÅ NYHETSBREV!
SEND
Nyhetsbrev sendes ut ca. hver 3. måned.
close-link