Skip to main content
Blokken Empty cart er det indhold, der vises, når kurven ikke har nogen varer — typisk en besked og en knap til at fortsætte med at shoppe — så en tom drawer stadig er nyttig og i tråd med dit brand. Den vises kun i kurvens tomme tilstand; andre blokke (såsom Header) kan stå ved siden af den i samme tilstand.
Empty cart-blok med en besked for tom tilstand og en call-to-action til at fortsætte med at shoppe

Adfærd

  • Blokken vises kun, når kurven er tom. Så snart en kunde tilføjer en vare, skifter kurven til sin fyldte tilstand, og denne blok erstattes af dit fyldte kurvlayout.
  • I editoren er CTA-linket inaktivt, så et klik på det ikke navigerer dig væk, mens du designer.

Indstillinger

Placering og grænser

  • Region: body.
  • Maksimum: 1 pr. kurvtilstand.
  • Tilstand: kun tom kurv. Denne blok vises ikke i den fyldte tilstand. Nye kurve inkluderer som standard også en Header i den tomme tilstand; se Hvordan fungerer kurve?.
  • Tilføjes som standard til nye kurve. Ikke låst — du kan fjerne eller skjule den.

Brugerdefineret skabelon

Understøtter en brugerdefineret skabelon fra dens Code-fane, som erstatter denne bloks indbyggede markup med din JSX. Dette er de props, den modtager.
Denne blok renderes kun, når kurven er tom, så der er intet kurvobjekt i propsene. Render href som et rigtigt <a> frem for en scriptet navigation, og text med dangerouslySetInnerHTML, da det allerede er saneret HTML.

Design

Style denne blok med dens Design-sektion i indstillingspanelet. Det er tilsidesættelser pr. blok, som lægger sig oven på dit globale design og falder tilbage til det, når de er tomme.

Text

Sektionen Text i Design lader dig styre typografien for to elementer. Brug Text element-vælgeren til at skifte mellem dem. Message — beskeden for tom tilstand. Fed og tekstfarve indstilles i Rich Text-editoren ovenfor (i fanen Settings), ikke her. Button label — teksten på knappen til at fortsætte med at shoppe. Tekstfarve indstilles i Button-sektionen i Design.

Knap

Sektionen Button lader dig style CTA-knappen uafhængigt af det globale knapdesign. Brug Default / Hover-omskifteren til at skifte mellem de to tilstande. Hvad er designindstillinger? Læs mere her: Designindstillinger.