BunStackDocs

Butikker

Sidemaler

Produktsiden, kategorisidene og tekstsidene som maler: seksjoner med lås, Preview with, bildet ved Details, Properties med stolpene og lesebredden.

Sist oppdatert · 8 min lesing

En mal er ett design som butikken fyller med mange forskjellige ting: hvert produkt, hver kategori eller hver side du skriver i admin. Du endrer malen én gang, og alle sidene følger.

Hvor: Fanen Pages i designeren, gruppen Templates.

Tre maler

MalTegnerDet som skiller sidene
Product pageHver produktside, /products/…Produktets bilder, tekster, egenskaper og tillegg, under Admin › Products
Collection pagesHver kategoriside, All products på /products og søkeresultateneKategoriens navn, tekst og produkter, under Admin › Products › Categories
Text pagesHver side under Admin › Pages, for eksempel Om oss og kjøpsvilkåreneSidens tittel og tekst

Klikk på en mal for å åpne den på arbeidsflaten, som Home. Merket TEMPLATE viser at raden er en mal. Seksjonene på en mal er de samme på alle sidene den tegner.

Gruppene i fanen Pages er beskrevet under Seksjoner og sider.

Seksjoner med lås

Noen seksjoner hører til malen og kan ikke fjernes. De har en lås og merket ALWAYS ON i stedet for ON/OFF.

SeksjonMalHva låsen betyr
ProductProduct pageGalleriet og kjøpspanelet. Står alltid først, og ingenting kan flyttes over. Pris, mva-linje, laveste pris 30 dager og kjøpsknappen er alltid med
Product safetyProduct pageProdusenten og ansvarlig person i EU. Kan flyttes, men ikke slås av. Vises når leverandøren har opplysningene
Page textText pagesSidens tittel og tekst. Står alltid først

Menyen ⋯ Actions og verktøylinjen på arbeidsflaten viser bare det som går. Mangler en låst seksjon i en lagret mal, legger butikken den tilbake. En låst seksjon vises på alle skjermer, så den har ingen Show on.

Produktsiden

Pages › Product page har disse seksjonene fra start, i denne rekkefølgen:

SeksjonInnstillinger i inspektøren
ProductIngen. Et klikk åpner Components › Product page, der utseendet stilles inn
PropertiesPlace (In the buy panel, Own section). Som egen seksjon også Heading
DetailsHeading og Image beside the text (None, Last image)
Product safetyIngen
ReviewsIngen
Linked categoriesColumns per skjermstørrelse under Layout. Kategoriene og overskriftene velges på hver kategori, se Koblede kategorier
You may also likeHeading, Products (4 eller 8) og Columns per skjermstørrelse under Layout
Recently viewedIngen. Er av fra start

En tom Heading viser plattformens tekst på besøkerens språk, for eksempel "Detaljer". Properties, Details, Reviews, Linked categories og You may also like kan slås av, flyttes og fjernes. En fjernet seksjon ligger i biblioteket under This page og kan legges til igjen. Uten Reviews er vurderingen under produktnavnet ingen lenke.

Disse seksjonene har også Width og Show on under Layout. You may also like og hver rad i Linked categories har 4 kolonner på datamaskin, 3 på nettbrett og 2 på mobil til du velger andre. Under navnet på en mals seksjon står det i inspektøren hvor den kan være: Only on product pages eller Only on text pages.

Egne seksjoner fra biblioteket, for eksempel Bilde + tekst eller FAQ, kan legges hvor som helst under Product. Specifications ligger også under This page. Med den på siden står egenskapsradene i en egen seksjon med egen Heading, og Details viser bare teksten.

Teksten i Details

Details viser produktets beskrivelse. Første avsnitt gjentas ikke der når det allerede står ved prisen: når det er Short description, eller når det ikke finnes noen kort beskrivelse og første avsnitt får plass helt ved prisen. Et første avsnitt som kortes ned ved prisen, blir stående i Details. Med egen HTML for kjøpspanelet blir hele beskrivelsen stående i Details.

Bildet ved siden av Details

Image beside the text er None fra start. Med Last image vises produktets siste bilde ved siden av teksten. Bildet vises bare på datamaskin, fra 1025 px. Det byttes ikke når kunden velger en annen variant.

Properties og stolper

Seksjonen Properties bestemmer hvor stolpene står. Hvilke egenskaper som blir stolper, og skalaen deres, stilles inn per egenskap under Products › Attributes.

PlaceDet som vises
In the buy panelStolpene under teksten ved prisen, for eksempel Speed og Control. De andre egenskapene er rader i Details. Det er forvalgt
Own sectionSeksjonens Heading, eller plattformens tekst når den er tom, så stolpene og egenskapsradene, der du legger seksjonen

Show bars under Components › Product page slår stolpene av og på. Når den er av, er Bar-egenskapene rader som de andre. Slår du av eller fjerner seksjonen Properties, blir det heller ingen stolper, og alle egenskaper er rader i Details. Radene står på ett sted: i Specifications når den er på siden, ellers i Properties som egen seksjon, ellers i Details. Med stolpene på står de samme egenskapene ikke også som rader. Med egen HTML for kjøpspanelet tegner plattformen ingen stolper der, og da blir radene stående i tabellen. Properties som egen seksjon tegnes av plattformen, også med egen HTML. I kjøpspanelet gjelder Show on for Properties stolpene, og Properties har ingen Heading, Width eller Background: der tegner den ingen egen seksjon.

Tekstsider

Pages › Text pages har seksjonen Page text med to innstillinger:

InnstillingValg
Reading widthPage, XS 640, S 768, M 1024, L 1280, XL 1440, 2XL 1536 px eller Full. Teksten står i sidens kolonne, så Page, Full og et trinn som er bredere enn siden fyller kolonnen. Custom tar en egen verdi i px eller rem. S er forvalgt. Det er sideteksten sin eneste bredde: seksjonen har ingen annen Width
Text sizeNormal eller Large

Egne seksjoner kan legges under teksten. Teksten skriver du under Admin › Pages, se Sider og juridiske tekster.

Collection pages

Pages › Collection pages tegner kategorisidene, All products og søkeresultatene. Arbeidsflaten viser siden slik butikken gjør: navnet og brødsmulestien, kategoriens beskrivelse, filtrene, raden med antall produkter og sorteringen, produktene og malens seksjoner. På telefon og nettbrett, opptil 1024 px, er filtrene den smale raden som åpner et panel. Bytt arbeidsflaten til Tablet eller Mobile for å se den.

Filtrene og sorteringen virker på arbeidsflaten, så du kan krysse av, folde sammen og åpne panelet for å prøve dem. Det du krysser av, lagres ikke. Et klikk på en seksjon velger den, som på andre sider.

Utseendet på filtrene og sorteringen stilles inn under Components › Collection page. Hvilke filtre en kategori viser, stilles inn på kategorien.

Preview with

Listen Preview with over arbeidsflaten velger hva malen fylles med mens du jobber.

  • Product page: først de mest komplette produktene, med flest bilder, egenskaper og varianter. Så ett produkt fra hver kategori og til slutt alle produkter. Stolper og rader kommer fra produktet. You may also like viser andre produkter i butikken, ikke produktets egne. Linked categories viser en eksempelrad: butikkens første kategori over butikkens første produkter. En linje over den på lerretet sier at det er et eksempel. Produkter som selges bare som tilvalg, står til slutt, i en egen gruppe Sold only as an add-on.
  • Search products… ved siden av listen finner et produkt på navnet.
  • Text pages: butikkens sider, den lengste først.
  • Collection pages: en kategori, All products eller Search results. Fra start vises kategorien med flest filtre, eller All products når butikken ikke har kategorier. Listen viser antall filtre per kategori. En kategori vises med sine egne produkter, i kategoriens rekkefølge som i butikken, sine filtre og sin beskrivelse. For Search results skriver du ordene, og arbeidsflaten matcher dem mot produktnavnene.
  • Valget lagres ikke med malen. Det gjelder i fanen til du lukker den.

Komponentene Product page og Gallery vises med samme produkt og med seksjonene i den rekkefølgen du har lagret. Komponenten Collection page vises med samme valg som Collection pages.

Topptekst og bunntekst

Tannhjulet på en mal i fanen Pages åpner Header og Footer for alle sidene malen tegner. Endringen gjelder i butikken med en gang, ikke ved neste publisering. Hvert produkt, hver kategori og hver side har egen adresse, tittel og søketekst.

Ett valg, ett sted

ValgHvor
Rekkefølge, av og på, egne seksjonerPages, malen, fanen Sections
Bildet ved siden av Details, overskrifter, antall produkterSamme seksjon, inspektøren
Hvor stolpene står, som egen seksjon med overskriftSeksjonen Properties, inspektøren
Utseendet på galleriet og kjøpspanelet, stolper av og på, betalingsikonerComponents › Product page og Gallery
Hvordan en egenskap visesProducts › Attributes
Kort beskrivelse, beskrivelse og bilderProducts, produktet
SEO for et produktProducts, produktet
Egen HTML for kjøpspaneletAdvanced, så Components › Product page › Customize with code