How to solve font icons missing issue when host the sample in IIS?

This KB illustrates that how to solve font icons missing issue when host the sample in IIS.

Solution:

You can solve the missing font icons issue through the MIME Types and Request Filtering options available in Internet Information Services (IIS) Manager.

Steps to add font icon file types in MIME types:

1. Open IIS and select your website.
2. You can see MIME Types on right-hand side section.

3. Double click the icon MIME Types and a window will appear.
4. Then click "Add" available in right-hand side section.
5. A dialog will open which asks File Name extension and MIME Types.

6. Add the file information where the font icons are available.
7. For example,

If you do not have access to the IIS Manager, you can add these declarations in your web.config file, inside <system.webServer> section.

web.config:

 
    <system.webServer>
      <staticContent>
        <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
        <mimeMap fileExtension=".ttf" mimeType="application/octet-stream" />
        <mimeMap fileExtension=".svg" mimeType="image/svg+xml" />
        <mimeMap fileExtension=".woff" mimeType="application/font-woff" />
        <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
      </staticContent>
    </system.webServer>

If you are still facing any problems and if IIS is still is not serving the files, then try removing the MIME type declaration and re-declare it. See the example below for the .woff MIME type.

web.config:

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

STEPS TO ADD FONT ICON FILE TYPES IN REQUEST FILTERING:

1. Open IIS and points your website.
2. You can see Request Filtering on right-hand side section.

3. Double click the icon and a window will appear.
4. Then click “Allow File Name Extension” available on the right-hand side.
5. A dialog will open where you can add the file extension.

If you do not have access to the IIS Manager, you can add these declarations in your web.config file, inside <system.webServer> section.

web.config:

 
<system.webServer>
    <security>
      <requestFiltering>
        <fileExtensions>
          <add fileExtension=".woff" allowed="true" />
          <add fileExtension=".ttf" allowed="true" />
          <add fileExtension=".woff2" allowed="true" />
        </fileExtensions>
      </requestFiltering>
    </security
</system.webServer>
 

Conclusion

I hope you enjoyed learning about how to solve the font icons missing issue when hosting the sample in IIS.

You can refer to our JavaScript Pivot Client feature tour page to know about its other groundbreaking feature representations and documentation, and how to quickly get started for configuration specifications. You can also explore our JavaScript Pivot Client example to understand how to create and manipulate data.

For current customers, you can check out our components from the License and Downloads page. If you are new to Syncfusion, you can try our 30-day free trial to check out our other controls.

If you have any queries or require clarifications, please let us know in the comments section below. You can also contact us through our support forums, Direct-Trac, or feedback portal. We are always happy to assist you!