Fontawesome Does Not Work When Served by Iis

Fontawesome does not work when served by IIS

SquishIt bundling tool for MVC3 was url-encoding the font paths, so ../fonts/fontawesome-webfont.eot? in css file was changed to ../fonts/fontawesome-webfont.eot%3F. This normally returns 400, because %3F is considered unsafe. If you set requestPathInvalidCharacters="" then %3F is considered safe, but there is obviously no file ``../fonts/fontawesome-webfont.eot%3F`, therefore 404.

I removed fontawesome.css from the bundle and everything works fine.

Font Awesome icons not working when served from file system or IIS

So the previous SASS import ordering turned out to not fix my issue.

I finally stumbled upon this issue in the SASS repo: https://github.com/sass/sass/issues/1395.

Reading through the issue comments, it seems that when SASS does the compression it's change the Font Awesome characters from an escaped ASCII sequence to unicode. So we need to be explicit so that the browser knows how to interpret it.

In the end, what fixed this for me (hopefully for sure this time) was to add

<meta charset="utf-8" />

to my head.

Fingers crossed that this is finally fixed.

FontAwesome error in IIS

I had to change the bundling as follows:

public static void RegisterBundles(BundleCollection bundles)
{
  StyleBundle sharedStyleBundle = 
    new StyleBundle("~/Content/Template/font-awesome-4.1.0/css/bundle");
  sharedStyleBundle
    .Include("~/Content/Template/font-awesome-4.1.0/css/font-awesome.css");
  bundles.Add(sharedStyleBundle);
  ...
}

It seems to be important, that the key for the bundle has the same structure as the bundle path itself.

ASP.NET MVC font-awesome works on localhost but not on the web (IIS)

According to your description, the fonts are displayed correctly locally, but when loaded on the server, only blank squares are displayed. The possible reason is the filename mentioned in the src attribute of the FontAwesome CSS file is not the same as the actual font filename.

For more details you can refer to this link.

Why font-awesome works on localhost but not on web ?

I've just loaded your webpage and checked the net tab of firebug.

your following urls returned a 404:

http://www.senocakonline.com/Content/font/fontawesome-webfont.woff

http://www.senocakonline.com/Content/font/fontawesome-webfont.ttf

i would assume that those being missing is the reason your icons aren't displaying.

UPDATE: 23.10.2015
to make it available just add this code to your WebConfig:

<system.webServer>
    <staticContent>
      <mimeMap fileExtension="woff" mimeType="application/font-woff" />
      <mimeMap fileExtension="woff2" mimeType="application/font-woff" />
    </staticContent>
</system.webServer>

Font awesome working in local but not on site

This is a problem with the MIME types being reported by your server for the fonts. You need to ensure that Apache / IIS / whatever reports the correct filetype for the font files to be used in your browser. FontAwesome list what the server MIME type headers should be here.

However, as you say you can not alter the configuration, I suggest using a CDN for displaying the icons.

For example, the Getting Started page suggests using Bootstrap CDN. Change the reference in your <head> element to:

<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">

And the icons will show up.

IIS 7 and font awesome .woff 404 error

After doing more research, the reason it was not loading properly was because of Bundling. In have the following in my files:

In my BundleConfig.cs:

bundles.Add(new StyleBundle("~/font-awesome/css").Include("~/fonts/font-awesome/css/font-awesome.min.css", new CssRewriteUrlTransform()));

In my _Layout.cshtml file:

@Styles.Render("~/font-awesome/css")

I removed the two pieces of code above and added font awesome file directly the _Layout.cshtml file:

<link href="~/fonts/font-awesome/css/font-awesome.min.css" rel="stylesheet" />

Fontawesome Does Not Work When Served by Iis