EN
Søger...

Hjemmesidehoved – Design

Header indeholder det første sæt af synlige elementer, når dit websted indlæses. Du kan arrangere elementer som logo, navigationsmenu og sociale ikoner på den måde, du vil have dem til at blive vist i overskriften.

I denne artikel:

Du kan administrere Header-stylingen (for både desktop og mobil) fra Design (1) afsnit.

Når du er inde i Design-sektionen, skal du klikke på Header (2) faneblad.

Alternativt kan du også bruge studiets søgemulighed.

  • Indtast Header (1) i søgefeltet.
  • Fra de relaterede resultater skal du klikke på Design- Hjemmesidehoved mulighed (2).

Header til desktop

  1. Sidehovedlayout – Kontroller det aktuelt anvendte sidehovedlayout for desktop version. Klik på Skift layout knappen for at vælge blandt de tilgængelige headerlayoutindstillinger og anvende på dit websted.
    Vi tilbyder to typer header-layouts – øverste overskriftslayoutog to-kolonne header layouts. De to-kolonne header-layouts findes i temaer som Burst og Isle. 
  2. Bredde – Angiv overskriftsbredden som Fuld bredde or Webstedsbredde.
    'Fuld bredde' vil vise overskriften, mens den dækker hele bredden uden at efterlade nogen margen.
    'Site bredde' kan angives i Design afsnit. Du kan angive en fast bredde her.
    Den viser overskriften ved at overholde den angivne faste bredde. Ved mere.
  3. Lodret polstring – Tilføj plads (top og bund) til din hjemmesides header (specificeret i vh). Vide mere.
  4. Adfærd – Placeringen af ​​dit skrivebordshoved kan indstilles til Fixed (her vil overskriften være fast på toppen, dvs. selvom siden ruller, vil overskriften være synlig) eller Rul med websted (her vil overskriften rulle sammen med siden). 
  5. Sticky Navigation – Aktiver eller deaktiver den sticky navigation i tilfælde af Srulle med websted header position. 
  6. Sticky Menu – Angiv positionen for den fastlåste menu, når siden rulles til venstre eller midten af ​​skærmen.

Bemærk

For sticky navigation vil overskriften blive vist, efter at den første sektion er rullet halvt ned på skærmen

Se overskriftspolstring i aktion:

Tag et kig på en Header på et live-websted.

Se forskellige desktop-header-layouts 

Se forskellige 2-spaltede desktop-header-layouts

Søgebaserede header-layouts, der fokuserer på webstedssøgning

Overskrift – Kant

  1. Kant: Aktiver eller deaktiver rammen for overskrift.
  2. Tykkelse: Angiv bredden af ​​kantlinjer for overskriften.
  3. Position: Indstil positionen for overskriftskanten. Du har fire muligheder - Alle sider, Top & Bund, Kun Top og Kun nederst.

Overskrift – Pille

Pilleformet overskrift i Pixpa tilføjer et elegant og moderne look til din hjemmesides header med afrundede hjørner og afstandsfleksibilitet. Dette design er ideelt til kreative og professionelle, der ønsker at gøre deres header visuelt distinkt og stilfuldt.

Du kan anvende denne stil på ethvert overskriftslayout, hvilket giver dig fuld designfrihed på tværs af forskellige headertyper.

  1. Overskrift – Pille: Tænd for header – Pille-skift for at aktivere pille-styling til dit header.
  2. Hjørneradius: Juster rundingen af ​​sidehovedets hjørner ved hjælp af skyderen eller feltet Hjørneradius. Højere værdier vil gøre hjørnerne mere afrundede.
  3. Top polstring: Angiv mellemrummet over indholdet i pilleoverskriften for at kontrollere lodret afstand.
  4. Bundpolstring: Definer rummet under indholdet for at sikre et afbalanceret udseende.
  5. Kompakt bredde: Dette giver dig mulighed for at vælge, hvor bred din pilleoverskrift skal se ud:
    • Fuld bredde: Strækker sidehovedet over hele skærmens bredde.
    • Webstedsbredde: Justerer overskriften med dit overordnede webstedsindholdsbredde.
    • Kompakt: Krymper overskriften til en strammere, centreret blok – ideel til minimalistiske designs.

Header til mobil

Disse indstillinger giver dig mulighed for at kontrollere, hvordan din hjemmesides header vises på mobile enheder. Dette sikrer et rent og optimeret layout til mindre skærme.

  1. Layout – Kontroller det aktuelt anvendte sidehovedlayout for mobil version. Klik på Skift layout knappen for at vælge blandt de tilgængelige headerlayoutindstillinger og anvende på dit websted.
  2. Lodret polstring – Tilføj Lodret rum (øverst og nederst) til din hjemmeside-header på mobile enheder (specificeret i vh).
  3. Mobil header – Angiv, om mobilheaderen kun skal vises på mobile enheder (op til 768px) eller også skal vises på tablets (op til 1199px).

Sørg for at klikke på Udgiv knappen efter du har foretaget ændringer for at sikre, at de er live på dit websted.

Se forskellige mobile header-layouts 

Bemærk

  • Priksymbol i mobilhovedet henviser til kundekontiene.
  • Det vil kun ses, at kundekontoindstillingen er aktiveret i butikken. Lær mere.

Typer af header

Du kan vælge mellem fire forskellige typer overskrifter:

    1. Normal overskrift
    2. To-kolonne overskrift
    3. Søgebaseret overskrift

 

Normal overskrift

Det normale overskriftslayout har et rent og ligetil design med et logo, navigationslinks, sociale ikoner og menuknap vist vandret. Den er ideel til at give en klassisk og brugervenlig browsingoplevelse.

To-kolonne overskrift

Overskriftslayoutet med to kolonner opdeler overskriften i to adskilte sektioner, hvilket giver mulighed for et logo og sociale ikoner til venstre eller i midten og navigationsmenuen og andre elementer i overskriften til højre som en klikbar sidebjælke.

Dette layout er perfekt til websteder, der skal understrege både deres brand og vigtige handlinger samtidigt.

Det søgebaserede header-layout inkluderer en fremtrædende søgelinje, der gør det nemt for brugere at finde specifikt indhold hurtigt. Dette design er især nyttigt til indholdstunge websteder, hvor søgefunktionalitet er et primært fokus.

Sidehovedelementer

  1. Logo / webstedstitel – Det allerførste element i sidehovedet er webstedets logo/titel. Indstil webstedets titel/upload webstedets logo til dit websted.
    Bemærk: Hvis du ikke har uploadet webstedets logo, vil webstedets titel blive vist på dit websteds overskrift. Desuden, hvis du har angivet begge dele, vil webstedets logo være synligt på dit websteds overskrift.
  2. Menu – Et andet element i sidehovedet er menuen (menulinks). Du kan rækkefølge webstedets navigationslinks, or slet/skjul ethvert menupunkt fra dit websted. 
  3. Sociale ikoner – Du kan tilføje Sociale ikoner der er forbundet til dine sociale medieprofiler til din sidehoved. Du kan uploade en socialt delingsbillede der vil blive brugt som et miniaturebillede, når hjemmesiden eller nogen af ​​hjemmesidens sider deles på sociale medier. Vælg også, hvor sociale medier ikoner ville dukke op på din hjemmeside. De tilgængelige positioner er sidehoved, sidefod, begge eller ingen.
  4. Søgefelt Tilføj en søgefelt der lader besøgende på dit websted søge efter ethvert indhold i produkter (hvis du har en butik aktiveret på dit websted), billeder, blogindlæg og sider (gallerier, mapper og andre sider) til din sidehoved.
  5. Indkøbskurv ikon – Tilføj en flydende indkøbsvogn ikon det er nemt at nå og altid synligt uden at forstyrre dit websted til din sidehoved.
  6. Menu knap Tilføj en menuknap til dit websteds overskrift, dvs. en call-to-action knap, der omdirigerer til en specificeret URL. Du kan angive etiket og URL for menuknappen. Vælg også Knap størrelse at være Lille, mellem eller stor.
Tagged:

Kan du ikke finde det, du leder efter?

Kom i kontakt med en Pixpa-ekspert.

Kontakt os