[How to] Change font server?

FiveM Resource Development & Modding Discussion
1

I have this font on server now:
http://iscr.ru/image/23AnZ
but i need about such:
http://iscr.ru/image/2ON97

I did as in the instructions .But not all for the end dont understand.I convert font to .gfx and what should i do next?
INSTRUCTION ON WHICH I DID:
How to add fonts (FiveM update - May 5th/6th, 2017)

Convert your .ttf to a .swf. You can use swfmill (http://swfmill.org/releases/swfmill-0.3.3-win32.zip44) to do this:
swfmill simple in.xml out.swf
Convert the .swf to .gfx. You need gfxexport.exe for this. We can not tell you where to get this, as it’s illegal to spread - find it on Google.
gfxexport out.swf
Put out.gfx in a stream/ folder in a resource, perhaps rename it.

AND FURTHER I DONT UNDERSTAND WHAT IS MEANT:

Call RegisterFontFile and RegisterFontId from a client script.
Use the registered ID in SetTextFont, instead of one of the game’s built-in IDs.

Help.

1 Like
2

That looks like vRP, you don’t need to do all that workaround, just go the where the GUI html/css file is located, add a new typeface, find where the font-family for the page is being declared and change it to the one of your liking. If you use a local file for the font don’t foget to add to the _resource.lua file the new font file.

If you don’t know how to use a custom font on webpages search for:
How to use a local font file on my webpage
…or something like that, it’s basically a webpage afterall.

3

in html file in gui folder i have this:

<!DOCTYPE html>
<html>
  <head>
    <script src="nui://game/ui/jquery.js" type="text/javascript"></script>
    <script src="Menu.js" type="text/javascript"></script>
    <script src="ProgressBar.js" type="text/javascript"></script>
    <script src="WPrompt.js" type="text/javascript"></script>
    <script src="RequestManager.js" type="text/javascript"></script>
    <script src="AnnounceManager.js" type="text/javascript"></script>
    <script src="Div.js" type="text/javascript"></script>
    <script src="main.js" type="text/javascript"></script>
    <link href="design.css" rel="stylesheet" type="text/css" />
  </head>
  <body>
  </body>
</html>
4

Inside design.css create a new typeface and apply the font for all css elements.

*{ font-family: fontname, sans-serif; }

Don’t forget to add your font files to _ resource.lua otherwise people will not download the file for the custom font.

6

I have

@font-face {
   font-family: "GTARussian-Regular"; 
   src: url("fonts/GTARussian-Regular.woff") format('woff');

in design.css
and in _resource.lua this:

-Loading Font Files--
files{ 
  "gui/fonts/GTARussian-Regular.woff"
}

but font dont change

7

You’re just importing the font, you forgot to set it, add the following to design.css:

*{
    font-family: "GTARussian-Regular" !important;
}
8

So?

*{
  margin: 0;
  padding: 0;
}
@font-face {
   font-family: "Vox 6"; 
   src: url("fonts/Vox-Regular15.woff") format('woff');
   
} 
*{
    font-family: "Vox 6" !important;
}

/* make body full page */
html, body {
  margin: 0;
  height: 100%;
  overflow: hidden;
}

.console{
  background-color: white;
  color: red;
  font-weight: bold;
}

/* menu */

.menu{
  background-color: rgba(97,162,158,0.4);
  color: white;
  width: 250px;
  height: 50%;
  position: absolute;
  font-weight: bold;
}

.menu_description{
  background-color: rgba(58,144,255,0.6);
  color: white;
  position: absolute;
  font-weight: bold;
  padding: 9px;
  font-size: 1.2em;
  max-width: 500px;
}

.menu h1{
  background-color: rgba(97,162,158,0.4);
  color: white;
  text-align: center;
  font-size: 1.6em;
  padding: 6px;
}

.choices{
  overflow-y: scroll;
  overflow-x: hidden;
}

.choices::-webkit-scrollbar{ 
  display: none; 
}
9

You can put the contents of both *{} inside only one but yeah, that’s the gist of it…

10

thanks):grinning:
now changed)

11

I am having the worst time trying to find the Pricedown font url to use. Can anyone help me out?

12

I tried to add it to the __resource.lua, but I got an error when loading into the server. Said vrp can’t load.

What is the file path for that resource lua?

13

Which piece of code are you adding to _resource.lua? Make sure you read everything to it’s full extent, it’s the latter code.

You’re not going to just copy-paste, you need to adapt to the way you installed your font and which font you’re using.

Just read the instructions I told the other guy, if he’s able to do it correctly you can too, read carefully.

14

I was copy pasting his code and changing the information of what would be different.

Put this in the design.css

@font-face {
   font-family: "Vox 6"; 
   src: url("fonts/Vox-Regular15.woff") format('woff');
   
    font-family: "Vox 6" !important;
}

Then in the __resource.lua of vrp I copy pasted

-Loading Font Files--
files{ 
  "gui/fonts/GTARussian-Regular.woff"
}

Now one of my issues is I can’t seem to find that url for pricedown and also I am not sure if I should also be adding the ttf or woff file itself somewhere.

15

Here is exactly what I did.

I created in the vrp folder a folder for fonts and put the pricedown.woff file there.

Then I went into the design.css in the path vrp/gui/design.css and put this at the top:

@font-face {
   font-family: "Pricedown"; 
   src: url("fonts/Pricedown.woff") format('woff');
   
    font-family: "Pricedown" !important;
}

Then I went into the __resource.lua with the vrp folder and place this:

--Loading Font Files--
files{ 
  "fonts/Pricedown.woff"
}

I am not sure why this is not working?

16

The paths for files are relative to the location you call them from, just think about it, if you created the fonts file inside the vrp folder, it’s now fonts/Pricedown.woff

If you go inside the gui folder and type the above it will interpret the absolute path as gui/fonts/Pricedown.woff

So you either move your fonts folder inside the gui folder and in _resource.lua you load gui/fonts/Pricedown.woff or you leave it where it is and inside design.css you change the path to ../fonts/Pricedown.woff (where the ../ means “go back one folder”).

Viewing from design.css
../fonts/Pricedown.woff = vrp/fonts/Pricedown.woff

fonts/Pricedown.woff = vrp/gui/fonts/Pricedown.woff

17

Just so I make sure I understand you correctly. Here is what I just did and tell me if I did it right.

I created a folder for fonts inside the gui folder. So when I put in:

@font-face {
font-family: “Pricedown”;
src: url(“fonts/Pricedown.woff”) format(‘woff’);

font-family: "Pricedown" !important;

}

Then I went into the resource. lua and then added this:

–Loading Font Files–
files{
“fonts/Pricedown.woff”
}

Is that correct?

18

are you sure your file is a .woff?

19

Yea. I converted it myself.

22

Can I Add A font To scripts ??

23

hi I am stuck to get my custom font working in the blips display name on the map would appreciate if someone helps me to get this works
here is the register command for the font I have

RegisterFontFile('A9eelsh')
fontId = RegisterFontId('A9eelsh')
SetTextFont(fontId)

I put the stream folder in the script but in the esx_scriptxxxx/client/main.lua
where to put these lines?