Gå til innholdet
GloboGlobo Docs
Installer appen
Norsk (bokmål)

Nedre navigasjonslinje på mobil

Legg til en fast, applignende linje med ikoner, hurtiglenker og handlinger for kundene dine.

Veiledning Pro Navigation 8 min lesing

Linjen blir værende på skjermen mens kundene ruller, som fanelinjen i en mobilapp, og gir tilgang med ett trykk til forsiden, menyen, handlekurven, søk, chat eller en telefonsamtale. Et element kan også åpne en liten undermeny, for eksempel et Mer-element med lenker til konto, kontakt og vanlige spørsmål.

Redigeringsverktøyet for bunnlinjen: innstillingsfaner (1) og forhåndsvisning (2). Bytt enhet i forhåndsvisningen med knappene nederst til venstre i forhåndsvisningen.

Innstillingsfanene er Menyelementer, Generelt, Typografi, Farger, Posisjon, Avansert og Versjonshistorikk.

Lag en bunnlinje

  1. Lag linjen

    På Hjem-siden i appen klikker du på Legg til bunnnavigasjon – eller i Menybehandling klikker du på Opprett meny og velger Mobil bunnlinje.

    Hjem: (1) hurtighandlinger for å opprette eller importere en meny, (2) knappen som aktiverer appinnbyggingen

  2. Sett opp elementene

    I Menyelementer redigerer du standardelementene og legger til dine egne. Se Legg til og rediger elementer.

    Redigeringsverktøyet for bunnlinjen: innstillingsfaner (1) og forhåndsvisning (2). Bytt enhet i forhåndsvisningen med knappene nederst til venstre i forhåndsvisningen.

  3. Style linjen

    Juster fanene Generelt, Typografi og Farger. Se Style linjen.

    Generelle innstillinger, inkludert undermenyens posisjon og åpningsstil.

  4. Velg hvor den vises

    I Posisjon velger du enhetene og plasseringen på skjermen. Se Velg hvor linjen vises.

    Slå på linjen for mobil (1) og datamaskin (2), og velg deretter en posisjon.

  5. Lagre og publiser

    Klikk på Lagre og deretter Publiser øverst til høyre. Se Publiser linjen.

Legg til og rediger elementer

  1. Vis elementhandlingene

    I Menyelementer holder du musepekeren over et element for å vise Rediger, Dupliser og Slett. Dra et element i håndtaket for å endre rekkefølgen.

    Hold musepekeren over et element for å redigere, duplisere eller slette det.

  2. Legg til elementer og undermenyer

    Klikk på Legg til element for å legge til et element på det nivået, eller Legg til undermeny på et element for å neste elementer under det. Nestede elementer åpnes som en undermeny, opptil tre nivåer.

  3. Angi ikon, tittel og lenke

    Klikk på Rediger for å åpne Rediger menyelement. Velg et Ikon (klikk på Endre), skriv inn en Tittel, og klikk deretter på feltet Lenke.

    Klikk på feltet Lenke for å velge handlingen for elementet.

  4. Velg en handling

    I Velg lenke klikker du på Velg ved siden av en handling (1). Boksen Lenke (2) får starten på lenken, for eksempel /collections/ for Produkter etter samling. Fullfør den slik det vises i kolonnen Syntaks, for eksempel /collections/summer-sale, og klikk på Oppdater (3).

    Klikk på Velg (1), fullfør lenken (2), og klikk deretter på Oppdater (3).

Elementinnstillinger

Ikon
Klikk på Endre for å velge et ikon eller laste opp et bilde.
Tittel
Teksten under ikonet.
Lenke
Hva som skjer ved trykk. Klikk på feltet for å åpne Velg lenke (se Elementhandlinger).
Åpne i ny fane
Åpner lenken i en ny fane i nettleseren.
Beskrivelse
Valgfri kort tekst som vises sammen med elementet.
Ikonstørrelse
Ikonets størrelse i px.
Boks > Hjørneradius
Runder hjørnene på elementboksen, 0 til 100 px.
Boks > Innvendig marg i boks
Avstand inne i elementboksen, 0 til 100 px.
Boks > Posisjon
Flytter elementet til venstre (negativ verdi) eller høyre (positiv verdi), -100 til 100 px.
Farge
Farger for tekst, ikon, ikonbakgrunn og bakgrunn for bare dette elementet, hver med en hover-farge. Tøm innstillinger går tilbake til linjens farger.
Merke
En liten etikett på elementet, med Tittel, Merkets tekstfarge og Merkets bakgrunnsfarge.
Synlighet
Skjuler elementet på enkelte enheter eller for enkelte kunder, eller viser det bare mellom to datoer. Se Visningsregler.
Avansert
Ekstra klassenavn legger til en CSS-klasse for egendefinert CSS. Divide (delelinje) legger til en skillelinje ved siden av elementet.

Elementhandlinger

Velg lenke deler handlingene inn i åtte deler. Klikk på infoikonet ved siden av en handling for å se et eksempel.

1. Lenke til butikkens interne sider
Nøyaktig kort URL /[your-url], Forside /, Alle produkter /collections/all, Produkter etter samling /collections/[collection-handle], Produktdetaljer /products/[your-product-shorturl], Alle blogginnlegg /blogs/news, Detaljer for et blogginnlegg /blogs/news/[your-blog-shorturl], Detaljer for en side /pages/[your-page-shorturl], Handlekurvside /cart, Søkeside /search, Kontaktskjema /pages/contact.
2. Åpne paneler (kompatible med populære temaer)
Åpne menyen (mobil) gm-open:MobileMenu, Åpne handlekurven gm-open:Cart, Åpne søk gm-open:Search.
3. Åpne andre apper (f.eks. Shopify Inbox ...)
Åpne chatboks gm-open:Inbox åpner chatten i Shopify Inbox.
4. Rull på siden
Rull til toppen gm-scroll:Top, Rull til bunnen gm-scroll:Bottom, Rull til et element på siden gm-scroll:OnPage(htmlElement).
5. Kall en JavaScript-funksjon
gm-javascript:Function kjører en JavaScript-funksjon på nettstedet ditt.
6. Støtteverktøy
Ring tel:, Send en SMS sms:, Send en e-post mailto:, Chat med Messenger, WhatsApp, Telegram, Line eller Zalo.
7. Del
Kopier gjeldende URL gm-share:CopyUrl, Del på Facebook gm-share:Facebook, Del på X (Twitter) gm-share:X.
8. Lenke til eksterne nettsteder
Full URL (en hvilken som helst fullstendig nettadresse), Ikke omdiriger #.
Del 2 til 4: åpne paneler, andre apper og rulling.
Del 5 og 6: JavaScript og støtteverktøy.
Del 7 og 8: deling og eksterne lenker.

Eksempler:

  • gm-scroll:Top(150) – ruller til toppen og lar det være en marg på 150 px.
  • gm-scroll:OnPage(#page-title) – ruller til elementet med ID-en page-title.
  • tel:+0123456789 – ringer dette nummeret.
  • sms:+012345678?body=I need help – åpner en SMS med teksten ferdig utfylt.
  • https://wa.me/0123456789 – åpner en WhatsApp-chat. Bruk landskoden, uten +.

Style linjen

Generelle innstillinger, inkludert undermenyens posisjon og åpningsstil.

Hovedmeny (nivå 1)

Meny avrundet
Hjørneradius for linjen, 0 til 50 px.
Elementavstand
Avstand mellom elementene, 0 til 50 px.
Innvendig marg vannrett · Innvendig marg loddrett
Vannrett og loddrett avstand inne i hvert element, 0 til 100 px.
Bruk boksskygge
Legger til en skygge rundt linjen.

Undermeny (nivå 2, 3)

Undermenyens posisjon
Venstre, Høyre, Midten eller Full bredde.
Undermenyens åpningsstil
Nedtrekksmeny eller Skyv ut.
Undermenybredde
100 til 900 px.
Innvendig marg vannrett · Innvendig marg loddrett
Vannrett og loddrett avstand inne i hvert undermenyelement, 0 til 100 px.

Ikon og tekst

Ikonstørrelse · Størrelse på undermenyikon
Ikonstørrelser for linjen og undermenyene, 0 til 100 px.
Avstand i hovedmeny: tekst – ikon · Avstand i undermeny: tekst – ikon
Avstand mellom ikon og tekst, 0 til 50 px.

Avansert

Skjul menytekst
Bare ikoner i linjen.
Skjul undermenytekst
Bare ikoner i undermenyene.
Skjul undermenybeskrivelse
Skjuler elementbeskrivelser i undermenyene.

Velg hvor linjen vises

  1. Velg enhetene

    I Posisjon slår du på Visning på mobil (1), Vis på datamaskin (2) eller begge.

    Slå på linjen for mobil (1) og datamaskin (2), og velg deretter en posisjon.

  2. Velg en posisjon

    Klikk på et oppsett under hver bryter:

    • Mobil – Bunn, Topp, Midt til venstre, Midt til høyre, Nede til venstre eller Nede til høyre.
    • Datamaskin – Nede i midten, Nede til venstre, Nede til høyre, Bunn i full bredde, Midt til venstre eller Midt til høyre.

  3. Skjul ved rulling (valgfritt)

    Velg Skjul når du ruller ned, slik at linjen ikke dekker innhold mens kunden ruller nedover.

Avanserte innstillinger

Tilgjengelighet per marked
Viser linjen bare i valgte markeder. Se Vis menyer per marked.
Meny z-indeks
Stablingsrekkefølge. Øk den hvis andre elementer dekker linjen. Senk den hvis linjen dekker popup-vinduer.
Menyopasitet
Linjens gjennomsiktighet, 0 til 100 %.
Bunnmargin
Avstand mellom linjen og bunnen av skjermen.
Stilark / CSS
Egendefinert CSS for linjen.
JavaScript
Egendefinert JavaScript for linjen.

Visningsregler

Hvor Innstilling Effekt
Fanen Posisjon Visning på mobil, Vis på datamaskin Viser eller skjuler hele linjen per enhet.
Fanen Avansert Tilgjengelighet per marked Viser hele linjen bare i valgte markeder.
Element > Synlighet Skjul på datamaskin, Skjul på mobil Skjuler ett element på en enhet.
Element > Synlighet Skjul når du er pålogget, Vises kun når du er pålogget Viser ett element bare til gjester, eller bare til innloggede kunder.
Element > Synlighet Planlegg publisering Viser ett element bare mellom Startdato og Sluttdato.

Publiser linjen

  1. Publiser

    Klikk på Lagre og deretter Publiser øverst til høyre, velg temaet og bekreft. Dialogen fungerer som for en megameny (se Publiser en meny). Statusen endres fra Utkast til Aktiv.

    Dialogen Publiser meny: (1) Velg tema, (2) Forhåndsvisning og Publiser

  2. Sjekk butikken

    Åpne butikken på en telefon eller i et smalt nettleservindu.

Endre eller fjern den

  • Fjern den fra butikken – klikk på Deaktiver øverst i redigeringsverktøyet.
  • Gjenopprett en tidligere versjon – åpne fanen Versjonshistorikk. Se Versjonshistorikk.

Feilsøking

Linjen vises ikke i butikken

Linjen lastes inn via appinnbyggingen, som alle menyer. Sørg for at appinnbyggingen er slått på for det temaet – se Aktiver appinnbyggingen.

En handling under Åpne paneler gjør ingenting

Handlingene under Åpne paneler åpner temaets egen menyskuff, handlekurvskuff eller søk, så de fungerer med populære temaer. Hvis ingenting skjer i ditt tema, lenker du til siden i stedet (for eksempel Handlekurvside /cart), eller kontakter oss.

Linjen overlapper en chatknapp eller et banner for informasjonskapsler

Øk Bunnmargin eller endre Meny z-indeks i fanen Avansert, eller velg en annen posisjon i fanen Posisjon.

Var dette nyttig?

Rapporter et problem