ETS

Elegant Themes Sweden

Synliga sökvägar i forum – Du är här:ETS ForumDIVI: Tips & trixTips för en bättre mobilmeny med …
eller Registrera för att skapa inlägg och ämnen.

Tips för en bättre mobilmeny med Divi

Här är sex CSS-snippets för en lite snyggare mobilmeny i Divi. Välj någon, några eller alla snippets och klistra in dem i Divi > Tema-anpassare > Extra CSS (eller i en kodmodul direkt i header-layouten om du använder Theme Buildern). Knepen funkar både till den gamla Divi 3-menyn och till den nya Theme Builder-menyn. Koden är testad och validerad 2020-05-13

Hela artikeln med bilder och nedladdningsbar layout finns på Diviguiden.se i inlägget Sex tips för en bättre mobilmeny i Divi

CSS-kod:

/* Text bredvid hamburgaren Theme Builder */
.et_mobile_nav_menu:before  {
content: 'MENU';
position: absolute;
right: 33px;
}

/* Text bredvid hamburgaren Divi 3 */
#et_mobile_nav_menu:before  {
content: 'MENU';
position: absolute;
right: 33px;
bottom:30px;
}

/* X-ikon i öppen mobilmeny */
.mobile_nav.opened .mobile_menu_bar:before {
content: "\4d";
}

/* Ta bort linjen i mobilmenyn */
.et_mobile_menu {
border-top:0px;
}

/* Centrera menylänkar */

.et_mobile_menu li {
text-align:center !important;
}
  
.et_mobile_menu li li, .et_mobile_menu li ul {
padding-left:0px !important;
}

/* Fullbredd mobilmeny */
.et_mobile_menu {
min-width: 100vw;
margin-left: -10vw;
}

/* Full höjd mobilmeny */
.et_mobile_menu {
min-height:100vh;
padding-top:50px !important;
}

 

Uppladdade filer:
  • divi-meny-layout-ladda-ner.png