Skip to main content

​
Oversigt

Header-modulet giver dig mulighed for at tilpasse den øverste sektion af din Upcart-drawer med dit brands logo, titeltekst, layout, baggrundsfarve og luk-knap. Visuelle kontroller gør det nemt at style din header uden at skulle definere præcise pixelstørrelser.

​
Header-modulets indstillinger

​
Generelt

Height skifter mellem Slim og Tall for at styre den lodrette plads. Bottom border er enten None eller Thin. Background color tager en hex-kode eller den indbyggede farvevælger og understøtter gennemsigtighed. Upcart Header-modulets General settings med kontroller for højde og baggrundsfarve ved siden af en kurv-forhåndsvisning

​
Titel

Der er tre måder at definere titlen i din cart drawers header på: nedarv dit temas standardstyling for titler, vis din butiks logo, eller opret helt brugerdefinerede tekststile. Hver metode giver fleksibilitet afhængigt af dine designbehov. Upcart Header-modulets titelmuligheder: nedarv tematitler, brandlogo eller brugerdefinerede tekststile

​
Nedarv fra temaets titler

Denne mulighed bruger dit temas standard-overskriftsstile og hjælper dig med at holde designet visuelt konsistent med resten af dit website. Du kan tilføje din egen titel via Text-feltet og dynamisk inkludere antallet af varer i kurven med {{cart_quantity}}. Tekstjusteringen kan sættes til Side eller Center, og du kan vælge det passende overskriftsniveau H2, H3 eller H4 baseret på din butiks indholdsstruktur. Hvis du foretrækker at bruge et brandlogo i stedet for tekst, kan du uploade din butiks logo direkte i denne sektion. Vælg at justere logoet til Side eller Center, og skaler det med slideren Logo size, der går fra 14 px til 48 px. Der er ingen håndhævet grænse for den fil, du uploader, men det anbefales at bruge en PNG-fil for ren gennemsigtighed og skarpe kanter. JPEG’er understøttes også, men kan indeholde baggrundsstøj eller forringe logoets detaljer. Af hensyn til ydeevnen bør du holde filstørrelserne optimerede.
  • Vi anbefaler at bruge en PNG-fil for den bedste kvalitet og understøttelse af gennemsigtige baggrunde.
  • JPEG’er virker også, men ser muligvis ikke lige så rene ud, især hvis dit logo har en baggrund eller fine detaljer.

​
Definér tekststile

Ved at vælge Text-muligheden får du fuld kontrol over titlens styling uafhængigt af din butiks tema. Du kan indtaste en hvilken som helst brugerdefineret titel og inkludere {{cart_quantity}} for dynamiske opdateringer. Tekstjusteringen kan sættes til Side eller Center, med mulighed for at ændre skriftvægten til Normal, Semibold eller Bold. Skriftstørrelsen kan justeres fra 14 px til 48 px med en visuel slider, og du kan valgfrit anvende en tilsidesættelse af tekstfarven.

​
Luk-knap

Luk-knappen kan tilpasses, så den matcher din butiks design. Location placerer den i venstre eller højre side af draweren. Background, Icon og Border tager hver en farve plus en separat hover-farve. Icon size er Small, Medium eller Large, og Icon thickness er Normal eller Thick. Border er None, Thin, Normal eller Thick.
Felterne for kantfarve og kantens hover-farve er deaktiverede, mens Border er sat til None. Vælg først en kantbredde, og indstil derefter dens farver.
Upcart Header-modulets indstillinger for luk-knappen: placering, farver, ikonstørrelse og kant

​
Brugerdefineret skabelon

På version 2.0 af Header-modulet vises en kodeeditor til Custom template under indstillingerne med en enkelt Full-skabelon, der dækker hele modulet. Den bruger React-baseret JSX, og du skal først markere Access custom templates under Settings > Cart settings > Advanced Settings i Cart Editor. Se Opsætning af en brugerdefineret skabelon.

​
Tips

  • Vil du have præcis afstand eller størrelse? Brug brugerdefineret CSS for fuld kontrol ud over sliderne — perfekt til præcise margener, padding eller logoskalering.
  • Test på desktop og mobil. Header-elementer som tekst, logo og knapper kan vises forskelligt på forskellige skærmstørrelser
  • Brug korrekte overskriftsniveauer. Valg af den rigtige overskrift (H2, H3, H4) hjælper med tilgængelighed og SEO. Match strukturen i din butiks indhold.
For flere måder at personliggøre din kurv på kan du udforske vores Upcart-hjælpedokumenter. Hvis du har brug for brugerdefinerede ændringer, anbefaler vi at kontakte en Shopify Expert.