Produktsiden

Denne guiden hjelper deg med å sette opp og optimalisere produktsidene i din nettbutikk. Ved å strukturere innholdet riktig forbedrer du brukeropplevelsen og øker sjansen for salg.

Introduksjon

Produktsiden er delt inn i ulike seksjoner og blokker. Når du gjør endringer i denne malen, vil dette gjelde for alle produkter i butikken. Ønsker du unike tilpasninger for enkeltprodukter, kreves det bruk av tilpasset CSS.

Opprett flere versjoner

Dersom du ønsker å leke deg litt med ulike versjoner kan du duplisere produktsiden. Da kan du redigere så mange produktsider du vil, for så å teste hvilke som har best konvertering.

  1. Trykk på nedtrekksmenyen for "Side"
  2. Velg Produktside
  3. Trykk på produktsiden du vil duplisere og trykk "Dupliser"
  4. Gi den nye siden et beskrivende navn

Se hvordan →


Produktbildeseksjonen

Denne seksjonen er plassert øverst på siden og er avgjørende for førsteinntrykket.

Generelle innstillinger

Her kontrollerer du rammeverket rundt bildene dine:

  • Bakgrunnsfarge: Endrer fargen som ligger bak selve produktbildet.
  • Seksjonsbredde: Basert på et system med 8 kolonner. Velger du 4 kolonner, vil seksjonen dekke halvparten av sidens bredde. Du kan sette ulike verdier for PC, nettbrett og mobil.
  • Avstand (Margin): Justerer luft på utsiden av seksjonen for å skape avstand til andre elementer.
  • Polstring (Padding): Justerer luft på innsiden av seksjonen.

Bilde- og karusellfunksjoner

For å gi kunden en god visuell opplevelse kan du justere følgende:

  • Lysbildefremvisning: Lar kunden klikke på bildet for å åpne det i et større popup-vindu.
  • Bildebredde: Angi nøyaktig bredde for å sikre rask innlasting uten å bruke unødvendig store filer.
  • Navigasjonspiler: Velg om du vil vise piler over hovedbildet eller miniatyrbildene. Du kan tilpasse farge og form på disse.
  • Automatisk avspilling: Bilder roterer automatisk etter et valgt antall sekunder.
  • Lazy load: Denne funksjonen utsetter innlasting av bilder til kunden skroller ned. Det anbefales å ha denne avslått for bilder øverst på siden for å sikre at de vises umiddelbart.

Produktkjøpseksjonen

Dette er den viktigste delen av siden. Her finner kunden kritisk informasjon og selve kjøpsknappen. Seksjonen er bygget opp av flere flyttbare blokker som du kan sortere ved å dra og slippe.

Noen av de tilgjengelige informasjonsblokker

  • Tittel: Viser navnet på produktet. Du kan også velge å vise produsent eller merkevare her, samt justere tekststørrelse.
  • Kortbeskrivelse: Viser en kort beskrivelse av produktet
  • Pris: Viser gjeldende pris. Her kan du også fremheve tilbudspriser og vise nøyaktig rabattprosent.
  • Lagerstatus: Viser om varen er på lager. Denne blokken henter data direkte fra din avanserte lagerstyring.
  • Vurdering: Viser kundenes tilbakemeldinger og stjernerangering for produktet.
  • Egendefinert tekst: En blokk som støtter både ren tekst og HTML-kode for spesielle beskjeder.

Viktige tips for oppsett

  • Symmetri: Sørg for at bildebredden og tekstkolonnen harmonerer, spesielt på PC-visning.
  • Prioritering: Plasser den viktigste informasjonen (Tittel, Pris, Kjøp-knapp) høyt oppe i kjøpsseksjonen.
  • Mobiloptimalisering: Sjekk alltid hvordan kolonnebredden ser ut på mobilskjermer for å unngå at innholdet blir for smått.


Var denne artikkelen hjelpsom?