Page 1 of 1

font in header and footer (css pdf)

Posted: Thu Jul 13, 2023 7:11 pm
by Ecumaster
Hi,
could sb help me with this:
In css file for pdf output I've set:
* {
font-family: "Roboto", sans-serif !important;
}
to have the same fonts in the whole pdf document.

All elements display as Roboto except the footer and header, where I get an Arial font, which I have not defined in my customization css

I've also tried defining font-family for @page @top-right ,@top-left, etc, but that does not help.

thanks
/Wojtek

Re: font in header and footer (css pdf)

Posted: Fri Jul 14, 2023 9:32 am
by julien_lacour
Hello,

If you want to set a font in the header and footer, you need to use the @page rule as explained in How to Change the Font of the Headers and Footers.

If you are using Oxygen Styles Basket to create a publishing template, the generated CSS will contain a rule similar to this one:

Code: Select all

@page {
  font-family: SelectedFont, sans-serif; 
}
Regards,
Julien

Re: font in header and footer (css pdf)

Posted: Fri Jul 14, 2023 3:02 pm
by Ecumaster
Hi,
I did the trial with Oxygen Styles Basket and figured out that maybe my font source is not suitable - I had it defined like this (from local disc):
@font-face {
font-family: roboto;
font-style: normal;
font-weight: 400;
src: url(fonts/roboto/Roboto-Regular.ttf) ;
}
@font-face {
font-family: roboto;
font-style: normal;
font-weight: 700;
src: url(fonts/roboto/Roboto-Bold.ttf) ;
}
@font-face {
font-family: roboto;
font-style: normal;
font-weight: 300;
src: url(fonts/roboto/Roboto-Light.ttf);
}
Apparently, it was not enough so copy-paste of font import from styles:
@import url('https://fonts.googleapis.com/css?family ... splay=swap');

I don't really understand why yet, but it worked!
Thank you