I'm new to the drupal community, so I'm sorry if I make any mistakes in posting this question. I want to change the menu-item icons for the Mobile sliding menu module. I realize that my question is similar to this one, but I believe I'm having a slightly different issue. The original post was having issues with having any icons showing up.. my icons showed up right away, but it's the same icomoon icon over and over again (icon-list2). The icons are defined in the css, but I can't figure out how to actually apply the class itself to the mmenu module.

I have set up the icomoon library and changed the CSS file according to the documentation. I have not changed the original mmenu module, I have only changed aesthetics.

Each menu link has a inside. If I change this class through the inspector, the icon changes as expected (for example, .icon-office), however, I can't seem to find an easy way to change it through drupal (see image below).

enter image description here

I can change the class name using the inspector tool in order to change the the icon. My question is how to change the different in the code or module (see below)

enter image description here

The only part of the mmenu module that I can find that refers to the "icon-list2" class is in the mmenu.module file in drupal>sites>all>modules>mmenu (see image below)

I'm not sure if there is something I need to modify in the mmenu.module, but I have a hard time seeing what I should change and I've always thought that it is bad practice to hack the main module.

Thank you so much in advanced.

  • 1
    Possible duplicate of How do I change icons in the "Mobile sliding menu" module? – leymannx Jan 2 at 23:03
  • Hey hey, I guess you need to specify what exactly makes your question different and what exactly in the accepted answer doesn't work for you. – leymannx Jan 2 at 23:27
  • Thanks for the response! The original post was having issues with having any icons showing up.. my icons showed up right away, but it's the same icon over and over again (maybe there's a different underlying issue here?). Other than that difference, maybe the issue is similar.. I've tried to follow, and I cannot figure out where his code needs to be added, but I imagine that we'd have to at least change something in the code that I screenshot to allow for that to work. Should I move this to the other question? – Betsy Jan 3 at 13:30
  • It seems you can do it by adding a class to your menu items, then add CSS to your theme that styles each item with a different icon: drupal.org/project/mmenu/issues/2829227#comment-12768729 – prkos Jan 3 at 23:56
  • Thank you! After reading through that question, I realized I already an a unique class to call to for each of the menu items. I called by saying something like ".mmenu-mm-list-mlid-818 i.icon-list2:before { content: "\e9b3"; }" and that seemed to work! – Betsy Jan 4 at 20:18

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service, privacy policy and cookie policy

Browse other questions tagged or ask your own question.