Layout FAQ

Can I use HTML5 and CSS3 related files like .svg, .woff and .ogg?

I would like to serve SVG, web fonts and similar on my Composite C1 website, but when I add the files to a folder on the website (not the Media Archive in Composite C1, but as files on the website) things are not working as expected. The files are not served with the correct mime-type.

Answer:

The web server (Internet Information Server, IIS) is responsible for serving static files and the files you wish to serve is most likely not known by the version of IIS you are using. You can remedy this be registering the extensions and related mime-types.

If you are the older running IIS 6 you need to configure mime-types on the server, see Configuring mime-types on IIS 6.

If you are running IIS 7 or later, locate the web.config file in the website root and update/insert the block of XML shown below. The block below contains the settings for the most common html5/css3 mime-types - you may need to modify this to your specific needs.

<configuration>
...
  <system.webServer>
...

    <!-- START OF BLOCK TO INSERT -->
    <staticContent>
      <mimeMap fileExtension=".mp4" mimeType="video/mp4" />
      <mimeMap fileExtension=".m4v" mimeType="video/m4v" />
      <mimeMap fileExtension=".ogg" mimeType="video/ogg" />
      <mimeMap fileExtension=".ogv" mimeType="video/ogg" />
      <mimeMap fileExtension=".oga" mimeType="audio/ogg" />
      <mimeMap fileExtension=".spx" mimeType="audio/ogg" />
      <mimeMap fileExtension=".svg" mimeType="images/svg+xml" />
      <mimeMap fileExtension=".svgz" mimeType="images/svg+xml" />
      <remove fileExtension=".eot" />
      <mimeMap fileExtension=".eot" mimeType="application/vnd.ms-fontobject" />
      <mimeMap fileExtension=".otf" mimeType="font/otf" />
      <mimeMap fileExtension=".woff" mimeType="font/x-woff" />
      <mimeMap fileExtension=".appcache" mimeType="text/cache-manifest" />  
    </staticContent>
    <!-- END OF BLOCK TO INSERT -->
    
  ...
  </system.webServer>
...
</configuration>
Download the source