Azure site - icons missing

Nat Tam asked on March 4, 2015 18:29

I just followed the Kentico documentation to deploy a vanilla instance of Kentico to Azure cloud service.

Everything seems to work, except the icon font appears to be missing. Can anyone explain this?

See screenshot here

Correct Answer

Nat Tam answered on March 9, 2015 10:35

Thanks again for your answer Brian. I tried what you suggested with no joy. I then decided to search my entire VS solution for reference to "81" and there I found the service configuration was defining the "CMSUrlPort" setting as "81". So that was the problem. I've no idea where this setting came from - I'm certain I didn't change it. But changing to "80" fixed the problem.

Infuriating that it was something so small! Thanks everyone for your help and suggestions.

0 votesVote for this answer Unmark Correct answer

Recent Answers


Charles Matvchuk answered on March 4, 2015 18:39

Check Folder Permissions, I ran into this before with azure, some of the permissions where messed up.

0 votesVote for this answer Mark as a Correct answer

Brian McKeiver answered on March 5, 2015 05:05

I've had that issue in the past and it turns out that it has to do with the MIME type of .woff in Azure not being mapped by default. This was not specific to Kentico, it was more an Azure thing. Try adding this to your web.config:

<configuration>
    <system.webServer>
        <staticContent>
            <mimeMap fileExtension="woff" mimeType="application/font-woff" />
        </staticContent>
    </system.webServer>
</configuration> 
1 votesVote for this answer Mark as a Correct answer

Nat Tam answered on March 5, 2015 15:58

Thanks guys. However...

@Charles - The app pool is running with Network Service identity and this has read permission on the whole web directory including \App_Themes\Default\Fonts which I assume is the directory in question. So this looks OK to me.

@Brian - The web.config already contained the following lines in configuration/system.webServer/staticContent:

<remove fileExtension=".woff" />
<mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />

I tried changing the mimeType to application/font-woff and application/font-woff,application/x-font-woff but neither made a difference. Any other ideas?

Thanks.

0 votesVote for this answer Mark as a Correct answer

Bryan Soltis answered on March 5, 2015 17:31

Hi Tom,

A few years ago when I was at Bit-Wizards I had a similar issue when I deployed to Azure. It turns out the issue was the cmsfiles folder. You can check out my old blog article here (note the images may not load but you should get the idea).

http://bitwizards.com/blog/september-2013/kentico-cms-missing-web-part-icons?feed=author-rss

"The solution was actually quite simple. Connect to Azure storage and copy the cmsroot/cmsfiles from the Windows Azure Storage Account to the local machine"

What this means is you may have to reverse the process andensure your local cmsfiles folder is copied up to you Azure storage account.

  • Bryan
0 votesVote for this answer Mark as a Correct answer

Nat Tam answered on March 6, 2015 18:37 (last edited on March 6, 2015 18:44)

Thanks Bryan, I'm not sure we're talking about the same thing though.

Icons are displaying fine when running locally in Azure emulator, but publishing to Azure cloud service I don't see any icons. See screen shot below.

I've looked a bit deeper into this. If I examine the CMS Desk source code I can access the bootstrap.css file and see that it's referencing the icon fonts using an absolute URL which is correct except that it's added port 81 like this:

http://[unique-id].cloudapp.net:81/App_Themes/Default/Fonts/Core-icons.eot

If I browse to this URL it's not available as expected. If I remove the :81 then it downloads the font file.

Note that on the server the bootstrap.css references icons as url('../Default/Fonts/Core-icons.woff') so presumably this absolute URL is being added by /CMSPages/GetResource.ashx since the HTML references the stylesheet as /CMSPages/GetResource.ashx?stylesheetfile=/App_Themes/Default/bootstrap.css

Any ideas?

Image Text

0 votesVote for this answer Mark as a Correct answer

Brian McKeiver answered on March 9, 2015 03:01

Default Kentico never jams in a port 81. So this is what might be going on. Sometimes when you first browse to a Kentico site it will take whatever absolute url you are first visiting at and use that in the full domain for the CSS sheet. Do you happen to have more than 1 binding (one that maybe includes port 81) for that site ? If so make sure the very first hit of the site that warms it up, after clearing cache and restarting the application) is at the real URL (without port 81).

0 votesVote for this answer Mark as a Correct answer

   Please, sign in to be able to submit a new answer.