- This topic is empty.
-
AuthorPosts
-
February 25, 2013 at 8:00 am #42956JohnAspMember
I’ve been creating HTML font icons on my new site following Chris’s technique in this article
[https://css-tricks.com/html-for-icon-font-usage/](https://css-tricks.com/html-for-icon-font-usage/ “HTML for icon usage”)All this works fine is looking just how I want it to look when working on my Dev server on my PC,
(http://seasiderspodcast.co.uk/spv2/images/icons.jpg “see screenshot here”)However, when I FTP it onto my live server the font all look totally different and seem to take a while to load after the page has loaded – anyone any idea of what’s going on here?
[http://seasiderspodcast.co.uk/spv2/](http://seasiderspodcast.co.uk/spv2/ “All font icons are different on live?”)
I have put the entire site from local to live so all the files are on live so I don’t understand this. I’ve also cleared my browser cache in case.
February 25, 2013 at 8:11 am #125921Paulie_DMemberLooks to me as though it’s not loading the font “Spodv2”.
It doesn’t seem to be in your font folder.
EDIT: I can see them throwing an error in resource view of Inspector
February 25, 2013 at 9:11 am #125941JohnAspMemberThey are defo on the server, I’m looking at my FTP listing now.
It does however appear to be a problem with the font files, like you say. I checked out the resources view on local server and I see the font file named spodv2.woff in fonts folder. When you select it my icon fonts appear OK in the preview pane.
When I do the same in resources view on the live version, there is a red circle with a ‘1’ to the right of spodv2.woff. When I click on this I dont see the font icons in the preview pane (as I did on local), just regular qwerty characters. Is it because my server doesn’t know how to serve .woff files?
February 25, 2013 at 9:23 am #125944chrisburtonParticipant@jaspinal You might need to establish a MIME type for woff as some servers (more notably, IIS) will not recognize them. So in your htaccess file put this (just to be safe we’ll add more):
AddType application/vnd.ms-fontobject eot
AddType application/x-font-ttf ttf ttc
AddType application/x-font-woff woff
AddType font/opentype otfAlso, depending on your server, fonts won’t load if they are from an external domain but since you stated they are, this doesn’t apply to you.
February 25, 2013 at 9:58 am #125954chrisburtonParticipantOh and thanks for using my textured diagonal pattern from Sublte Patterns.
February 25, 2013 at 10:15 am #125957JohnAspMemberChanged my .htaccess as suggested and it worked! Thanks a mill :-)
Oh and thanks for creating the pattern, it’s really nice. Love the effect I’m getting with a semi transparent element on top of it for the blog border, looks cool!
-
AuthorPosts
- The forum ‘CSS’ is closed to new topics and replies.