Page Builder

Med Page Builder bygger du dit eget sidelayout ved at tilføje, flytte og konfigurere indholdsblokke. Du kan skabe unikke layouts til din forside, kategorisider, produktsider, landingssider, checkout og mange flere typer sider. Helt uden at skulle kode.

Hvor finder jeg Page Builder?

Du finder Page Builder under Konto » Webshop » Page Builder i din Shoporama-administration. Her opretter du nye sideopsætninger eller redigerer eksisterende.

Hvilke sidetyper understøtter Page Builder?

Page Builder understøtter to grupper af sidetyper. Den første gruppe er dynamiske sider, hvor du kan vælge om opsætningen skal gælde for alle sider af typen eller kun for udvalgte sider:

• Kategori (inkl. forsiden). Layoutet på alle kategorisider og forsiden. Forsiden er den kategori der er markeret som forsidekategori, så hvis du vil have et særligt forsidelayout, opretter du en specifik kategoriopsætning der peger på den valgte kategori.
• Produkt. Layoutet på produktsider.
• Landingsside. Layoutet på landingssider.
• Statisk side. Layoutet på statiske sider, fx Om os og Handelsbetingelser.
• Blogindlæg. Layoutet på blogindlæg.

Den anden gruppe er faste sider, hvor der kun kan være ét layout pr. shop:

• Søgesiden
• Kurven
• Adressesiden (i checkout)
• Fragtsiden (i checkout)
• Godkendelsessiden (i checkout)
• Betalingssiden
• Tak-for-ordre-siden
• Merkøbssiden
• Ordresiden
• Returcenter
• Login-siden
• Brugerens ordrer
• Brugerens ønskeliste

Hvis dit tema definerer egne tematags (genbrugelige indholdspladser), kan du også oprette Page Builder-opsætninger til dem. De vises i en særskilt gruppe ved oprettelse.

Sådan opretter du en sideopsætning

1. Gå til Konto » Webshop » Page Builder.
2. Klik Opret ny.
3. Vælg hvilken sidetype opsætningen skal gælde for.
4. For dynamiske sidetyper (Kategori, Produkt, Landingsside, Statisk side, Blogindlæg) kan du vælge om opsætningen skal gælde for alle sider af den type, eller kun for specifikke sider. For faste sider kan der kun være ét layout pr. shop.
5. Giv eventuelt opsætningen et navn, så du kan genkende den i listen.
6. Gem, og begynd at tilføje blokke.

Sådan bygger du forsiden

Forsiden er en almindelig kategori der er markeret som forsidekategori. Vil du give forsiden et særligt look, gør du sådan her:

1. Sørg for at du har en kategori markeret som forsidekategori (gøres på selve kategorien). Læs mere i Opsætning af forsiden.
2. Gå til Page Builder og klik Opret ny.
3. Vælg sidetypen Kategori (inkl. forsiden).
4. Vælg Specifikke sider og tilknyt din forsidekategori.
5. Tilføj de blokke der skal udgøre forsiden, fx en hero-sektion, en produktslider, value propositions og en blogliste.

Den specifikke opsætning bruges nu på forsiden, mens dine øvrige kategorier kører på den generelle kategori-opsætning (eller temaets standard).

Tilgængelige bloktyper

De tilgængelige bloktyper afhænger af dit tema. Her er de mest almindelige i Delaware, DelawareDK og Montana:

• Hero. Stor hero-sektion med overskrift, beskrivelse, knap og baggrundsbillede.
• Banner. Billeder i karrusel-/sliderformat.
• Tekst. Fritekstblok med overskrift og formatering.
• Tekst med billede. To kolonner med tekst på den ene side og billede på den anden.
• To-kolonne tekst. Tekst fordelt i to kolonner.
• Produktliste. Vis produkter fra en kategori, landingsside eller baseret på popularitet/nyeste.
• Produktslider. Produkter i karrusel-format.
• Kategoriliste. Vis produktkategorier.
• Kategorislider. Kategorier i karrusel-format.
• Billedgrid. Gitter af billeder med valgfrie links.
• Blogliste. Vis seneste blogindlæg.
• Trustpilot. Trustpilot-anmeldelser widget.
• Value propositions. Fremhæv dine USP'er, fx gratis fragt eller hurtig levering.
• Knap. Call-to-action-knap med link.
• HTML. Ren HTML for fuld kontrol over indholdet.

Bruger du et andet tema, kan listen se anderledes ud. Klik Tilføj blok i en opsætning for at se de blokke dit tema reelt understøtter.

Drag and drop

Du kan nemt ændre rækkefølgen af dine blokke ved at trække dem op eller ned. Grib fat i blokkens overskrift og træk den til den ønskede position. Rækkefølgen gemmes automatisk.

Du kan også klappe blokke sammen for at få et bedre overblik, hvis du har mange blokke på en side.

Konfiguration af blokke

Hver blok har sine egne indstillinger, afhængigt af typen. Typiske muligheder inkluderer:

• Tekst og overskrifter. Skriv direkte i en teksteditor.
• Billeder. Upload billeder direkte fra din computer.
• Produktvalg. Vælg specifikke produkter, kategorier eller landingssider.
• Links og knapper. Tilføj URL'er og knaptekster.
• Gentagelige elementer. Nogle blokke (fx bannere) tillader at du tilføjer flere elementer i samme blok.

Du kan give hver blok et brugerdefineret navn, så det er nemmere at holde styr på dem i oversigten.

Product Selector i Delaware/DelawareDK

I Delaware og DelawareDK har flere Page Builder-sektioner (Produktliste, Produktslider og Produktfeature) et felt kaldet Product Selector. Dette felt bruges til at angive hvilke produkter der skal vises i sektionen.

Sådan bruger du Product Selector

1. Vælg først en Product Type i dropdown-menuen, fx "By Category Tag", "By Landing Page Tag" eller "By Product Ids".
2. Udfyld derefter Product Selector-feltet med den relevante værdi (se nedenfor).

Hvis du vælger "Newest Products", "Popular Products" eller "Most Sold Products" som Product Type, behøver du ikke udfylde Product Selector-feltet. Produkterne hentes automatisk.

Hvad skal jeg skrive i feltet?

Det afhænger af den valgte Product Type:

• By Category Tag. Skriv kategoriens tag. Du finder tagget ved at redigere kategorien i admin under feltet "Tag". Eksempel: sommertilbud
• By Landing Page Tag. Skriv landingssidens tag. Du finder tagget ved at redigere landingssiden i admin. Eksempel: nyheder
• By Product Ids. Skriv produkt-ID'erne adskilt med komma. Du finder et produkts ID i produktlisten eller i URL'en når du redigerer produktet. Eksempel: 123,456,789

Generelle vs. specifikke opsætninger

For dynamiske sidetyper er der to måder at bruge Page Builder på:

• Generel opsætning. Gælder for alle sider af en given type. Fx én opsætning for alle kategorisider.
• Specifik opsætning. Gælder kun for udvalgte sider. Fx en særlig opsætning for én bestemt landingsside, eller for forsidekategorien.

Specifikke opsætninger har forrang. Hvis et produkt har sin egen opsætning, bruges den i stedet for den generelle produktside-opsætning.

Smartere felter i Montana-temaet

Montana-temaet bruger de nyeste Page Builder-felttyper, der gør det nemmere at vælge indhold:

• Produkt-søgning. Søg og vælg flere produkter på én gang. De vises som tags du nemt kan tilføje og fjerne.
• Kategori-søgning. Vælg kategorier og vis automatisk produkter derfra.
• Landingsside-søgning. Vælg landingssider og hent deres produkter.
• Smart link-felt. Søg på tværs af produkter, kategorier, landingssider, statiske sider og blogindlæg. Hvert resultat er markeret med en farvekodet badge.

I Montanas Produktliste og Produktslider kan du kombinere produkter fra flere kilder (håndplukkede produkter, kategorier og landingssider). Systemet fjerner automatisk dubletter.

Læs mere i vores blogindlæg: Smartere felttyper i Page Builder.

Split Blocks: blokke over og under indholdet

Hvis dit tema understøtter split blocks, kan du placere blokke i to zoner: over og under sidens hovedindhold. Det giver mere fleksibilitet i layoutet. Du kan fx have en hero-banner over produktlisten og anbefalinger under.

Når split blocks er aktivt, viser Page Builder to separate lister med en visuel markering af "Sidens hovedindhold" imellem. Du kan trække blokke frit mellem de to zoner.

Ofte stillede spørgsmål

Kan jeg lave et særskilt layout til forsiden?

Ja. Forsiden er den kategori der er markeret som forsidekategori. Opret en Page Builder-opsætning af typen Kategori, vælg "specifikke sider" og tilknyt din forsidekategori. Så bruges den opsætning kun på forsiden, og din generelle kategori-opsætning bruges på alle øvrige kategorisider.

Findes der en 404-side i Page Builder?

Nej. 404-siden er ikke en understøttet sidetype i Page Builder. Den styres via dit tema. Hvil du vil ændre udseendet på 404-siden, skal du justere temaets templates eller spørge din temaudvikler.

Hvilke blokke kan jeg vælge mellem?

Det afhænger af dit tema. Delaware, DelawareDK og Montana har bl.a. Hero, Banner, Tekst, Tekst med billede, Produktliste, Produktslider, Kategoriliste, Billedgrid, Blogliste, Trustpilot, Value propositions, Knap og en HTML-blok til fri kode. Klik Tilføj blok i en opsætning for at se den fulde liste der gælder for dit tema.

Ser mine Page Builder-sider også godt ud på mobil?

Ja. Standard-blokkene i Delaware, DelawareDK og Montana er fuldt responsive og tilpasser sig automatisk mobilskærme. Hero-billeder skaleres ned, kolonner stables under hinanden, og produktslidere bliver til swipebare karruseller. Brug komprimerede billeder, så siden også er hurtig på mobildata.

Hvor mange specifikke opsætninger kan jeg have?

Der er ingen øvre grænse. Du kan oprette så mange specifikke opsætninger du vil. Hver opsætning kan tilknyttes ét eller flere specifikke produkter, kategorier, landingssider, statiske sider eller blogindlæg.

Påvirker mange Page Builder-blokke sidehastigheden?

Page Builder-output bliver cachet, så selve renderingen er hurtig. Det der typisk påvirker hastigheden er antallet af billeder og videoer på siden. Brug komprimerede billeder og lazy loading hvor det er muligt.

Kan jeg flytte en blok mellem to opsætninger?

Nej, blokke er knyttet til den opsætning de er oprettet i. Men du kan duplikere en blok inden for samme opsætning og kopiere indholdet manuelt over til en anden opsætning.

Kan jeg se hvordan siden ser ud, mens jeg redigerer?

Ja. Du kan klikke "Vis side" eller åbne din webshop i en separat fane og opdatere efter hver ændring. Page Builder gemmer ændringer automatisk, så de slår igennem med det samme.

Kan jeg designe checkout med Page Builder?

Ja. Hvert trin i checkout (Adressesiden, Fragtsiden, Godkendelsessiden, Betalingssiden og Tak-for-ordre-siden) er en fast sidetype, hvor du kan tilføje fx Trustpilot-widgets, value propositions, info-bokse og en HTML-blok med ekstra tryghedssignaler. Selve checkout-felterne styres dog af temaet, ikke af blokkene.

Hvad er forskellen på en "dynamisk" og en "fast" sidetype?

Dynamiske sidetyper (Kategori, Produkt, Landingsside, Statisk side, Blogindlæg) findes der mange af, så du kan have både en generel opsætning og flere specifikke. Faste sider (kurv, checkout-trin, ordreside, login osv.) findes kun én af pr. shop, så de kan kun have ét layout.

Har du spørgsmål til Page Builder, er du velkommen til at kontakte os på support@shoporama.dk.