Finwillwin

HOW DO I PUT WEB FONTS INTO A MULTI JS FILE PHASER GAME???

Recommended Posts

So I followed this tutorial, but I can't get it to work:

 

Here is my code:

<html lang="en"> 

<header>
	    <style type="text/css">
@font-face {
    font-family: 'press_start_2pregular';
    src: url('pressstart2p-webfont.woff2') format('woff2'),
         url('pressstart2p-webfont.woff') format('woff');
    font-weight: normal;
    font-style: normal;

}

</style>
</header>
<head>
	<meta charset="UTF-8" />
	
	
	<title>Disturbance in Sector C</title>
	
	<script type="text/javascript" src="code/phaser.min.js"></script>
	<script type="text/javascript" src="code/Level1.js"></script>
	<script type="text/javascript" src="code/Level0.js"></script>
	<script type="text/javascript" src="code/start.js"></script>
	<script type="text/javascript" src="code/settingsmain.js"></script>
	<script type="text/javascript" src="code/settingsmain1.js"></script>
	<script type="text/javascript" src="code/settingsmain2.js"></script>
	<script type="text/javascript" src="code/Loader.js"></script>
	<script type="text/javascript" src="code/Loader1.js"></script>
	<script type="text/javascript" src="code/Loader2.js"></script>
	<script type="text/javascript" src="code/Loader3.js"></script>
	<script type="text/javascript" src="code/intro.js"></script>
	<script type="audio/mp3" src="audio/Outerlands.mp3"></script>
    <style type="text/css">body {margin: 0;}body{
background-color:black;
}</style>
<head>
	
<link rel="shortcut icon" href="favicon.ico" type="image/x-icon">
<link rel="icon" href="favicon.ico" type="image/x-icon">
</head>
<body>
<div style="font-family:Press Start 2P; position:absolute; left:-10000px">Font Loaded</div>
<script type="text/javascript">
var game = new Phaser.Game(1100, 550, Phaser.AUTO);



game.state.add('Level1', Level1);
game.state.add('Level0', Level0);
game.state.add('Loader', loader);
game.state.add('Loader1', loader1);
game.state.add('Loader2', loader2);
game.state.add('Loader3', loader3);
game.state.add('start', start);
game.state.add('settingsmain', settingsmain);
game.state.add('settingsmain1', settingsmain1);
game.state.add('settingsmain2', settingsmain2);
game.state.add('intro', intro);
game.state.start('Loader');
game.pause = 0;
game.kys = 0;
game.fps = 1;
game.mute = 0;
game.spawn = 0;
game.downn = 0;
game.song = 0;
game.weapon = 0;
game.frame = 0;



</script>
</body>
</html> 

So ya thanks!

Share this post


Link to post
Share on other sites

That's old and doesn't work anymore.

So I've followed the Google official tutorial and for me works this code:

<link href="https://fonts.googleapis.com/css?family=Revalia|Droid|Montserrat|Ubuntu" rel="stylesheet">

let fontarray = ['Revalia', 'Droid', 'Droid Sans', 'Droid Serif', 'Montserrat'];
let WebFontConfig = google: { families: fontarray }

 

Share this post


Link to post
Share on other sites

Create an account or sign in to comment

You need to be a member in order to leave a comment

Create an account

Sign up for a new account in our community. It's easy!

Register a new account

Sign in

Already have an account? Sign in here.

Sign In Now

  • Recently Browsing   0 members

    No registered users viewing this page.