Custom Font: Cannot Load

[playh5]

Hi,

 

I have this on my stylesheet.css

@font-face {    font-family: 'alpha_echo';    src: url('Fonts/alpha_echo.eot');    src: url('Fonts/alpha_echo.eot?#iefix') format('embedded-opentype'),         url('Fonts/alpha_echo.woff') format('woff'),         url('Fonts/alpha_echo.ttf') format('truetype'),         url('Fonts/alpha_echo.svg#alpha_echoregular') format('svg');    font-weight: normal;    font-style: normal;}

Then use the text in Phaser the way it is, But I am getting error in Chrome that says alpha_echo.woff 404 not found and in Firefox alpha_echo.woff and alpha_echo.ttf is also not found.

 

Any help would be appreciated. Thanks!

[iamsimon]

Two things:

 

1. Use "double quotes" (not 'single quotes') when declaring a font name. 

font-family: "alpha_echo"; 

2. Paths are relative to the CSS file. At the moment, your current rule assumes the Fonts directory is a sibling of (next to) your CSS file.

 

For exampl​e:

 

If your stylesheet lives within a CSS directory and your Fonts directory is outside of it, the correct path to your font would be '../Fonts/alpha_echo.eot'.

src: url('../Fonts/alpha_echo.eot');...

Hope that helps.

[playh5]

Nice! Thanks for the help