Bootstrap Icons not showing in published ASP.NET MVC application

Question

--- NB: Go to the EDITED 2 section for summary ----

I have an ASP.NT MVC (4) application. I integrated (twitter)Bootstrap to it. Bootstrap is working perfectly, but the

Answer 1

Anyone still looking for an alternate answer, this method suggested on another StackOverflow answer resolves the issue.

Change the Build action on the .eot, .ttf, & .woff files to "Content" instead of the default value of "None". Doing this solved my issue.

Answer 2

Note to readers: be sure to read @user2261073's comment and @Jeff's answer concerning a bug in the customizer. It's likely the cause of your problem.

---

The font file isn't being loaded correctly. Check if the files are in their expected location.

@font-face {
  font-family: 'Glyphicons Halflings';
  src: url('../fonts/glyphicons-halflings-regular.eot');
  src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons-halflingsregular') format('svg');
}

It might also be a mimetype issue. Chrome's dev tools show downloaded fonts in the network tab:

The bootstrap customizer seems to be sending different sized fonts than the ones that are inside the whole bootstrap package that comes with the examples. If you use customized bootstrap, try replacing font files..

Update

You get a status code 304 which represents "not modified static files that downloaded or in client cache." So its related to client cache and requires some peek into iis.

This will be helpful in solving your issue

Answer 3

Including the below line in RegisterBundles() of BundleConfig.cs file worked for me.

System.Web.Optimization.BundleTable.EnableOptimizations = false;

Answer 4

I had this problem also. The solution that I used is within this question: https://stackoverflow.com/questions/27254055/manually-added-directory-not-automatically-included-with-one-click-file-system-d

• unload the project
• edit the csproj file
• change None include to Content Include for the relevant Font files.

Use one-click deploy again and the files are published.

Answer 5

1. Make sure .woff extension is added correctly to IIS MIME Types of your website in order to get rid off possible 404 errors

2. Fix caching issues by removing the following web.config lines because Internet Explorer does not seem to like it:

   <add name="Cache-Control" value="no-cache, no-store" />
   <add name="Pragma" value="no-cache" />
   

Answer 6

The solution from igorludi should working fine.

And I think, we can tell the IIS to handles those "new" MIME TYPE by:

• Select the site;

• Go to IIS >> MIME Types;

• Adds those new extension and type (see the XML on igorludi answer).

• Restart the site.