user1791574
user1791574

Reputation: 1749

How do I get the CSS fonts to work with this Grails PDF rendering plug-in?

I am using a Grails rendering plugin to generate PDF.

I want to include CSS with my PDF to render it nicely. I found an example on the rendering plugin website

I put the CSS below in print media so that it works for PDF, but this does not work for me. I also do not know how to change the font from Arial to another font. Can someone explain this to me?

The plugin uses Arial font with this CSS:

@font-face {
  src: url(path/to/arial.ttf);
  -fs-pdf-font-embed: embed;
  -fs-pdf-font-encoding: cp1250;
}

body {
  font-family: "Arial Unicode MS", Arial, sans-serif;
}

Upvotes: 2

Views: 2185

Answers (3)

Dmitry Yablonski
Dmitry Yablonski

Reputation: 11

The next is working for me good:

@font-face {
   font-family: 'Calibri';
   src: url(${grailsApplication.config.grails.serverURL}/fonts/calibri.ttf);
   -fs-pdf-font-embed: embed;
   -fs-pdf-font-encoding: Identity-H;
}

The -fs-pdf-font-encoding should be set in Identity-H. And after it you can add something like

 body {
    font-family: 'Calibri';
 }

Upvotes: 1

Kees Sonnema
Kees Sonnema

Reputation: 5784

You need arialuni.ttf not just arial.ttf download it here: http://www.findthatfonts.com/search-2683324-hTTF/fonts-download-search-engine-ARIALUNI.ttf.htm

Then

You have to give your @font-face a font-family name like this:

@font-face {
font-family: "Font-Name";
  src: url(path/to/font.ttf); // you have to add your font.ttf file to the server in a folder like assets/css/fonts or something.
  -fs-pdf-font-embed: embed;
  -fs-pdf-font-encoding: cp1250;
}

body {
  font-family: "Font-Name", Arial, sans-serif; // you called your font Font-Name in the @font-face so now you can use it as Font-Name everywhere else in you css.
}

Otherwise your arialuni.ttf has no name so you can't use it in other divs in your css.

Upvotes: 3

Jeroen W
Jeroen W

Reputation: 872

It doesn't really matter what name you give the font, as long as you choose a name for the src you provide between te @font-face brackets, like font-family: "SomeName";. Now, you can use the font everywhere using font-family: "SomeName".

Upvotes: 0

Related Questions