Topptekst: Søkefelt
Søkefelt
Søkefelt-blokken plasserer et alltid synlig søkefelt i headeren. I motsetning til søkeikonet (som åpner et felt ved klikk) er dette en permanent inntastingsboks kundene kan skrive i med en gang. Bra for butikker der søk er sentralt for hvordan folk handler.
Hva den viser
Et tekstfelt, vanligvis med plassholdertekst som «Søk etter produkter…», og eventuelt en søkeknapp. Etter hvert som kunden skriver, foreslår butikkens livesøk produkter som matcher. Å holde feltet synlig hele tiden oppmuntrer folk til å bruke søk, noe som ofte gir god konvertering.
Innstillinger
Innstilling | Hva den styrer |
|---|---|
Plassholder | Hjelpeteksten som vises i det tomme feltet |
Plassholderfarge | Fargen på den hjelpeteksten |
Vis knapp | Om en søkeknapp skal vises ved siden av feltet |
Knappeposisjon | Hvor knappen sitter i forhold til feltet |
Vertikal justering | Hvordan feltet justeres vertikalt i headeren |
Farger og kantlinje
Innstilling | Hva den styrer |
|---|---|
Bakgrunnsfarge | Feltets fyll |
Tekstfarge | Fargen på det kunden skriver |
Kantlinjefarge | Feltets kantlinje |
Kantlinjebredde | Hvor tykk kantlinjen er |
Hjørneradius | Avrunder feltets hjørner |
Bruk global radius | Bruk temaets globale hjørneavrunding i stedet |
Oppsett og synlighet
- Fontstørrelse — størrelsen på teksten i feltet.
- Innvendig avstand (padding) — plass inni feltet.
- Bredde-innstillinger for desktop, nettbrett og mobil.
- Egen CSS-klasse og blokkbetingelser for avansert styling og vis/skjul-regler.
Tips
- Skriv en plassholder som antyder hva folk kan søke etter («Søk etter produkter, merker…») i stedet for et bart «Søk».
- Et synlig søkefelt tar plass i headeren. På mobil skjuler mange butikker det og bruker søkeikonet i stedet — sett mobilbredde eller blokkbetingelser deretter.
- Vil du heller at søk skal vises bare ved behov, bruk søkeikonet i Header-ikoner-blokken i stedet for denne blokken.