Ställ in rullgardinsmenyer i din online-butik
Du kan använda rullgardinsmenyer för att gruppera produkter, produktserier eller sidor och göra det enklare för kunderna att navigera i din webbshop. Om du till exempel har många produkter kanske du vill lägga till dem i serier och sedan använda en rullgardinsmeny från huvudmenyn för att organisera serierna. Detta kan hjälpa kunderna att hitta den typ av produkter som de letar efter.
Du kan även lägga till, ta bort eller redigera menyobjekt i rullgardinsmenyer eller i dina standardmenyer.
Du kan visa och ändra webbshopsmenyer i Innehåll > Menyer i Shopify-admin.
På den här sidan
- Inbäddade menyalternativ för att bygga rullgardinsmenyer
- Lägg till en rullgardinsmeny från huvudmenyn
- Integration av sidfotsmeny
- Överväganden för temakompatibilitet
- Fastställa om ditt tema stöder inbäddade rullgardinsmenyer
- Bästa praxis för rullgardinsmenyer
- Felsökning av vanliga problem
- Anpassa temakod för rullgardinsmenyer
Inbäddade menyalternativ för att bygga rullgardinsmenyer
Du kan bygga rullgardinsmenyer genom att skapa eller flytta menyobjekt så att de är inbäddade under ett toppnivåobjekt. Toppnivåobjektet visas i huvudmenyn i webbshoppen, och de inbäddade menyobjekten visas i en rullgardinsmeny. Toppnivåobjektet kan ha upp till två nivåer av inbäddade rullgardinsmenyer.
Alla teman kommer visa inbäddade objekt som rullgardinsmenyer från huvudmenyn och vissa teman kommer visa inbäddade objekt som rullgardinsmenyer på andra platser.
Huvudmenyn och rullgardinsmenyer visas på olika platser i din webbshop beroende på ditt tema. Vissa teman visar en ikon bredvid namnet på en rullgardinsmeny i huvudmenyn för att hjälpa kunderna att se att det finns en rullgardinsmeny.
Lägg till en rullgardinsmeny från huvudmenyn
Du kan lägga till en rullgardinsmeny från ett av menyalternativen i huvudmenyn.
Steg:
Dator
Gå till Innehåll > Menyer från Shopify-admin.
Klicka på namnet i din huvudmeny.
Välj ett av huvudmenyobjekten som rubrik för din rullgardinsmeny, eller lägg till ett nytt menyobjekt. Om du inte vill att rubriken ska länka till något anger du # i fältet Sök eller klistra in en länk för rubrikmenyobjektet.
Slutför följande uppgifter för att lägga till ett menyobjekt som ska inkluderas i rullgardinsmenyn:
- Klicka på Lägg till menyobjekt.
- Ange ett namn för menyobjektet i fältet Namn.
- Ange eller välj en destination för menyobjektet i fältet Sök eller klistra in en länk.
Klicka på Lägg till och sedan på
, och dra därefter menyobjektet för att bädda in det under rubrikmenyobjektet.
Klicka på Spara-menyn.
iPhone
Från Shopify-appen trycker du på
-knappen.
Tryck på Innehåll > Menyer.
Klicka på huvudmenyns namn.
Välj ett av huvudmenyobjekten som rubrik för rullgardinsmenyn, eller lägg till ett nytt menyobjekt som rubrik. Om du inte vill att rubriken ska länka till något anger du
#
i fältet Sök eller klistra in en länk för rubrikmenyobjektet.Slutför följande uppgifter för att lägga till ett menyobjekt som ska inkluderas i rullgardinsmenyn:
- Blippa på Lägg till menyobjekt.
- Ange ett namn för menyobjektet i fältet Namn.
- Ange eller välj en destination för menyobjektet i fältet Sök eller klistra in en länk.
Klicka på Lägg till och sedan på
, och dra därefter menyobjektet för att bädda in det under rubrikmenyobjektet.
Tryck på Spara.
Android
Från Shopify-appen trycker du på
-knappen.
Tryck på Innehåll > Menyer.
Klicka på huvudmenyns namn.
Välj ett av huvudmenyobjekten som rubrik för rullgardinsmenyn, eller lägg till ett nytt menyobjekt som rubrik. Om du inte vill att rubriken ska länka till något anger du
#
i fältet Sök eller klistra in en länk för rubrikmenyobjektet.Slutför följande uppgifter för att lägga till ett menyobjekt som ska inkluderas i rullgardinsmenyn:
- Blippa på Lägg till menyobjekt.
- Ange ett namn för menyobjektet i fältet Namn.
- Ange eller välj en destination för menyobjektet i fältet Sök eller klistra in en länk.
Klicka på Lägg till och sedan på
, och dra därefter menyobjektet för att bädda in det under rubrikmenyobjektet.
Tryck på ✓.
Integration av sidfotsmeny
Rullgardinsmenyer kan också implementeras i sidfotsmenyer.
Steg:
- Gå till Innehåll > Menyer från Shopify-admin.
- Valfritt: Följ samma inbäddningsprinciper som används för huvudmenyer, som att dra menyobjekt under ett sidhuvudobjekt för att skapa en rullgardinsmenystruktur genom att klicka på
och sedan dra objekten på plats.
- Ange # i fältet Länk för sidhuvudobjekt som inte ska länka till en sida (till exempel sidhuvudena "Support" eller "Utforska").
Överväganden för temakompatibilitet
Granska följande överväganden för att lägga till rullgardinsmenyer till ditt tema:
- De flesta teman stöder upp till två nivåer av inbäddade rullgardinsmenyer. Kontrollera ditt temas dokumentation eller testa inbäddade objekt för att bekräfta kompatibiliteten.
- Vissa teman kan kräva CSS-justeringar för att förbättra mobilanvändbarheten. Anpassa inte temat om du inte känner till temakoden. Mer information om hur du anpassar ditt tema.
Fastställa om ditt tema stöder inbäddade rullgardinsmenyer
För att fastställa om ditt nuvarande tema stöder det maximala antalet nivåer av inbäddade rullgardinsmenyer som du vill implementera, så kan du använda följande resurser:
Kontrollera ditt temas dokumentation: Granska temats dokumentation för specifik information om menyfunktioner och inbäddningsnivåer som stöds.
Testa de inbäddade objekten: Skapa en testmenystruktur med önskat antal inbäddade nivåer och verifiera att de visas korrekt på både datorer och mobila enheter.
De flesta teman stöder upp till två nivåer av inbäddade rullgardinsmenyer. Om du har problem med rullgardinsmenyer kontrollerar du att ditt tema stöder antalet inbäddade nivåer som du försöker implementera, eftersom vissa teman kan kräva ytterligare anpassning för att stödja flera nivåer av inbäddning.
Bästa praxis för rullgardinsmenyer
Gå igenom följande bästa praxis för att skapa en användbar menystruktur som fungerar bra, oavsett vilken enhet som används.
Använd beskrivande etiketter som "Handla efter kategori" för menyobjekt på översta nivå med #-länkar.
Se till att menyerna är optimerade för mobila enheter. Du kan testa menyerna på en mobil enhet för att bekräfta att rullgardinsmenyerna öppnar som förväntat.
Lägg till sju eller färre menyobjekt på översta nivå för att undvika att området överfylls.
Använd tydliga och beskrivande länktitlar. Till exempel "Produktserier" och "Sommarklänningar".
Felsökning av vanliga problem
Granska följande lösningar på vanliga problem du kan stöta på när du konfigurerar navigeringsmenyer:
Omdirigeringar av mobilmeny: Om en menylänk på översta nivån omdirigerar till en ny sida när du trycker på den, ska du kontrollera menyn i din Shopify-admin för att bekräfta att menylänkfältet är #.
Synlighetsproblem: Om inbäddade objekt inte visas ska du se till att de dras helt under sidhuvudobjektet och att de är indragna i gränssnittet för menyerna. Bekräfta att ditt tema stöder antalet inbäddade nivåer som du har ställt in.
Temakompatibilitet: Om du har problem med rullgardinsmenyer kontrollerar du att ditt tema stöder antalet inbäddade nivåer som du försöker implementera. Vissa teman kan kräva ytterligare anpassning för att stödja flera nivåer av inbäddning.
Anpassa temakod för rullgardinsmenyer
För teman som kräver mer avancerad anpassning kan du överväga att anpassa din temakod.