Dawn - Getting FontAwesome to work on main drop-down menus

28 0 6

I've used font awesome in the past to highlight specific dropdown menu items in the past with an icon etc, but for some reason i cannot make it work on Dawn. This is our first play with Dawn and I'm unsure why is didn't work like our pre Shopify 2.0 stores.


The font awesome is working fine in the footer menus but not in the second main menu "Shop by Hazard".


store url: workplaceneckwear.com.au

pw: Reserve1187


I'm trying to match the 'hazards' with the manufactures marketing collateral, so my plan B would be to change the background colour of each child on menu 2, does anyone know how i could code that into the Dawn Custom CSS box so it doesn't get lost each theme update?



Replies 2 (2)

Shopify Partner
770 89 353

Hello @TimAU ,


You can try to follow these steps:

Go to Online Store -> Theme -> Actions -> Edit Code

Go to Assets -> base.css -> add the following code

.site-nav__dropdown ul li {
    background-color: #your-color-code;

Save and preview.


Hope this can work for you. Let us know if you need anything else.



Ali Reviews team. 

- Was my answer helpful? Please hit Like or Mark it as solution!
- Ali Reviews - The must-have Shopify app that empowers you to effortlessly collect, display, and manage product reviews.
- Start your FREE trial today!
28 0 6

thanks @AliReviews  for that answer. it didn't seem to work when i added it to bas.css.


I also may not have been clear, i need to change the background colour of each child to a different colour, corresponding to the 'hazard' listed. i.e. 7 different colours, one per child option. and only on menu 2, not all menus.


I would also prefer to add this to the theme custom css box rather than editing the theme files, so i don't loose the changes when i upgrade to dawn 8.0.