Sidedesigner

Med Sidedesigner kan du lage ditt eget sidelayout ved å legge til, flytte og konfigurere innholdsblokker. Du kan lage unike layouter for forsiden, kategorisider, produktsider, landingssider, kassen og mange flere typer sider. Helt uten å måtte kode.

Hvor finner jeg Sidedesigner?

Du finner Sidedesigner under Butikk » Design » Sidedesigner i Shoporama-administrasjonen. Her oppretter du nye sideoppsett eller redigerer eksisterende.

Hvilke sidetyper støtter Sidedesigner?

Sidedesigner støtter to grupper av sidetyper. Den første gruppen er dynamiske sider, der du kan velge om oppsettet skal gjelde for alle sider av denne typen eller bare for utvalgte sider:

• Kategori (inkl. forsiden). Oppsettet på alle kategorisider og forsiden. Forsiden er den kategorien som er merket som forsidekategori, så hvis du vil ha et spesielt forsideoppsett, oppretter du et spesifikt kategorioppsett som peker på nettopp den kategorien.
• Produkt. Oppsettet på produktsider.
• Landingsside. Oppsettet på landingssider.
• Statisk side. Oppsettet på statiske sider, f.eks. Om oss og Salgsbetingelser.
• Blogginnlegg. Oppsettet på blogginnlegg.

Den andre gruppen er faste sider, der det kun kan være én layout per nettbutikk:

• Søkesiden
• Handlekurven
• Adressesiden (i kassen)
• Fraktsiden (i kassen)
• Bekreftelsessiden (i kassen)
• Betalingssiden
• Takk-for-bestillingen-siden
• Tilleggsvalg-siden
• Bestillingssiden
• Retursenter
• Innloggingssiden
• Opprett-konto-siden
• Brukerens bestillinger
• Brukerens ønskeliste

Hvis temaet ditt definerer egne tematagger (gjenbrukbare innholdsplasser), kan du også opprette Side Designer-oppsett for dem. De vises i en egen gruppe ved opprettelse.

Slik oppretter du et sideoppsett

1. Gå til Butikk » Design » Sidebygger.
2. Klikk på Opprett nytt sidelayout.
3. Velg hvilken sidetype oppsettet skal gjelde for.
4. Gi eventuelt oppsettet et navn, slik at du kan gjenkjenne det i listen.
5. Klikk på Opprett. Du kommer direkte til seksjonsredigereren, hvor du kan begynne å legge til blokker.
6. Et dynamisk oppsett gjelder som utgangspunkt for alle sider av den typen. Hvis du vil begrense det til utvalgte sider, åpner du «Innstillinger» og legger til sidene under «Velg spesifikke sider». Faste sider kan bare ha ett oppsett per nettbutikk.

Slik bygger du forsiden

Forsiden er en vanlig kategori som er merket som forsidekategori. Hvis du vil gi forsiden et spesielt utseende, gjør du det slik:

1. Sørg for at du har en kategori merket som forsidekategori (dette gjøres på selve kategorien). Les mer i Oppsett av forsiden.
2. Gå til Sidedesigner. Under overskriften Innholdssider finner du et kort som heter Forsiden.
3. Klikk på «Opprett layout» på det kortet. Sidedesigner oppretter en kategorioppsett som allerede er knyttet til forsidekategorien din.
4. Legg til blokkene som skal utgjøre forsiden, for eksempel et hero-banner, en produktkarusell, en USP-blokk og en bloggliste.

Den spesifikke oppsettet brukes nå på forsiden, mens de øvrige kategoriene dine kjører på det generelle kategorioppsettet (eller temaets standard).

Tilgjengelige blokktyper

De tilgjengelige blokkene avhenger av temaet ditt. Her er de vanligste i Delaware, DelawareDK og Montana:

• Hero. Stor hero-seksjon med overskrift, beskrivelse, knapp og bakgrunnsbilde.
• Banner. Bilder i karusell-/sliderformat.
• Tekst. Fri tekstblokk med overskrift og formatering.
• Tekst med bilde. To kolonner med tekst på den ene siden og bilde på den andre.
• To-kolonne tekst. Tekst fordelt på to kolonner.
• Produktliste. Vis produkter fra en kategori, en landingsside eller basert på popularitet/nyeste.
• Produktslider. Produkter i karusellformat.
• Kategoriliste. Vis produktkategorier.
• Kategorislider. Kategorier i karusellformat.
• Bildegitter i Delaware og DelawareDK, Bildegalleri i Montana og MontanaB2B. Rutenett med bilder og valgfrie lenker.
• Adresse og kart. Vis butikkens adresse med et interaktivt kart. Krever ingen Google Maps API-nøkkel. Les mer.
• Facebook. Følg-knapp til Facebook-siden din (eller legg inn et feed via egen kode).
• Instagram. Vis din offentlige Instagram-profil med de nyeste innleggene, en «Følg»-knapp eller begge deler.
• Bloggliste. Vis de nyeste blogginnleggene.
• Trustpilot. Widget med Trustpilot-anmeldelser. Finnes i Delaware og DelawareDK, men ikke i Montana.
• Verdiforslag i Delaware, Verditilbud i DelawareDK og Verdier/USP-er i Montana og MontanaB2B. Fremhev dine USP-er, f.eks. gratis frakt eller rask levering.
• HTML. Ren HTML for full kontroll over innholdet.

Hvis du bruker et annet tema, kan listen se annerledes ut. Åpne en oppsett og klikk på «Moduler»-fanen i høyre kant for å se hvilke blokker temaet ditt faktisk støtter.

Nyere blokker du kanskje ikke har oppdaget

Listen over blokker utvides kontinuerlig, og de nyeste er lagt til i Montana. Her er blokkene som har kommet i tillegg til klassikerne, og hva du kan bruke dem til. Navnene nedenfor er de du ser i Montana. I DelawareDK heter de nesten det samme, og i Delaware står de på engelsk. Hvis en blokk bare finnes i bestemte temaer, står det ved siden av blokken.

Vær samtidig oppmerksom på at flere av de kjente blokkene har fått nye navn i Montana. «Hero» heter «Stort banner», produktglideren heter «Produktkarusell», bildegitteret heter «Bildegalleri», og HTML-blokken heter «Tilpasset kode». Det er den samme funksjonen, bare med et navn som er lettere å forstå.

Overskrift, tekstbanner og mellomrom

• Overskrift. En ekte H1-overskrift til toppen av siden, med justering til venstre, sentrert eller til høyre og en valgfri tynn strek under. Bruk den når siden skal ha en sideoverskrift i stedet for bare en tekstblokk.
• Tekstbanner. En smal stripe med tekst, bakgrunnsfarge, tekstfarge, justering og skriftstørrelse. Den kan gjøres klikkbar med en lenke, og hvis du merker av for «Kan lukkes», får meldingen et lite kryss. Når en besøkende lukker banneret, forblir det lukket i vedkommendes nettleser. Ideelt for «Gratis frakt over 499 kr.» eller en kort kampanjemelding. Finnes i Montana og MontanaB2B.
• Mellomrom og skille. Ren luft mellom to seksjoner i fem størrelser, fra ekstra liten til ekstra stor, med mulighet for en horisontal strek i midten. Løser det klassiske problemet der to seksjoner ligger for tett inntil hverandre. Finnes i Montana og MontanaB2B.

Blokker som fremhever produkter og kategorier

• Produktblokk. Ett enkelt produkt vist i stor størrelse med bilde, navn, pris og en knapp til produktsiden. Du velger om bildet skal stå til venstre eller høyre, hvordan de to kolonnene skal fordeles (50/50, 60/40 eller 40/60), og om produktbeskrivelsen skal vises.
• Produktfunksjon. Et kampanjeområde med overskrift, brødtekst, to knapper og et bakgrunnsbilde, pluss et produktkarusell ved siden av. Egnet for «Månedens merke» eller en ny kolleksjon.
• Kategorifunksjon. Samme idé, men for kategorier. Velg opptil tre kategorier, et bakgrunnsbilde eller en bakgrunnsfarge, lys eller mørk overlegg, og hvor store kategoribildene skal være.
• Hero-video med kategori eller landingsside. Et stort banner med bakgrunnsvideo og opptil tre uthevede kategorier eller landingssider øverst. Finnes i Delaware og DelawareDK.

Nyhetsbrev midt i innholdet

Nyhetsbrevblokken plasserer et påmeldingsskjema direkte i sidens innhold, slik at du ikke bare samler påmeldinger i bunnteksten. Du kan velge mellom tre oppsett:

• Enkel. Et sentrert skjema på en farget bakgrunn.
• Sentrert med bakgrunnsbilde. Samme oppbygning, men med et bilde i bakgrunnen og et lyst eller mørkt overlegg.
• Delt med bilde. Bilde på den ene siden og skjema på den andre.

I tillegg angir du overskrift, brødtekst, knappetekst og en samtykketekst under skjemaet, og du kan velge om det også skal spørres om fornavn. Hvor påmeldingene havner, avhenger av om du har slått på «Bruk intern nyhetsbrevliste» i nyhetsbrevmodulen:

• Hvis innstillingen er aktivert, opprettes påmeldingen som abonnent i nettbutikkens eget nyhetsbrevmodul og legges til i standardlisten din. Hvis du samtidig har aktivert «Krev bekreftelse (double opt-in) », får den påmeldte automatisk en bekreftelses-e-post og blir først aktiv når lenken i e-posten er klikket på.
• Hvis innstillingen er slått av, blir påmeldingen i stedet sendt videre til det eksterne nyhetsbrevsystemet du har koblet til, for eksempel Mailchimp, Klaviyo eller Brevo. Det opprettes altså ikke en abonnent i Shoporamas eget nyhetsbrevmodul, og en eventuell bekreftelses-e-post håndteres av den eksterne leverandøren.

I begge tilfeller lagrer Shoporama en samtykkeregistrering med tidspunkt, IP-adresse og nettleser, slik at du kan dokumentere påmeldingen. Les mer i nyhetsbrevmodulen.

Modulpanelet: slik legger du til en seksjon

Du legger til seksjoner fra et panel på høyre side av seksjonsredigereren. Hvis panelet er lukket, åpner du det på Moduler-fanen i høyre kant av skjermen. Panelet husker om du hadde det åpent eller lukket, slik at det står slik du forlot det neste gang.

• Søkefelt. Skriv for eksempel «produkt» eller «tekst», så filtreres listen umiddelbart. Det søkes både i modulens navn og i beskrivelsen.
• Forhåndsvisninger. Hvert modul vises med en liten skisse av oppbyggingen, slik at du kan gjenkjenne det uten å måtte gjette ut fra navnet. Skissene er veiledende og viser ikke ditt eget design.
• Ett klikk. Klikk på et modul, så legges seksjonen inn på siden. Den nye seksjonen foldes sammen, siden ruller ned til den, og den blinker kort, slik at du kan se hvor den havnet.

Hver seksjon har fire knapper i overskriften: gi nytt navn, fold ut eller sammen, kopier og slett. Kopier lager en kopi rett under originalen med «(kopi)» i navnet, noe som er den raskeste måten å lage to nesten identiske bannere på. Øverst i seksjonslisten finnes en knapp som veksler mellom «Fold alle inn» og «Fold alle ut», slik at du kan få oversikt over en lang side med ett klikk.

Noen blokker har en «Les mer om denne blokken»-lenke nederst under feltene. Dette gjelder blant annet «Adresse og kart» samt «Facebook» og «Instagram», der det finnes en artikkel med den fullstendige oppsettveiledningen.

Nederst på siden finnes en fast bjelke med «Lagre», «Lagre og lukk» og «Slett sideoppsett». Rekkefølgen på seksjonene lagres automatisk når du flytter dem rundt, men innholdet i feltene lagres først når du klikker på «Lagre».

Dra og slipp

Du kan enkelt endre rekkefølgen på blokkene dine ved å dra dem opp eller ned. Ta tak i blokkens overskrift og dra den til ønsket posisjon. Rekkefølgen lagres automatisk.

Du kan også skjule blokker for å få bedre oversikt hvis du har mange blokker på en side.

Konfigurering av blokker

Hver blokk har sine egne innstillinger, avhengig av typen. Typiske alternativer er:

• Tekst og overskrifter. Skriv direkte i en tekstredigerer.
• Bilder. Last opp bilder direkte fra datamaskinen din.
• Bakgrunnsvideo. Last opp eller velg en MP4-/WebM-video, for eksempel som bakgrunn i et hero-banner. Videoen spilles av automatisk, uten lyd og i loop på alle enheter.
• Produktvalg. Velg bestemte produkter, kategorier eller landingssider.
• Lenker og knapper. Legg til URL-er og knappetekster.
• Gjentakbare elementer. I enkelte blokker (f.eks. bannere) kan du legge til flere elementer i samme blokk.

Du kan gi hver blokk et egendefinert navn, slik at det blir enklere å holde oversikt over dem i oversikten.

Produktvelger i Delaware/DelawareDK

I Delaware og DelawareDK har flere Sidedesigner-seksjoner (Produktliste, Produktslider og Produktfeature) et felt kalt Product Selector. Dette feltet brukes til å angi hvilke produkter som skal vises i seksjonen.

Slik bruker du Product Selector

1. Velg først en Product Type i rullegardinmenyen, f.eks. «By Category Tag», «By Landing Page Tag» eller «By Product Ids».
2. Fyll deretter ut «Product Selector»-feltet med den relevante verdien (se nedenfor).

Hvis du velger «Newest Products», «Popular Products» eller «Most Sold Products» som produkttype, trenger du ikke å fylle ut «Product Selector»-feltet. Produktene hentes automatisk.

Hva skal jeg skrive i feltet?

Det avhenger av den valgte «Product Type»:

• «By Category Tag». Skriv inn kategoriens tag. Du finner taggen ved å redigere kategorien i admin under feltet «Tag». Eksempel: sommertilbud
• Etter landingssidetag. Skriv inn landingssidens tag. Du finner taggen ved å redigere landingssiden i admin. Eksempel: nyheter
• Etter produkt-ID-er (finnes i produktglidebryteren). Skriv inn produkt-ID-ene atskilt med komma. Du finner et produkts ID i produktlisten eller i URL-en når du redigerer produktet. Eksempel: 123,456,789

Generelle vs. spesifikke oppsett

For dynamiske sidetyper finnes det to måter å bruke Sidedesigner på:

• Generell innstilling. Gjelder for alle sider av en gitt type. F.eks. én innstilling for alle kategorisider.
• Spesifikk innstilling. Gjelder kun for utvalgte sider. F.eks. en spesiell innstilling for én bestemt landingsside, eller for forsidens kategori.

Spesifikke innstillinger har forrang. Hvis et produkt har sin egen innstilling, brukes den i stedet for den generelle produktsideinnstillingen.

Smartere felt i Montana-temaet

Montana-temaet bruker de nyeste felttypene i Side Designer, som gjør det enklere å velge innhold:

• Produktsøk. Søk etter og velg flere produkter samtidig. De vises som tagger du enkelt kan legge til og fjerne.
• Kategorisøk. Velg kategorier og vis automatisk produkter fra disse.
• Landingssidesøk. Velg landingssider og hent produktene fra dem.
• Smart lenkefelt. Søk på tvers av produkter, kategorier, landingssider, statiske sider og blogginnlegg. Hvert resultat er merket med en fargekode som viser hvilken type det er.
• Videofelt. Last opp eller velg en bakgrunnsvideo direkte i seksjonen, for eksempel til hero-banneret. Støtter MP4 og WebM, og bruker et bilde i samme seksjon som innlegg.

I Montanas produktliste og produktkarusell kan du kombinere produkter fra flere kilder (håndplukkede produkter, kategorier og landingssider). Systemet fjerner automatisk duplikater.

Les mer i blogginnlegget vårt: Smartere felttyper i Sidedesigner.

Slik bestemmer temaet ditt hva Sidedesigner kan

Sidebyggeren er rammen. Selve blokkene kommer fra temaet ditt. Det er derfor to nettbutikker kan ha svært forskjellige muligheter i den samme Sidebyggeren, og det forklarer de fleste spørsmålene om «hvorfor har jeg ikke den blokken?». Konkret er det temaet som bestemmer:

• Hvilke blokker som finnes. Modulpanelet viser nøyaktig de blokkene temaet ditt leverer, verken flere eller færre.
• Hvilke felt hver blokk har. To temaer kan begge ha en produktliste, men med helt forskjellige innstillinger. I Delaware fyller du ut et «Product Selector»-felt med en kategoritag, mens du i Montana søker etter kategorier og klikker dem inn.
• Hva feltene heter. Delaware er et engelsk tema, så feltnavnene er på engelsk. DelawareDK og Montana er danske og viser danske feltnavn. Dette er temaets egne tekster, ikke språkvalget ditt i admin.
• Hvordan blokken ser ut. Design, farger, avstander og responsiv oppførsel ligger i temaet. Den samme produktlisten ser derfor ikke lik ut i to temaer.
• Hvilke sidetyper som kan utformes. Et tema trenger ikke å støtte alle sidetyper.
• Om split blocks er aktivert. Muligheten til å plassere seksjoner både over og under sidens hovedinnhold er en innstilling i temaet.
• Om det finnes tematagger. De ekstra innholdsplassene du kan designe utover de vanlige sidene, defineres av temaet. Alaska2 har for eksempel plass til fire fotkolonner og en bunnrad.

Derfor kan modulpanelet være tomt

Når du oppretter et nytt oppsett, viser Sidedesigner alltid alle faste sidetyper i rullegardinmenyen, uansett hvilket tema du bruker. Men blokkene vises først hvis temaet også støtter akkurat den sidetypen. Velger du for eksempel adressesiden i et tema uten blokker for kasseprosessen, får du et tomt sideoppsett uten moduler å velge mellom.

• Montana og MontanaB2B støtter alle sidetyper, inkludert alle trinn i kassen, bestillingssiden, retursenteret og ønskelisten.
• Delaware og DelawareDK støtter kategorier (og dermed forsiden), produkter, landingssider, statiske sider, blogginnlegg, søkesiden, handlekurven, takk-for-bestillingen-siden, innlogging, opprett konto og brukerens bestillinger. De støtter derimot ikke adressesiden, fraktsiden, godkjenningssiden, betalingssiden, tilleggs kjøpssiden, bestillingssiden, retursenteret eller ønskelisten.
• Eldre og enklere temaer kan være begrenset til få sidetyper. California har for eksempel bare blokker for statiske sider, kategorier og landingssider.

Hvis panelet er tomt, er det altså ikke en feil i Side Designer. Det er temaet som ikke har blokker for den typen side.

Hva skjer når du bytter tema?

Seksjonene dine og innholdet i dem tilhører sideoppsettet, ikke temaet, så de forsvinner ikke når du bytter tema. Men det nye temaet må kjenne blokken for å kunne vise den:

• Hvis blokken ikke finnes i det nye temaet, vises ikke innholdet i seksjonen. I Montana vises det i stedet en tydelig melding på siden om at seksjonen mangler. Meldingen er også synlig for kundene dine, så den må rettes umiddelbart.
• Hvis blokken finnes, men med andre felt, beholdes innholdet. Feltene som det nye temaet ikke kjenner til, blir ganske enkelt ikke brukt. Hvis du for eksempel bytter fra Delaware til Montana, må produktvalget i en produktliste angis på nytt, fordi Delaware lagrer en tag, mens Montana lagrer konkrete produkter, kategorier eller landingssider.
• Hvis du bytter tilbake til det gamle temaet, er alt som før.

Gå derfor gjennom sideoppsettene dine og sjekk dem i forhåndsvisning rett etter et temaskift.

Egne temaer og temaer fra Temabutikken

Hvis du har ditt eget tema liggende i nettbutikken, hentes blokkene derfra. Det samme gjelder et tema fra Temabutikken. Rekkefølgen er: ditt eget tema først, deretter et tema fra Temabutikken, og til slutt et av Shoporamas standardtemaer. Hvis du vil ha en ny blokk i ditt eget tema, er det en oppgave for temautvikleren din. Se også Hvilke temaer finnes på Shoporama?

Delte blokker: blokker over og under innholdet

Hvis temaet ditt støtter split blocks, kan du plassere blokker i to soner: over og under sidens hovedinnhold. Dette gir større fleksibilitet i oppsettet. Du kan for eksempel ha et hero-banner over produktlisten og anbefalinger under.

Når split blocks er aktivert, viser Sidedesigner to separate lister med en visuell markering av «Sidens hovedinnhold» mellom dem. Du kan dra blokker fritt mellom de to sonene.

Forhåndsvisningslenke: Del utkast med kolleger og kunder

Når du jobber med en ny versjon av et sideoppsett, kan det hende du må vise resultatet til en kollega eller kunde før du publiserer det. Det kan du gjøre med en forhåndsvisningslenke: en delbar lenke som viser oppsettet ditt i nettbutikken, selv om den er offline.

Slik fungerer det:

1. Finn oppsettet i Side Designer-oversikten, eller åpne det for redigering.
2. Klikk på øyeikonet i listen, eller på forhåndsvisningsknappen øverst i redigeringsvisningen. Lenken åpner nettbutikken i en ny fane med oppsettet ditt aktivert.
3. Hvis du vil dele lenken med en kollega eller kunde, kopierer du den fra adressefeltet i den nye fanen. Du kan også høyreklikke på øyeikonet i oversikten og kopiere lenkeadressen.

Forhåndsvisningslenker blir ikke indeksert av Google eller andre søkemotorer, så du kan trygt dele dem uten at de dukker opp i søkeresultatene.

Koblingen fungerer inntil sideoppsettet slettes. Hvis en delt kobling må trekkes tilbake, for eksempel fordi den er sendt til noen som ikke lenger skal ha tilgang, kan du skrive til support@shoporama.dk, så tilbakestiller vi den for deg.

Mobil og stasjonær PC: slik oppfører seksjonene seg

Du lager ett oppsett, og det samme oppsettet vises på alle skjermer. Det finnes ikke en egen mobilversjon du redigerer separat. I stedet er blokkene responsive: de endrer automatisk antall kolonner og stabler innholdet under hverandre når skjermen blir smalere. Her er hva som faktisk skjer i Montana, slik at du vet hva du kan forvente når du bygger.

Antall kolonner endres med skjermbredden

De fleste rutenettblokker fungerer i tre trinn: mobil, nettbrett fra ca. 768 piksler og datamaskin fra ca. 1024 piksler.

• Produktliste. 2 produkter per rad på mobil, 3 på nettbrett og 4 på datamaskin.
• Produktkarusell og kategorikarusell. 2 synlige elementer på mobiltelefon, 3 fra ca. 640 piksler og 4 til 6 på store skjermer. På mobiltelefonen sveiper man gjennom dem med fingeren.
• Kategoriliste. Avhenger av visningen: Store bilder gir 1 per rad på mobil, mellomstore bilder gir 2, små bilder gir 3 og miniatyrbilder gir hele 5.
• Bildegalleri. Feltet «Kolonner» gjelder først fra nettbrett og oppover. På mobiltelefon vises det 2 kolonner uansett hva du velger, med mindre du velger 1 kolonne i full bredde.
• Verdier/USP-er. 1 per rad på mobiltelefon, 2 fra ca. 640 piksler, og det valgte antallet per rad først fra ca. 1024 piksler.
• Bloggliste. 1 per rad på mobiltelefon, 2 på nettbrett og det valgte antallet kolonner på datamaskin.

To-kolonne-blokker stables, og rekkefølgen har betydning

• Tekst og bilde. På mobil stables de to kolonnene. Velger du Bildplassering: Venstre, står bildet øverst og teksten under. Velger du Høyre, kommer teksten først og bildet under. Har du et viktig poeng som skal leses først på mobil, så velg Høyre.
• Produktblokk. Her vises produktbildet alltid øverst på mobiltelefonen, uansett om du har valgt bildeplassering til venstre eller høyre. Innstillingen gjelder først fra nettbrett og oppover.
• Tekst i to kolonner, Kategorifunksjon, Produktfunksjon og Nyhetsbrev med delt bilde. Alle vises i én kolonne på små skjermer. Funksjonsblokkene og nyhetsbrevet skifter først til to kolonner fra ca. 1024 piksler, altså først på datamaskiner.
• Fordelinger som 60/40 eller 33/66 gjelder kun fra nettbrett og oppover. På mobiltelefon fyller begge deler hele bredden.

Blokker der du selv må tenke mobil

• Stort banner. Du velger høyden som Liten (40 % av skjermhøyden), Middels (60 %) eller Stor (hele skjermhøyden). Velger du Stor, fyller banneret hele telefonens skjerm, og alt annet ligger under folden. Det kan være akkurat det du ønsker, men vær bevisst på det.
• Overskriftsstørrelsen i det store banneret finnes nettopp fordi lange overskrifter brytes uheldig på smale skjermer. Skru ned til «Liten» hvis overskriften din tar mye plass.
• Kategorifunksjon. Antallet kategoribilder ved siden av teksten er det samme på alle skjermer. Velger du «Miniatyr», får du 5 små bilder på tvers, også på en telefon. Velg «Store bilder» hvis mobilbruk er viktigst for deg.
• Tekstbanner. Skriftstørrelsene «Ekstra stor» og «Kjempestor» tar mye plass på en telefon. Hold kampanjeteksten kort.
• Bilder. Temaet leverer automatisk bildene i WebP og i flere størrelser, slik at en mobiltelefon laster ned en mindre fil enn en datamaskin. Du må fortsatt laste opp et skarpt bilde med god oppløsning. Les mer i Optimalisering av bilder for mobil.

Slik sjekker du resultatet

1. Åpne forhåndsvisningslenken på din egen telefon. Dette er den mest realistiske testen, og du kan klikke deg rundt i nettbutikken mens forhåndsvisningen er aktiv.
2. Alternativt kan du gjøre nettleservinduet smalere på datamaskinen og se hvordan seksjonene endrer seg underveis.
3. Hvis du kjører en splittest på sideoppsettet, kan du i statistikken filtrere etter Mobil, Nettbrett eller PC og se om en variant vinner på den ene skjermen og taper på den andre. Les mer i «Slik oppretter og kjører du en splittest».

Til utviklere

I Montana pakkes hver seksjon inn i et section-element med attributtet data-section, der verdien er blokkens ID, f.eks. data-section="hero". Dette gir et stabilt grep for å skjule eller justere en bestemt seksjonstype ved gitte skjermbredder fra nettbutikkens eget stilark, uten å røre selve temaet. Les mer i Eget stilark (Custom CSS).

Ofte stilte spørsmål

Kan jeg lage et eget oppsett for forsiden?

Ja. Forsiden er den kategorien som er merket som forsidekategori. Den raskeste måten er å bruke «Forsiden»-kortet i Side Designer-oversikten: klikk på «Opprett layout», så opprettes en kategorioppsett som er knyttet til forsidekategorien din. Denne konfigurasjonen brukes kun på forsiden, mens den generelle kategorikonfigurasjonen brukes på alle andre kategorisider.

Finnes det en 404-side i Side Designer?

Nei. 404-siden er ikke en støttet sidetype i Side Designer. Den styres via temaet ditt. Hvis du vil endre utseendet på 404-siden, må du justere temaets maler eller spørre temautvikleren din.

Hvilke blokker kan jeg velge mellom?

Det avhenger av temaet ditt, og blokkene har ikke samme navn i alle temaer. Delaware, DelawareDK og Montana har blant annet Hero (i Montana: Stort banner), Banner, Tekst, Tekst med bilde, Produktliste, Produktslider (i Montana: Produktkarusell), Kategoriliste, en bildegitterblokk (Image Grid i Delaware og DelawareDK, Bildegalleri i Montana), Bloggliste, en USP-blokk (Value Propositions i Delaware, Verditilbud i DelawareDK og Verdier/USP-er i Montana), Nyhetsbrev og en blokk for fri HTML-kode. Trustpilot finnes i Delaware og DelawareDK, mens tekstbanner og mellomrom og skilletegn finnes i Montana og MontanaB2B. Åpne en oppsettside og klikk på «Moduler»-fanen i høyre kant for å se den fullstendige listen som gjelder for temaet ditt.

Ser sidene mine i Sidedesigner også bra ut på mobil?

Ja. Standardblokkene i Delaware, DelawareDK og Montana er fullt responsive og tilpasser seg automatisk til mobilskjermer. Hero-bilder skaleres ned, kolonner stables under hverandre, og produktslidere blir til karuseller man kan sveipe gjennom. Bruk komprimerte bilder, slik at siden også lastes raskt inn på mobildata.

Hvor mange spesifikke oppsett kan jeg ha?

Det er ingen øvre grense. Du kan opprette så mange spesifikke oppsett du vil. Hvert oppsett kan knyttes til ett eller flere spesifikke produkter, kategorier, landingssider, statiske sider eller blogginnlegg.

Påvirker mange Sidedesigner-blokker sidens hastighet?

Side Designer-utdata blir lagret i hurtigbufferen, slik at selve visningen er rask. Det som vanligvis påvirker hastigheten, er antallet bilder og videoer på siden. Bruk komprimerte bilder og «lazy loading» der det er mulig.

Kan jeg flytte en blokk mellom to oppsett?

Nei, blokker er knyttet til oppsettet de er opprettet i. Men du kan duplisere en blokk innenfor samme oppsett og kopiere innholdet manuelt over til et annet oppsett.

Kan jeg se hvordan siden ser ut mens jeg redigerer?

Ja. Du kan klikke på «Forhåndsvisning»-knappen øverst i redigeringsvisningen, så åpnes en forhåndsvisningslenke til nettbutikken i en ny fane. Rekkefølgen på seksjonene lagres automatisk når du flytter dem rundt, men tekst, bilder og de øvrige feltene lagres først når du klikker på «Lagre». Oppdater deretter forhåndsvisningsfanen for å se resultatet. Selv om oppsettet er offline, kan du se det via forhåndsvisningslenken, og du kan dele lenken med kolleger eller kunder.

Kan jeg designe kassen med Sidedesigner?

Ja, hvis temaet ditt støtter det. Hvert trinn i kassen (adressesiden, fraktsiden, godkjenningssiden, betalingssiden og takk-for-bestillingen-siden) er en fast sidetype der du kan legge til for eksempel en USP-blokk, en tekstblokk eller en blokk med fri kode med ekstra sikkerhetssignaler. Montana og MontanaB2B støtter alle trinnene i kassen, mens Delaware og DelawareDK kun støtter «Takk for bestillingen»-siden. Alaska2 støtter adressesiden, fraktsiden og betalingssiden, men verken godkjenningssiden eller «Takk for bestillingen»-siden. Selve kassefeltene styres av temaet, ikke av blokkene.

Hva er forskjellen mellom en «dynamisk» og en «fast» sidetype?

Det finnes mange dynamiske sidetyper (Kategori, Produkt, Landingsside, Statisk side, Blogginnlegg), slik at du kan ha både en generell oppsett og flere spesifikke. Faste sider (handlekurv, kasse-trinn, bestillingsside, innlogging osv.) finnes det bare én av per nettbutikk, så de kan bare ha én layout.

Jeg finner ikke blokken som kollegaen min har i nettbutikken sin. Hvorfor?

Fordi blokkene kommer fra temaet og ikke fra Sidedesigner. Dere bruker sannsynligvis to forskjellige temaer. Åpne en sideoppsett og klikk på «Moduler»-fanen i høyre kant, så ser du nøyaktig hvilke blokker nettbutikken din har. Hvis du mangler en bestemt blokk, må du enten bytte tema eller få en utvikler til å bygge blokken inn i ditt eget tema.

Kan jeg lage én layout for mobil og en annen for datamaskin?

Nei. En sideoppsett gjelder for alle enheter, og blokkene tilpasser seg skjermbredden automatisk. Hvis du vil optimalisere for mobil, må du jobbe med rekkefølgen på seksjonene, høyden på det store banneret, overskriftsstørrelsen og hvor mye innhold som ligger foran det viktigste. Hvis du kjører en splittest, kan du etterpå se i statistikken om en variant klarer seg bedre på mobil enn på datamaskin.

Hva skjer med seksjonene mine hvis jeg bytter tema?

De blir liggende. Seksjoner og innhold lagres i sideoppsettet, ikke i temaet. Men det nye temaet viser bare blokkene det kjenner til, og felter det ikke kjenner til, blir ikke brukt. Gå derfor gjennom sideoppsettene dine og sjekk dem i forhåndsvisningen rett etter et temaskift. Hvis noe ser feil ut, kan du bytte tilbake, og da blir alt som før.

Modulpanelet er tomt på siden jeg nettopp har opprettet. Er det noe galt?

Nei. Det betyr at temaet ditt ikke har blokker for akkurat denne sidetypen. Sidedesigneren viser alltid alle faste sidetyper når du oppretter en oppsett, men det er temaet som avgjør om det er noe å legge til. Dette ser man oftest i kasseprosessen, som ikke alle temaer støtter. Slett oppsettet igjen, eller velg en sidetype som temaet ditt støtter.

Har du spørsmål om Sidedesigner, er du velkommen til å kontakte oss på support@shoporama.dk.