Washington-temaet: opsætning af det headless tema

Washington er et af Shoporamas gratis temaer. Det har et roligt, minimalistisk design med meget luft, og det er bygget som et headless tema. Her kan du se, hvordan du vælger Washington, bygger forsiden, sætter menuerne op, og hvad du skal vide om kundekonto, kassen, sporing, og SEO. Til sidst kan du se, hvad temaet ikke kan, så du ved, om det passer til din butik.

Hvad er Washington?

Headless betyder, at butikkens udseende er skilt fra den del af Shoporama, der holder styr på varer, kurv, og ordrer. Du kan læse mere om begrebet i ordbogen under headless commerce. I Washington kører butikken som én app i browseren. Når kunden klikker videre, henter temaet kun det nye indhold, i stedet for at indlæse hele siden forfra.

For kunden betyder det, at siderne skifter uden at genindlæse. Lægger kunden en vare i kurven, åbner kurven i siden af skærmen, så kunden kan handle videre med det samme. Du kan se billeder af temaet på temasiden for Washington.

Washington passer godt til butikker med et overskueligt sortiment, hvor varerne sælger på billeder og en kort tekst, og som vil have et enkelt udtryk uden selv at skulle designe noget. Har du brug for abonnementer, produktfiltre, eller anmeldelser, er Montana det rigtige valg. Se alle temaerne i Hvilke temaer er der på Shoporama?

Sådan vælger du Washington

1. Gå til Design → Tema. Siden hedder Vælg tema.
2. Find Washington under de gratis temaer, og klik Vælg på kortet. Der står nu Valgt.
3. Klik Gem nederst på siden.

Skiftet tager typisk et minut, og imens viser din shop en kort ventebesked. Dine produkter, kategorier, ordrer, og kunder følger uændret med. Washington har sit eget design og sine egne tekster, så gennemgå teksterne og temaindstillingerne efter skiftet. Har du allerede sat en længere fortrydelsesfrist i Montana, gælder den også i Washington.

Washington har et fast design, så der er ingen farveindstillinger. Under Design → Temaindstillinger finder du kun fortrydelsesfristen, som du kan læse om længere nede. Logoet henter Washington fra Design → Logo & betingelser, og shoppens navn fra Navn på webshop under Webshop → Generelt står altid i headeren ved siden af logoet. Har du lidt kendskab til CSS, kan du justere udseendet under Design → Stylesheet. Stylesheetet hører til shoppen og ikke til temaet, så har du skrevet egen CSS til dit tidligere tema, kommer den også med i Washington. Kig derfor butikken igennem efter skiftet.

Når temaet er skiftet, så gå disse fem ting igennem:

1. Sæt forsiden op i Sidedesigneren, og husk en produktsektion, hvis der skal være varer på forsiden.
2. Lav en menu med placeringen Øverst og en med placeringen Nederst, og læg et link til dine handelsbetingelser i menuen nederst.
3. Gennemgå Design → Tekster og Design → Logo & betingelser.
4. Tjek dine betalingsmetoder under Integrationer → Betalingsgateways.
5. Læg en testordre med pakkeshop og rabatkode. Bruger du sporing, så hav Tag Managers forhåndsvisning åben, og tjek at eventsene og købet kommer med.

Læs mere om temaernes indstillinger i Temaindstillinger: sådan tilpasser du dit tema.

Byg forsiden i Sidedesigneren

Forsiden bygger du under Design → Sidedesigner. Åbn det sidelayout, der bruges på forsiden, og brug Tilføj sektion til at sætte sektioner på, fx et stort banner, en produktliste, eller en tekst med billede. Har du ikke et sidelayout til forsiden endnu, så klik Opret nyt sidelayout, og vælg Kategori (inkl. forsiden). Washington har de samme 25 sektioner med de samme felter som Montana. Har du allerede bygget en forside til Montana, følger den derfor med, og den følger også med tilbage, hvis du skifter igen.

Uden en opsætning i Sidedesigneren viser forsiden varerne fra den kategori, der er markeret som forside. Så snart forsiden har en opsætning, vises kun dine sektioner. Skal der stadig være varer på forsiden, så tilføj en Produktliste eller en Produkt-karusel.

Sektionerne kan også bruges på kategorier, varer, statiske sider, landingssider, og blogindlæg. Sidelayouts til faste sider som kurven, kvitteringen, og login-siden vises ikke i Washington. Sektionen Indholdsposter viser posterne uden links i Washington, fordi temaet ikke kan vise indholdstypernes egne sider. Læs mere i Sidedesigner og Opsætning af forsiden.

Menuer øverst og nederst

Menuerne laver du under Indhold → Menuer. Washington bruger to placeringer, som du vælger i feltet Placering af menuen:

• Øverst: hovedmenuen i headeren. Den kan have to niveauer, og undermenuerne vises som en rullemenu.
• Nederst: links i footeren. Her vises kun første niveau og kun menupunkter med et link, så lav menuen som en flad liste.

Har en af dine menuer placeringen Højre side eller Venstre side fra et tidligere tema, står der "(bruges ikke af dit tema)" ved siden af. Vælg en af de to andre placeringer i stedet. Uden en menu med placeringen Øverst bruger headeren shoppens første menu, så giv altid hovedmenuen placeringen Øverst.

Uden en menu nederst viser footeren et link til dine handelsbetingelser. Så snart du laver en menu nederst, forsvinder det link, så læg selv et link til betingelserne i menuen. Linket "Fortryd købet" står altid i footeren. Læs mere i Menuer og navigation og Logo, favicon og handelsbetingelser.

Ret temaets tekster

Knapper, overskrifter, og beskeder i Washington retter du under Design → Tekster. Teksterne står på dansk, og sælger du i flere lande, vises de på landets sprog. Gennemgå dem efter skiftet, så de lyder som din butik. Læs mere i Oversæt og tilpas tekster i din webshop.

Kundekonto: log ind, opret konto, og Mine ordrer

Øverst i headeren står Log ind, og når kunden er logget ind, står der Min konto. Fra siden Log ind kan kunden også oprette en konto eller klikke Glemt adgangskode?. Under Min konto er der fanerne Oversigt, Mine ordrer, Rediger oplysninger, og Log ud. Kundesiderne vises med en enkel header uden menu, hvor kunden kommer tilbage til butikken med Fortsæt med at handle.

• Opret konto: kunden får en velkomstmail med sin adgangskode.
• Glemt adgangskode?: kunden får en mail med et link, der logger direkte ind. En ny adgangskode vælges bagefter under Rediger oplysninger.
• Mine ordrer: viser ordrenummer, dato, status, og total, så kunden selv kan slå en ordre op i stedet for at skrive til dig.

Er kunden logget ind, er adressen udfyldt i kassen, og det, kunden retter i kassen, gemmes på kontoen til næste gang. Indloggede kunder får også deres kundegruppepriser. Læs mere i Kundegrupper og B2B-priser.

Kurv, checkout, og betaling

Kurven håndterer varianter, pant, rabatkoder, og gavekort. Kunden klikker Har du en rabatkode? på siden Indkøbskurv, skriver koden, og klikker Anvend. Kunden får straks besked, hvis koden ikke findes eller ikke længere kan bruges. Har en vare pant, står panten som en egen linje i kurven og under prisen på varen. Gavekort indløses i samme felt. Koderne opretter du som altid, se Opret en rabatkode.

Har du et loyalitetsprogram under Kunder → Loyalitetsprogram, kan kunden også betale med point. En kunde, der er logget ind, ser boksen Betal med point på siden Indkøbskurv med sin saldo, og hvor mange point der kan bruges på ordren. Kunden skriver et antal og klikker Brug point, eller klikker Brug alle point. Rabatten står som en egen linje i kurven, i kassen, på kvitteringen, og i ordremailen. Under totalen står, hvor mange point ordren giver. Gæster får at vide, at de optjener pointene med en konto. Pointene tildeles som i dine andre temaer, når ordren godkendes eller sendes, alt efter Tildelingstidspunkt.

Shoppens regler for point gælder også i Washington, fx hvilke varer og kundegrupper der er med. En rabatkode kan kun bruges sammen med point, hvis Kan kombineres med kundeklub point er slået til på koden. Ellers står der "Du har ingen point du kan bruge på denne ordre", så længe koden ligger i kurven.

Selve kassen har tre trin:

1. Leveringsadresse: kunden udfylder sine oplysninger og klikker Fortsæt til forsendelse. Gæster ser linjen "Har du en konto? Log ind". Skriver kunden et firmanavn, vises felterne til CVR- og EAN-nummer.
2. Forsendelse: kunden vælger fragt. Ved levering til en pakkeshop er den første pakkeshop på listen valgt på forhånd, og kunden kan vælge en anden eller søge på postnummer eller by. Kunden kan kun vælge en pakkeshop fra listen, så du slipper for ordrer med en ugyldig pakkeshop.
3. Betaling: kunden vælger betalingsmetode og godkender dine handelsbetingelser.

Washington bruger shoppens egne betalingsmetoder fra Integrationer → Betalingsgateways. Kun metoder, der er slået til som Online, og som må bruges i kundens land, vises. Klikker kunden to gange på knappen, bliver der kun lavet én ordre.

Betalingsmetoder, hvor Marker automatisk nye ordrer som betalte? er slået til, fx faktura til erhvervskunder, vises kun for kunder, der er logget ind. Læs mere i Hvordan modtager man betaling online? og Opret fakturabetaling.

Lande, sprog, og valuta

Sælger du i flere lande, viser Washington en sprog- og landevælger i headeren og footeren. Vælgeren vises, så snart du har slået mindst ét land til ud over shoppens eget. Kunden ser priserne i landets valuta og teksterne på landets sprog, og i kassen vises kun de fragt- og betalingsmetoder, der hører til landet. Læs mere i Sælg i flere lande og på flere sprog.

Fortrydelse og returnering

Linket Fortryd købet står altid i footeren, og under Mine ordrer står det ved de ordrer, der stadig er inden for fristen. Giver du længere fortrydelsesret end lovens 14 dage, så skriv antallet af dage i feltet Fortrydelsesfrist (dage) under Design → Temaindstillinger → Checkout. Et tomt felt betyder 14 dage. Har du markeret en vare som digitalt indhold under Fortrydelsesret på varen, skal kunden give samtykke til levering med det samme i kassen, og varer uden fortrydelsesret står i betalingstrinnet. Læs mere i Undtag produkter fra fortrydelsesretten.

Har du slået returcenteret til, står der Returner ved afsendte ordrer under Mine ordrer. Læs mere i Digital fortrydelse og Returcenter.

Sporing med Google Tag Manager og GA4

Washington lægger de samme e-handels-events i dataLayer som Montana, hele vejen fra varelisten til købet: view_item_list, view_item, add_to_cart, remove_from_cart, view_cart, begin_checkout, add_shipping_info, add_payment_info, og purchase. Eventsene sendes, når kunden gør tingene, og købet sendes på kvitteringen, én gang pr. ordre. En opsætning i Google Tag Manager og GA4, der bygger på disse events i Montana, virker derfor også i Washington.

Eventsene kræver, at sporingen og dit Tag Manager-ID er slået til i shoppens sporingsopsætning, ligesom i Montana. Har du brugt Tag Manager med Montana, virker det derfor også i Washington. Har du ikke, så skriv til support@shoporama.dk, så hjælper vi dig med at slå det til. Et Tag Manager-script i et HTML-felt indlæser kun containeren. Eventsene kommer først, når sporingen er slået til.

Fordi siden ikke genindlæses, sender temaet eventet virtual_page_view med sidens adresse og titel, hver gang kunden skifter side. Den første side tæller Tag Manager som en almindelig sidevisning. GA4 kan selv tælle sideskiftene via sin forbedrede måling, eller du kan bruge eventet i din Tag Manager-opsætning. Brug kun den ene, så sidevisningerne ikke tælles dobbelt.

Apps og egne scripts i shoppens HTML-felter kører kun, når siden indlæses første gang. Et script, der selv tæller sidevisninger, ser derfor kun den første side. Skal noget ske ved hvert sideskift, så lad det reagere på eventsene i dataLayer, fx via Tag Manager.

Bruger du Shoporamas sporingsmodul under Webshop → Sporing, sender det sine events, når en side indlæses fra serveren. I Washington er det den første side, kunden ser, betalingen, og kvitteringen. Købet kommer derfor med, men varevisninger og "læg i kurv" senere i besøget gør ikke. Er sporingen af hele forløbet vigtig for dine annoncer, er Montana det sikre valg.

SEO i Washington

Første gang en side vises, sender serveren titlen, meta description, canonical, Open Graph, produktdata som JSON-LD, og Sidedesignerens sektioner med. Selve varelisterne og produktsiderne bygges derimod i browseren. En søgemaskine, der ikke kører JavaScript, ser derfor mindre af dine varetekster end i et klassisk tema som Montana. Betyder trafikken fra Google på dine varetekster meget for din butik, er Montana det sikre valg.

Kurven, kassen, søgeresultaterne, kvitteringen, kundesiderne, og siden til at fortryde et køb er automatisk skjult for søgemaskiner. Skjuler du en vare, kategori, side, eller landingsside for søgemaskiner (feltet Skjul for søgemaskiner på varen, Aktiver "noindex, follow" på de andre), sætter Washington "noindex, follow". Læs mere i SEO i Shoporama og Sæt noindex på en side, produkt eller kategori.

Det kan Washington ikke

Washington er et enkelt tema, og en række funktioner kræver Montana. Har du brug for en eller flere af dem, så vælg Montana i stedet:

• Abonnementer
• Ønskelister
• Produktfiltre på kategorisider og søgning
• Produktanmeldelser
• Indholdstyper med egne sider, fx opskrifter
• Tilkøb på produktsiden
• Lagernotifikation, hvor kunden får besked, når varen er på lager igen. Udsolgte varer viser blot "Udsolgt".
• Fil-upload i felter, kunden udfylder på produktet. Tekstfelter virker.
• Farver og skrifttyper, som du vælger under Temaindstillinger
• Enhedspris (fx kr/kg) på varen
• En login-mur, hvor kun erhvervskunder kan se butikken. Den findes i MontanaB2B.

Til udviklere

Washington er bygget på shoppens headless API. Temaet henter varer, sider, menuer, kurven, og kassen fra shoppens /api og bygger siderne i browseren med almindelig JavaScript og Tailwind CSS uden frameworks. Du kan derfor bruge temaet som eksempel, hvis du vil bygge din egen butiksfront. Kurv, kasse, og login følger kundens cookies og virker kun på shoppens primære domæne under Webshop → Domæne (eller et lands eget domæne), mens varer og indhold kan hentes fra alle domæner.

Kom i gang med Byg din egen butiksfront på Shoporamas headless API, og find alle felter og fejlkoder i referencen til det headless API.

Ofte stillede spørgsmål

Ligger mine varer og kunder der stadig, når jeg skifter til Washington?

Ja. Produkter, kategorier, ordrer, og kunder følger uændret med, når du skifter tema. Dine kunder logger ind med den samme e-mail og adgangskode som før, og under Mine ordrer ser de de ordrer, der hører til deres konto.

Kan jeg skifte tilbage til Montana, hvis det ikke fungerer for mig?

Ja. Vælg Montana under Design → Tema, og klik Gem. Sidedesignerens opsætning er fælles for de to temaer, så din forside er der stadig, og Montanas farver og temaindstillinger er ikke slettet i mellemtiden. Har du rettet i Sidedesigneren, mens du brugte Washington, ser du også de ændringer i Montana.

Mine kunder bruger filtrene på kategorisiderne. Mister jeg dem, hvis jeg skifter?

Washington kan ikke vise produktfiltre, så kunderne ser ingen filtre, så længe du bruger temaet, og menupunktet Design → Filter forsvinder i admin. Filtrene er en indstilling i shoppen og ikke i temaet, så de bliver ikke slettet. Skifter du tilbage til Montana, er de der igen. Det samme gælder dine anmeldelser.

En kunde har glemt sin adgangskode og kan ikke se sine ordrer. Hvad gør jeg?

Bed kunden klikke Log ind og derefter Glemt adgangskode?. Linket i mailen logger kunden ind, så kunden kan se sine ordrer med det samme. Kommer mailen ikke, så bed kunden tjekke spamfilteret og stavningen af e-mailen.

Bliver "læg i kurv" og køb registreret i Tag Manager, når siden ikke genindlæses?

Ja, hvis sporingen og dit Tag Manager-ID er slået til i shoppens sporingsopsætning som i Montana. Så sender Washington eventsene til dataLayer, når kunden lægger en vare i kurven, går til kassen, og så videre, og købet sendes på kvitteringen. Bruger du sporingsmodulet under Webshop → Sporing, kommer kun købet og den første side med. Du kan selv tjekke det ved at åbne Tag Managers forhåndsvisning og lægge en testordre.

Hvordan ser et produkt ud, når det deles på Facebook?

Washington sender Open Graph-oplysningerne med fra serveren, så Facebook og andre tjenester viser produktets navn, billede, og en kort beskrivelse. Det kræver ikke noget af dig, ud over at produktet har et billede.

Hvorfor kan jeg ikke vælge faktura, når jeg tester kassen?

Faktura og andre metoder, hvor Marker automatisk nye ordrer som betalte? er slået til, vises kun for kunder, der er logget ind. Tester du som gæst, ser du kun de øvrige metoder. Log ind med en testkunde, så dukker metoden op.

Kommer CVR- og EAN-nummer med på ordren?

Ja. Det, kunden skriver, gemmes på ordren og, når kunden er logget ind, også på kontoen. Er kunden medlem af et firma, bruges firmaets CVR- og EAN-nummer.

Kan kunden komme videre uden at vælge en pakkeshop?

Nej. Den første pakkeshop på listen er valgt på forhånd. Finder Washington ingen pakkeshops ved kundens postnummer, får kunden besked om at rette adressen og kan ikke gå videre. Den valgte pakkeshop gemmes på ordren som i de andre temaer.

Se også: Hvilke temaer er der på Shoporama?, Sidedesigner, og Menuer og navigation.

Har du brug for hjælp? Kontakt os på support@shoporama.dk.