How can I add icons to my navigation menu items?

[Katerina_Red]

Hi!

I would like to add an icon before each menu item. Not in the dropdown, just the main categories of navigation.

My theme is Sense version 13.0.1

https://naturalhellenia.com/

Thank you!

[sahilsharma9515]

Hi @Katerina_Red if your theme doesn't have this option by default then this can only be achieved with the help of custom coding. I can provide you the base code through which you can achieve this, but you need to update the code according to your theme code files.

<ul class="main-menu">
  <li class="menu-item">
    <i class="menu-icon fas fa-home"></i>
    <a href="/">Home</a>
  </li>
  <li class="menu-item">
    <i class="menu-icon fas fa-user"></i>
    <a href="/account">Account</a>
  </li>
  <!-- Add more menu items with icons as needed -->
</ul>

.menu-icon {
  margin-right: 5px; /* Adjust spacing between icon and text */
}

/* Example using Font Awesome */
.menu-icon::before {
  font-family: 'Font Awesome 5 Free';
  content: '\f015'; /* Unicode for the home icon */
  /* Adjust size, color, etc. */
}

If you will unable to implement the same then I'm happy to do this for you, let me know. I can implement the changes so that this will work well for you.

Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

Best Regards

Sahil

[Katerina_Red]

Hi!

I'm not sure where to edit the code

<ul class="main-menu">
  <li class="menu-item">
    <i class="menu-icon fas fa-home"></i>
    <a href="/">Home</a>
  </li>
  <li class="menu-item">
    <i class="menu-icon fas fa-user"></i>
    <a href="/account">Account</a>
  </li>
  <!-- Add more menu items with icons as needed -->
</ul>

[sahilsharma9515]

Hi @Katerina_Red As mentioned earlier, this is just a base code to accomplish the task that you have mentioned, you need to look into your theme code files, and update the base code according to your theme, you may find the code in header.liquid file.

If you will unable to implement the same then I'm happy to do this for you, let me know. I can implement the changes so that this will work well for you.

Hopefully it will help you. If yes then Please don't forget hit Like and Mark it as solution!

Best Regards

Sahil

[Abhishek05Pande]

bro i also wanted to add icons in front of my subcategories so if possible than can you please help me.

here are the screenshot.

[Abhishek05Pande]

i want exactly like 

if anyone can help then please help me 

here is my website

https://redhat45.myshopify.com/?_ab=0&_fd=0&_sc=1

password: leampe