Formularer, knapper og widgets

Modul 4: Sider, udseende og funktioner · Læsetid: 8 minutter

Læringsmål: Efter denne lektion kan du indstille kontaktformularen (modtager, bekræftelse, takkeside, spamkontrol, nyhedsbrev og afsendelsesmetode), placere svævende knapper til WhatsApp og kontakt og indsætte en widget fra en anden tjeneste. Du ved også, hvornår Egen kode og Egen HTML passer.

Nøglebegreber: kontaktformular, modtager, bekræftelsesmail, takkeside, captcha, dobbelt tilmelding, afsendelsesmetode, svævende knap, widget, indlejringskode, samtykke, Egen kode, Egen HTML

Kontaktformularen: to steder

En formular på dit website består af to dele. Selve formularen med de felter, en besøgende udfylder, ligger på en side. Du placerer den med sektionen Kontakt (via Blokke eller Tilføj sektion) eller via chatten. Hvad der sker, når nogen klikker på send, indstiller du under Indstillinger > Formularer. Det panel indstiller du altid selv; chatten gør det ikke.

Formularen har altid felterne navn, e-mail og besked. Via chatten kan du tilføje ekstra felter, højst otte: et tekstfelt, en rulleliste (for eksempel "Indendørs eller udendørs?"), e-mail, telefon, et langt tekstfelt, en dato eller et tal. Et felt til at sende en fil eller et billede med findes ikke. Vil Schildersbedrijf Example have billeder af opgaven, skriver han i taketeksten: "Send gerne billeder til vores e-mailadresse."

Vigtigt: på det gratis website uden pakke er formularen synlig, men nedtonet, og den sender ingen mail. Formularer sender først rigtigt, når dit website ligger i en AI Builder-pakke. Du kan godt gøre indstillingerne herunder klar allerede nu; så bliver de brugt med det samme.

Indstillinger > Formularer

Panelet har fem blokke.

Modtag beskeder. Under Send beskeder til skriver du den e-mailadresse, som udfyldte formularer skal sendes til. Lader du feltet stå tomt, går de til e-mailadressen på din konto hos WebOké. Udfyld det bevidst. Under Emne på e-mailen vælger du emnet (tomt: "Ny besked via dit website"). Under Efter afsendelse vælger du Vis en tak med din egen tekst eller Send videre til en side: en takkeside, som du selv laver og holder uden for menuen (lektion 4.1). Så kan du senere måle, hvor tit formularen bliver sendt.

Send via. Sådan bliver mailen sendt. WebOkés server virker med det samme med noreply@weboke.site som afsender. Din egen e-mailadresse (SMTP) anbefales: mailen kommer så fra dit eget domæne og havner sjældnere i spam. Med Sæt det op for mig opretter bygværktøjet adressen på dit domæne. Under din egen e-mailadresse kan du også vælge en mailtjeneste som Postmark, Brevo, Mailgun eller SendGrid. Hvorfor afsenderen betyder så meget, kan du læse i lektion 5.3.

Bekræftelse til den besøgende. Slår du Send en kopi til den besøgende til, får den besøgende en bekræftelsesmail. Det er tit den første besked, nogen får fra dig. Du vælger emnet, Din tekst (med {naam} for den besøgendes navn), Underskrift og om den udfyldte besked skal med. Bygværktøjet sætter din tekst i dit websites layout med dit logo. Med Lad AI skrive teksten får du et forslag.

Stop spam. Alle formularer har altid en usynlig kontrol: et skjult felt og en tidsgrænse. Den stopper det meste spam, uden at de besøgende mærker noget. Får du alligevel meget spam, så vælg en ekstra kontrol, en captcha: Cloudflare Turnstile eller hCaptcha. Du opretter en gratis konto hos tjenesten og udfylder Site key og Secret key. Slå først en captcha til, når det er nødvendigt: hvert ekstra trin koster besøgende.

Nyhedsbrev. Du kan sætte et flueben i formularen, så besøgende kan tilmelde sig hos Mailchimp, Laposta, Brevo eller MailerLite. Kun dem, der selv sætter fluebenet, bliver tilføjet. Altid med dobbelt tilmelding: den besøgende bekræfter først via en mail. Hos Laposta og MailerLite slår du det selv til i tjenesten; bygværktøjet fortæller dig hvor. Uden dobbelt tilmelding kan alle sætte fremmede adresser på din liste.

Desuden: en besøgende kan højst sende 5 beskeder i timen. Har du en privatlivspolitik, står der et link til den under formularen. En formular indsamler personoplysninger; hvad du skal have på plads, står i lektion 7.1.

Faldgrube: test selv formularen efter hver ændring fra en anden adresse end modtageradressen. Kig også i din spammappe, og tjek, at bekræftelsen når frem til "den besøgende".

Svævende knapper

Under Indstillinger > Knapper placerer du knapper, der bliver nederst i billedet på alle sider, til højre eller venstre (Hjørne: Nederst til højre eller Nederst til venstre).

• WhatsApp-nummer: i international form med landekoden foran, for eksempel +45 for et dansk nummer eller +31 for et nederlandsk nummer uden 0'et foran. Lader du feltet stå tomt, er der ingen WhatsApp-knap. Du må gerne bruge en Forudfyldt besked, for eksempel "Jeg vil gerne have et tilbud på malerarbejde." Knappen åbner en samtale med dit nummer.
• Svævende kontaktknap: åbner din kontaktformular i et vindue. Beskeden lander på samme adresse som din formular. Du vælger Tekst på knappen.

I forhåndsvisningen står knapperne lidt højere end på dit rigtige website, så de ikke gemmer sig bag bygværktøjets hjælpeknap.

Bemærk: en WhatsApp-knap lover hurtigt svar. Læser du kun WhatsApp om aftenen, så vælg hellere kontaktknappen.

Widgets fra andre tjenester

En widget er et stykke fra en anden tjeneste på din side: en YouTube-video, et Google Maps-kort, en bookingkalender fra Calendly, din Instagram, en Spotify-playliste. For mange tjenester er linket nok; bygværktøjet laver selv afspilleren eller formularen. Eksempler: YouTube, Vimeo, Spotify, Calendly, Google Maps (adressen er nok), Google Kalender, Instagram og TikTok (dit @navn er nok) og Google Formularer. Fra andre tjenester, som Salonized, Trustpilot eller Bandcamp, indsætter du indlejringskoden: det stykke kode, du får hos tjenesten til at sætte på et website.

Sådan gør du: skriv det i chatten med linket ("sæt vores rutekort under kontaktblokken, adresse Bygaden 1"), indsæt koden i chatten, eller vælg sektionen Widget under Blokke. Bygværktøjet genkender tjenesten, foreslår højde og overskrift og advarer, hvis noget ikke vil virke. Lader du AI placere den, er det en opgave, og det koster redigeringer; du ser på forhånd hvor mange. En placeret widget retter du med Rediger kode på blokken i forhåndsvisningen.

Tre ting, du skal vide:

1. En widget indlæses først efter samtykke. Andres tjenester sætter tit cookies eller følger besøgende. Med cookiebanneret slået til indlæses en widget først, når den besøgende giver samtykke til den slags cookies. Tjenesten kommer automatisk med i dit cookiebanner under "Det kører på dit website nu". Tjek derefter også din privatlivspolitik (lektion 7.1 og 7.2).
2. Google Kalender skal være offentlig. En privat kalender kan ingen andre se. Gør kun en separat kalender offentlig i Google Kalender med det, besøgende må se, aldrig din personlige kalender.
3. Usikker kode kommer ikke på. Kode, der kan sende besøgendes oplysninger videre, skjuler hvad den gør, eller henter noget fra et ukendt website, sætter AI ikke på dit website. Den forklarer hvorfor.

Egen kode og Egen HTML i hovedtræk

For øvede brugere er der to steder.

Egen kode står nederst under Indstillinger > Integrationer: kode, der skal være på alle sider, I head på alle sider eller Nederst på alle sider. For eksempel indlæsningsscriptet fra en chattjeneste eller en anmeldelseswidget. Den kode kontrollerer bygværktøjet ikke ("Denne kode kontrollerer vi ikke"). Kendte tjenester holder cookiebanneret tilbage, til der er samtykke. Sæt kun flueben ved Denne kode er nødvendig for kode, der ikke følger besøgende, for så indlæses den med det samme. I forhåndsvisningen i bygværktøjet bliver egen kode ikke kørt, men på dit rigtige website gør den. På det gratis website virker egen kode ikke. Til et måle-id som Google Analytics bruger du ikke Egen kode, men det faste felt under Integrationer (lektion 7.2).

Egen HTML er en sektion under Blokke. Du indsætter din egen HTML og eventuelt CSS og retter den senere med Rediger HTML. Farver og skrifttyper følger din visuelle identitet. Scripts, iframes og formularer virker ikke her; til det bruger du en widget.

Brug kun begge dele, når det ikke kan være anderledes: andres kode er en risiko for hastighed, sikkerhed og privatliv.

I bygværktøjet: sådan gør du

1. Sæt sektionen Kontakt med formular på din kontaktside.
2. Åbn Indstillinger > Formularer. Udfyld Send beskeder til.
3. Vælg din egen e-mailadresse under Send via, eller lad den stå på WebOkés server, til dit domæne er klar (lektion 5.3).
4. Slå Send en kopi til den besøgende til, og skriv din egen tekst.
5. Vælg en tak eller en takkeside under Efter afsendelse.
6. Tilføj om nødvendigt en WhatsApp- eller kontaktknap under Indstillinger > Knapper.
7. Sæt dit website online, og send en testbesked.

Opsummering

• Formularen ligger på en side; hvad der sker med den, styrer du under Indstillinger > Formularer.
• Udfyld Send beskeder til bevidst; vælg helst din egen e-mailadresse som afsender.
• På det gratis website sender formularen ingen mail; at sende en fil med kan aldrig lade sig gøre.
• Svævende knapper til WhatsApp og kontakt finder du under Indstillinger > Knapper.
• Widgets indlæses først efter samtykke; Egen kode og Egen HTML er for øvede brugere.

Quiz

Opgave

Opgave D4.3: Din kontaktformular og en widget. Indstil din formular helt, og placer én widget, der virkelig tilføjer noget.

Tjekliste:

• [ ] sektionen Kontakt med formular på din kontaktside;
• [ ] Send beskeder til udfyldt med en adresse, du læser hver dag;
• [ ] afsendelsesmetode valgt, og du forstår hvorfor;
• [ ] bekræftelse til den besøgende med din egen tekst;
• [ ] tak eller takkeside indstillet;
• [ ] én widget placeret (for eksempel et kort eller en bookingkalender), og du har set, at den står i cookiebanneret;
• [ ] website online og en testbesked sendt (kun med en pakke; på det gratis website tjekker du indstillingerne).

Spørgsmål:

1. Hvilken adresse lander dine formularbeskeder på, og via hvilken afsendelsesmetode?
2. Hvilken widget valgte du, hvad tilføjer den for din besøgende, og hvad ser en besøgende, der ikke giver samtykke?
3. Kom din testbesked frem, og kom bekræftelsen frem til "den besøgende", eller havnede den i spam?

Når du har klikket på "færdig", ser du et eksempelsvar: Schildersbedrijf Example sender beskeder til info@example.com via sin egen e-mailadresse på domænet; widgetten er et Google Maps-kort med adressen, som først indlæses efter samtykke og ellers viser et felt med en knap til at give samtykke; testbeskeden kom frem, bekræftelsen også, ikke i spam.

Læs mere

• En kontaktformular på din hjemmeside: få felterne sendt på mail, og undgå spam
• Gratis kursus E-mail i orden: opsætning og god levering 7.3: Mail fra din hjemmeside og formularer
• Gratis kursus E-mail i orden: opsætning og god levering 7.2: Samtykke, afmelding og en ren liste
• Brug klik og chat (WhatsApp Hjælpecenter): https://faq.whatsapp.com/5913398998672934
• Create & manage a public Google calendar (Google Kalender Hjælp, på engelsk): https://support.google.com/calendar/answer/37083