Shopify themes, liquid, logos, and UX
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
Thank you!
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
- Your
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>
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
- Your
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.
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
2m ago Learn the essential skills to navigate the Shopify admin with confidence. T...
By Shopify Feb 12, 2025Learn how to expand your operations internationally with Shopify Academy’s learning path...
By Shopify Feb 4, 2025Hey Community, happy February! Looking back to January, we kicked off the year with 8....
By JasonH Feb 3, 2025