Can't figure out how to change Icons in Renew Bands Menu items

[PhilipEllis]

I started with the Renew bands site from design cloud, but I can’t figure out how to change the icons that show up in the menu.

I want the briefcase, so this is what I think I should have:

<i class="x-icon-briefcase" data-x-icon=""></i> Portfolio

but the gears icon still displays.

I’ve looked at a few posts here but couldn’t get any of them to work for me.

[ruenel]

Hello Philip,

Thanks for writing in!

Please make use of this code:
<i class="x-icon-briefcase" data-x-icon-s="&#xf0b1;"></i>

We would love to know if this has worked for you. Thank you.

[PhilipEllis]

It did work, but can you explain why it worked - where did you get that icon code from?

[ruenel]

Hey Philip,

See release notes here: Release Notes - Pro 2.2, X 6.2, Cornerstone 3.2

As of Font Awesome version 5, they split icons into multiple fonts. This can be fixed by changing instances of the data-x-icon attribute to one of the following:

• data-x-icon-b for social icons.
• data-x-icon-o for outline icons.
• data-x-icon-s for solid icons.

The original attribute data-x-icon will still work for solid icons as a fallback but we’ve updated everything for consistency.

And to get the icon value, you can find all the icons here: https://fontawesome.com/cheatsheet. You will need to insert &#x and then followed by the “Unicode” which is why I have suggested the code for the briefcase icon as:
<i class="x-icon-briefcase" data-x-icon-s="&#xf0b1;"></i>

Hope this explains it briefly.