How to get fontawesome to work on an Azure web pages deployment?

Question

We are using Twitter Bootstrap and FontAwesome for icon support.

When deploying to one of our IIS servers I need to add MIME support.

When deploying to Azure, it

Answer 1

Just add the following to the web.config ...

<system.webServer>    
   <staticContent>
       <remove fileExtension=".svg" />
       <remove fileExtension=".eot" />
       <remove fileExtension=".woff" />
       <mimeMap fileExtension=".svg" mimeType="image/svg+xml"  />
       <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
       <mimeMap fileExtension=".woff" mimeType="application/x-woff" />
    </staticContent>
</system.webServer>

Answer 2

UPDATE

This answer is now unnecessary due to recent changes in the FontAwesome nuget package.

---

In addition to the solution described in the accepted answer, I noticed that the fonts in my project were in ~/Content/fonts, but the site was looking for the fonts in /fonts on Azure.

As a workaround, I copied the font files to ~/fonts (making sure the Build Action was set to Content for all) and all is good in the cloud.

Answer 3

After doing the above, and if it still doesn't work, check the file for the font-awesome.css in your theme folder's css folder.

There is a URL linking the font-awesome files. Make sure it points to the folder with the font files from your new domain pointing to your Azure site, i.e enter the full URL instead of ../font/...