Gå til indhold
Installer app
Dansk

Nederste navigationslinje på mobil

Tilføj en fastgjort, app-lignende bjælke med ikoner, genveje og handlinger til dine kunder.

Vejledning Pro Navigation 8 min. læsning

Bjælken bliver på skærmen, mens kunderne ruller, ligesom fanebjælken i en mobilapp, og giver adgang med ét tryk til forsiden, menuen, kurven, søgning, chat eller et telefonopkald. Et punkt kan også åbne en lille undermenu, f.eks. et punkt Mere med links til konto, kontakt og FAQ.

Editoren til bundbjælken: faner med indstillinger (1) og live-forhåndsvisning (2). Skift enhed i forhåndsvisningen med knapperne nederst til venstre i forhåndsvisningen.

Fanerne med indstillinger er Menupunkter, Generelt, Typografi, Farver, Position, Avanceret og Versionshistorik.

Opret en bundbjælke

  1. Opret bjælken

    Klik på Tilføj bundnavigation på appens Startside – eller klik på Opret menu i Menuadministration, og vælg Nederste bjælke på mobil.

    Startside: (1) hurtige handlinger til at oprette eller importere en menu, (2) knappen, der aktiverer appintegrationen
  2. Konfigurer punkterne

    Rediger standardpunkterne under Menupunkter, og tilføj dine egne. Se Tilføj og rediger punkter.

    Editoren til bundbjælken: faner med indstillinger (1) og live-forhåndsvisning (2). Skift enhed i forhåndsvisningen med knapperne nederst til venstre i forhåndsvisningen.
  3. Style bjælken

    Juster fanerne Generelt, Typografi og Farver. Se Style bjælken.

    Generelle indstillinger, herunder undermenuens position og åbningsstil.
  4. Vælg, hvor den vises

    Vælg enhederne og positionen på skærmen under Position. Se Vælg, hvor bjælken vises.

    Slå bjælken til på mobil (1) og computer (2), og vælg derefter en position.
  5. Gem og udgiv

    Klik på Gem og derefter på Udgiv øverst til højre. Se Udgiv bjælken.

Tilføj og rediger punkter

  1. Vis punkthandlingerne

    Hold markøren over et punkt under Menupunkter for at vise Rediger, Dupliker og Slet. Træk i et punkts håndtag for at ændre rækkefølgen.

    Hold markøren over et punkt for at redigere, duplikere eller slette det.
  2. Tilføj punkter og undermenuer

    Klik på Tilføj element for at tilføje et punkt på det niveau, eller på Tilføj undermenu ved et punkt for at indlejre punkter under det. Indlejrede punkter åbnes som en undermenu, op til tre niveauer.

  3. Klik på Rediger for at åbne Rediger menupunkt. Vælg et Ikon (klik på Skift), angiv en Titel, og klik derefter på feltet Link.

    Klik på feltet Link for at vælge punktets handling.
  4. Vælg en handling

    Klik på Vælg ved en handling (1) i Vælg link. Feltet Link (2) får starten af linket, f.eks. /collections/ for Produkter efter kollektion. Gør det færdigt som vist i kolonnen Syntaks, f.eks. /collections/summer-sale, og klik på Opdater (3).

    Klik på Vælg (1), gør linket færdigt (2), og klik derefter på Opdater (3).

Indstillinger for punkter

Ikon
Klik på Skift for at vælge et ikon eller uploade et billede.
Titel
Teksten under ikonet.
Link
Hvad der sker ved tryk. Klik på feltet for at åbne Vælg link (se Handlinger for punkter).
Åbn i ny fane
Åbner linket i en ny browserfane.
Beskrivelse
Valgfri kort tekst, der vises med punktet.
Ikonstørrelse
Ikonets størrelse i px.
Boks > Hjørneradius
Afrunder hjørnerne på punktets boks, 0 til 100 px.
Boks > Indvendig margen i boks
Afstanden inde i punktets boks, 0 til 100 px.
Boks > Position
Flytter punktet til venstre (negativ) eller højre (positiv), -100 til 100 px.
Farve
Tekst-, ikon-, ikonbaggrunds- og baggrundsfarver kun for dette punkt, hver med en farve ved hover. Ryd indstillinger går tilbage til bjælkens farver.
Badge
En lille etiket på punktet med Titel, Badgets tekstfarve og Badgets baggrundsfarve.
Synlighed
Skjuler punktet på nogle enheder eller for nogle kunder, eller viser det kun mellem to datoer. Se Visningsregler.
Avanceret
Ekstra klassenavn tilføjer en CSS-klasse til brugerdefineret CSS. Opdel tilføjer en skillelinje ved punktet.

Handlinger for punkter

Vælg link samler handlingerne i otte sektioner. Klik på infoikonet ved en handling for at se et eksempel.

1. Link til din butiks interne sider
Præcis kort URL /[your-url], Forside /, Alle produkter /collections/all, Produkter efter kollektion /collections/[collection-handle], Et produkt /products/[your-product-shorturl], Alle blogindlæg /blogs/news, Et blogindlæg /blogs/news/[your-blog-shorturl], En side /pages/[your-page-shorturl], Kurvside /cart, Søgeside /search, Kontaktformular /pages/contact.
2. Åbn paneler (kompatibel med populære temaer)
Åbn menuen (mobil) gm-open:MobileMenu, Åbn kurv gm-open:Cart, Åbn søgning gm-open:Search.
3. Åbn andre apps (f.eks. Shopify Inbox ...)
Åbn chatboks gm-open:Inbox åbner chatten i Shopify Inbox.
4. Rul på siden
Rul til toppen gm-scroll:Top, Rul til bunden gm-scroll:Bottom, Rul til et element på siden gm-scroll:OnPage(htmlElement).
5. Kald en JavaScript-funktion
gm-javascript:Function kører en JavaScript-funktion på dit website.
6. Supportværktøjer
Foretag et telefonopkald tel:, Send en SMS-besked sms:, Send en e-mail mailto:, Chat med Messenger, WhatsApp, Telegram, Line eller Zalo.
7. Del
Kopiér den aktuelle URL gm-share:CopyUrl, Del på Facebook gm-share:Facebook, Del på X (Twitter) gm-share:X.
8. Link til eksterne websites
Fuld URL (enhver fuld webadresse), Omdiriger ikke #.
Sektion 2 til 4: åbne paneler, andre apps og rulning.
Sektion 5 og 6: JavaScript og supportværktøjer.
Sektion 7 og 8: deling og eksterne links.

Eksempler:

  • gm-scroll:Top(150) – ruller til toppen med en margen på 150 px.
  • gm-scroll:OnPage(#page-title) – ruller til elementet med id’et page-title.
  • tel:+0123456789 – ringer til dette nummer.
  • sms:+012345678?body=I need help – åbner en SMS med teksten udfyldt.
  • https://wa.me/0123456789 – åbner en WhatsApp-chat. Brug landekoden uden +.

Style bjælken

Generelle indstillinger, herunder undermenuens position og åbningsstil.

Hovedmenu (niveau 1)

Afrundet menu
Bjælkens hjørneradius, 0 til 50 px.
Afstand mellem punkter
Afstanden mellem punkterne, 0 til 50 px.
Indvendig margen vandret · Indvendig margen lodret
Vandret og lodret afstand inde i hvert punkt, 0 til 100 px.
Brug skygge
Tilføjer en skygge omkring bjælken.

Undermenu (niveau 2, 3)

Undermenuens position
Venstre, Højre, Centreret eller Fuld bredde.
Undermenuens åbningsstil
Dropdown eller Udglidende panel.
Undermenuens bredde
100 til 900 px.
Indvendig margen vandret · Indvendig margen lodret
Vandret og lodret afstand inde i hvert undermenupunkt, 0 til 100 px.

Ikon og tekst

Ikonstørrelse · Størrelse på undermenuikon
Ikonstørrelser for bjælken og dens undermenuer, 0 til 100 px.
Afstand i hovedmenu: tekst – ikon · Afstand i undermenu: tekst – ikon
Afstanden mellem ikon og tekst, 0 til 50 px.

Avanceret

Skjul menutekst
Kun ikoner i bjælken.
Skjul undermenutekst
Kun ikoner i undermenuer.
Skjul undermenubeskrivelse
Skjuler punkternes beskrivelser i undermenuer.

Vælg, hvor bjælken vises

  1. Vælg enhederne

    Slå Visning på mobil (1), Visning på computer (2) eller begge til under Position.

    Slå bjælken til på mobil (1) og computer (2), og vælg derefter en position.
  2. Vælg en position

    Klik på et layout under hver kontakt:

    • Mobil – nederst, øverst, midt til venstre, midt til højre, nederst til venstre eller nederst til højre.
    • Computer – nederst i midten, nederst til venstre, nederst til højre, nederst i fuld bredde, midt til venstre eller midt til højre.
  3. Skjul ved rulning (valgfrit)

    Vælg Skjul ved rulning nedad, så bjælken ikke dækker indhold, mens kunden ruller ned.

Avancerede indstillinger

Tilgængelighed pr. marked
Viser kun bjælken på udvalgte markeder. Se Vis menuer pr. marked.
Menu z-indeks
Stablingsrækkefølgen. Hæv den, hvis andre elementer dækker bjælken; sænk den, hvis bjælken dækker pop op-vinduer.
Menuens uigennemsigtighed
Bjælkens gennemsigtighed, 0 til 100 %.
Bundmargen
Afstanden mellem bjælken og bunden af skærmen.
Typografiark / CSS
Brugerdefineret CSS til bjælken.
JavaScript
Brugerdefineret JavaScript til bjælken.

Visningsregler

Hvor Indstilling Effekt
Fanen Position Visning på mobil, Visning på computer Viser eller skjuler hele bjælken pr. enhed.
Fanen Avanceret Tilgængelighed pr. marked Viser kun hele bjælken på udvalgte markeder.
Punkt > Synlighed Skjul på computer, Skjul på mobil Skjuler ét punkt på en enhed.
Punkt > Synlighed Skjul, når kunden er logget ind, Vis kun, når kunden er logget ind Viser kun ét punkt til gæster eller kun til kunder, der er logget ind.
Punkt > Synlighed Planlæg udgivelse Viser kun ét punkt mellem Startdato og Slutdato.

Udgiv bjælken

  1. Udgiv

    Klik på Gem og derefter på Udgiv øverst til højre, vælg temaet, og bekræft. Dialogen virker som for en megamenu (se Udgiv en menu). Status skifter fra Kladde til Aktiv.

    Dialogen Udgiv menuen: (1) Vælg tema, (2) Forhåndsvisning og Udgiv
  2. Tjek din webshop

    Åbn din webshop på en telefon eller i et smalt browservindue.

Skift eller fjern den

  • Fjern den fra din webshop – klik på Deaktiver øverst i editoren.
  • Gendan en tidligere version – åbn fanen Versionshistorik. Se Versionshistorik.

Fejlfinding

Bjælken vises ikke i min webshop

Bjælken indlæses via appintegrationen ligesom alle menuer. Sørg for, at appintegrationen er slået til i det tema – se Aktivér appintegrationen.

En handling under Åbn paneler gør ingenting

Handlingerne under Åbn paneler åbner dit temas egen menuskuffe, kurvskuffe eller søgning, så de virker med populære temaer. Hvis der ikke sker noget i dit tema, så link til siden i stedet (f.eks. Kurvside /cart), eller kontakt os.

Bjælken overlapper en chatknap eller et cookiebanner

Hæv Bundmargen, eller skift Menu z-indeks under fanen Avanceret, eller vælg en anden position under fanen Position.

Var dette nyttigt?

Rapportér et problem