Font Awesome and Azure

Topics: General, Nederlands (Dutch), Troubleshooting, Writing themes
Aug 8, 2013 at 4:17 PM
Hi all,

In my site I'm using the icons from Font Awesome. On my local machine this is rendered as should. When I build my project and upload it to my Azure VPS, it gives me 404 errors on the font files e.g. .woff, .ttf etc.

I tried a lot of solutions that are around like adding mime-types and all that stuff, but none of them seems to work.

Anyone who had this problem?

Thanks,
Daniel
Coordinator
Aug 8, 2013 at 7:28 PM
This may be due to the mime types for those not being configured in IIS. Not sure where that can be fixed in Azure, but it shouldn't be too hard to find. Your Google search will probably be easier if you omit orchard and go directly for woff azure 404.
Aug 8, 2013 at 8:11 PM
That is what I first tried and according to the articles you should add those font files to IIS. But after adding the mime types to the 3 different web.config files (still don't know which web.config I should pick) nothing happened.

Since it works on my local machine, it could also be something with permissions maybe?
Coordinator
Aug 8, 2013 at 8:21 PM
The config that you need to update may be higher up than the application's root. In that case you'd need that to be exposed in the Azure dashboard, I think.

You can determine if it's a permission issue by putting a file of a known to work type (e.g. css) in the same directory and see if it's served.
Aug 8, 2013 at 8:35 PM
How does that work with accessing files which live inside a Theme?
The stylesheet inside my custom theme refers to a subfolder which include the fonts, like this:

/Themes/MyTheme/Styles/Fonts
@font-face {
    font-family: 'Icons';
    src:url('fonts/Icons.eot');
    src:url('fonts/Icons.eot?#iefix') format('embedded-opentype'),
        url('fonts/Icons.woff') format('woff'),
        url('fonts/Icons.ttf') format('truetype'),
        url('fonts/Icons.svg#Icons') format('svg');
    font-weight: normal;
    font-style: normal;
}
Coordinator
Aug 8, 2013 at 8:38 PM
I'm sorry, I don't understand the question. Can you access that style sheet?
Aug 8, 2013 at 8:38 PM
Hi Daniel,

Do you mean the Azure Cloud Service? or the VM?

We also had this issue on a normal webserver, the solution is to add this to the web.config
    <staticContent>
      <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
    </staticContent>
You need to add this to the Orchard.Web project web.config (or Orchard.Azure.Web in case of a cloud service)

Test this locally and the project should break! this is because the mime map is already there. remove it before adding with this line:
 <remove fileExtension=".woff" />
Aug 8, 2013 at 8:43 PM
No it is an Azure VM.
I tried that solution also, but maybe in the wrong web.config.

Web.config - Root
Web.config - Themes/
Web.config - Themes/MyTheme
Web.config - Themes/MyTheme/Styles

I'll try it to be sure about this.

@Bertrand: I cannot access any .css files directly that are in the themes folder.
E.g. http://mydomain.com/Themes/MyTheme/Styles/main.css is not working. Although the styles are loaded...
Aug 8, 2013 at 9:05 PM
It's weir. Also static images are not accessible directly.
Not sure how to solve this.

The worker process runs in 32 bit mode. It is run by the ApplicationPoolIdentity. This account has read/write permissions to the Themes folder.
I can see that the font mime types are server by IIS by default.

The applicationHost.config actually allows the StaticContent sections inside the web.config files to be overridden.

Any other ideas?

Thanks,
Daniel
Coordinator
Aug 8, 2013 at 9:12 PM
OK, that explains it. You are missing a web.config in your Styles directory. Copy one from any Styles directory.
Aug 9, 2013 at 5:59 AM
No, there is a web.config inside my Styles directory. In fact, I tried to add web.config files in all the directories I mentioned in the previous post.
Aug 9, 2013 at 6:25 AM
I decided to do another fresh build of my local copy and stripped the combinator module from the installation, since this was giving troubles. Now it seems to run fine. I've no idea what is wrong. The web.config files are identical, so that wasn't the problem.

Anyway, thanks for the suggestions to all.
Coordinator
Aug 9, 2013 at 4:50 PM
Oh, combinator. You should contact @Piedone in case he has an idea.
Developer
Aug 11, 2013 at 1:09 PM
I can hardly understand the full issue. Relative paths in url() declarations should be properly adjusted by Combinator BTW.