Self-Hosted Trying to add font.

Here’s what I get when I run grunt dump-dir :

root@InvoiceNinja:/var/www/html/ninja# grunt dump_dir --verbose
Initializing
Command-line options: --verbose, --gruntfile=/var/www/html/ninja/Gruntfile.js

Reading “Gruntfile.js” Gruntfile…OK

Registering Gruntfile tasks.
Reading package.json…OK
Parsing package.json…OK
Initializing config…OK

Registering “grunt-dump-dir” local Npm module tasks.
Reading /var/www/html/ninja/node_modules/grunt-dump-dir/package.json…OK
Parsing /var/www/html/ninja/node_modules/grunt-dump-dir/package.json…OK
Loading “dump_dir.js” tasks…OK

  • dump_dir
    Loading “Gruntfile.js” tasks…OK
  • default

Running tasks: dump_dir

Running “dump_dir” task
>> No “dump_dir” targets found.
Warning: Task “dump_dir” failed. Use --force to continue.

Aborted due to warnings.

I’m not sure what i’m doing wrong. Any Idea ?

Sorry, not sure

I can get you past this part but fonts are still not available after successful dump_dir.

First, make sure your fonts are converted to ttf.
Create a new folder /var/www/html/ninja/public/fonts/invoice-fonts
Inside the invoice-fonts folder, create a folder of the name of your font, i.e. /var/www/html/ninja/public/fonts/invoice-fonts/NotoSansTC then add your ttf fonts in this folder.
Make sure you have installed grunt in the /var/www/html/ninja directory
Then run grunt dump_dir

Output:
root@invoice-ninja-ubuntu-s-1vcpu-2gb-sgp1-01:/var/www/html/ninja/public/fonts/invoice-fonts# grunt dump_dir
Running “dump_dir:NotoSansTC” (dump_dir) task
File “public/js/vfs_fonts/NotoSansTC.js” created.

Done, without errors.

While this creates the NotoSansTC.js, the fonts are still unavailable in Invoice Ninja invoice design page. I’ve add the fonts to Ubuntu, cleared browser and server cache to no avail.

InvoiceNinja team, please replace the ugly, ill-spaced UKai with Google’s NotoSansCJK fonts. Please! Adding a new font per your instructions is not possible.

Warning:
File ‘fonts/NotoSansTC/NotoSansTC-Black.otf’ not found in virtual file system

Please help!

Do you see the new font in the database?

https://invoice-ninja.readthedocs.io/en/latest/configure.html#custom-fonts

Oh wow, that’s the issue:
| 21 | Noto Sans TC | NotoSansTC | ‘Noto Sans TC’, sans-serif | 300 | Noto+Sans+TC:300,400,500,700,900 | NotoSansTC-Regular.otf | NotoSansTC-Black.otf | NotoSansTC-Light.otf | NotoSansTC-Thin.otf | 1600 |

Will update and try again

So I fixed that and now the NotoSansTC can be used and shows in the invoice preview. Problem now is that the Chinese text appears normal, but English text is one letter per line vertically, making the document many pages and illegible.

How can I tell this pdf generator how to use the English font? Letters should not be spaced vertically but horizontally. Or can I modify the font file to do this?

Hi,

may i ask how you got past the first part? I’m getting

No “dump_dir” targets found.
Warning: Task “dump_dir” failed. Use --force to continue.
Aborted due to warnings.

unfortunately I’m not really familiar with npm, grunt, etc.

Any help would be really great!

1 Like

Sorry, I’m not sure this feature is working

Alright, thanks for the fast reply :slight_smile:
You do a great job here in the forum!
(this really makes a difference and therefore a +1 for i.n.)

Thanks, that’s nice of you to say :slight_smile:

FYI… in the next version of the app there is built in support for all Google fonts.

Awesome, thanks! Have a nice day!