Custom fonts returns "Failed to decode downloaded font"

[motionair]

Hi,

I have been trying to crack this nut for a while now with no luck so i come here with my hat i my hand..

I added custom webfonts to my wordpress site, but they return a “Failed to decode downloaded font” error when i check it in the chrome inspector.

—————– style.css —————–

@font-face {
    font-family: 'montserrathairline';
    src: url('http://motionair.no/fonts/montserrat-hairline-webfont.eot');
    src: url('http://motionair.no/fonts/montserrat-hairline-webfont.eot?#iefix') format('embedded-opentype'),
         url('http://motionair.no/fonts/montserrat-hairline-webfont.woff2') format('woff2'),
         url('http://motionair.no/fonts/montserrat-hairline-webfont.woff') format('woff'),
         url('http://motionair.no/fonts/montserrat-hairline-webfont.ttf') format('truetype'),
         url('http://motionair.no/fonts/montserrat-hairline-webfont.svg#montserrathairline') format('svg');
    font-weight: normal;
    font-style: normal;

}

—————– CSS (a lot, but just to make sure i got the right one —————

p {
    font-family: 'montserrathairline';
}

h1,h2 {
    font-family: 'montserrathairline';
}

h3,h4 {
    font-family: 'montserrathairline';
}

h5,h6 {
    font-family: 'montserrathairline';
}

.x-topbar p {
font-family : 'montserrathairline';
}

.x-brand {
font-family : 'montserrathairline';
}

body,a {
font-family : 'montserrathairline';
}

This all returns the following code, and my text displays as “Serif regular”

ERROR in chrome inspector
Failed to decode downloaded font: http://motionair.no/fonts/montserrat-hairline-webfont.woff2
(index):1 OTS parsing error: Failed to convert WOFF 2.0 font to SFNT
(index):1 Failed to decode downloaded font: http://motionair.no/fonts/montserrat-hairline-webfont.woff
(index):1 OTS parsing error: incorrect file size in WOFF header
(index):1 Failed to decode downloaded font: http://motionair.no/fonts/montserrat-hairline-webfont.ttf
(index):1 OTS parsing error: post: table overruns end of file

Any and all help here greatly appreciated, i have tried a lot of difrent solutions with no luck. This is my last option before i revert to a regular google webfont. Thank you for your time!

-R

[Paulie_D]

Are hosting the fonts yourself or trying to hotlink them?

I’d suggest downloading them and linking locally.

Or just Google the error.

This isn’t a CSS issue as such…it’s a progamming one,

[motionair]

I am hosting them on my website and when i go to the direct link i download a font that works.

I tried google with no luck.

Thanks anyway!

[jodamo5]

I just had the same issue – but with Font Awesome, which is a really well known font. Turned out this was caused by a problem with FTP. The file was uploaded as text (ASCII) instead of binary, which corrupted the file. I simply changed my FTP software to binary, re-uploaded the font files, and then it all worked.

[Author]

Posts