How can I effectively use FontAwesome in the Dawn theme?

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.

I’m also keen to learn if there is a way to add fontawesome via the theme settings CUSTOM CSS box in theme editor so that i don’t have to manually redo the code when we update the theme.

I’m trying to use it in the second main menu “Shop by Hazard”. See screen shot below. I’ve also attached a screenshot from a shopify 1.0 site we have, where it worked out of the box!

Dawn 2.0

Shopify 1 - Turbo theme

any advice would be appreciated.

Hi @TimAU you can use this icon styling for increase loading speed and showing correct icons on your menu. Just copy and paste below CSS code in theme.liquid file above the tag.


That’s it! Now if you want to use snowflake or bolt sign then you can find for the icons here - Unicons icon library | Line | Monochrome | Solid | Thin Line (iconscout.com) just copy and paste code like this

your icons will show where you want.

Hi @saim007 , thanks for that option. Unfortunately it doesn’t seem to work in the main drop down menus on Dawn. Them menus still only show the text not the symbol.

@TimAU Can you please provide store URL so I can check.

https://workplaceneckwear.com.au/

password is Reserve1187

Can you provide the header section code?

It is showing perfectly. please see screenshot below

Thanks @saim007 , i also had to make some code changes as per @miguel_liquify recommendations and than that allowed it to render the Unicons and/or FontAwesome.

Thank you both for the assistance.

1 Like

No problem, Can you set the question as solved?