Change font globally for the whole page

TYPO3 Questions Installation
1

Hello Community
I spent a whole day googling to find out how to change the font for a complete new Typo3 site with Bootstrap Package and Introduction Package.
I am at a loss and would be very grateful for some advice.

My installation:
Typo3 Version 10.4
Bootstrap Package Version 11.0.2
The official Introduction Package Version 4.2.0

The specification from the customer is that a custom font must be local on the server and all content must be displayed with this font.

I copied the font to the server in the folder /fileadmin/fonts/ and it is available in the format woff and woff2. There is also a css file with the css font_face declaration in there.

I have deactivated the GoogelFont integration:
page.theme.googleFont.enable = 0

I hope someone knows how to do this or has links to instructions. I’m getting desperate about this.
Thanks in advance
Greetings Kurt

2

You can easily add your own custom CSS (with the including font_face declaration) with TypoScript:

page.includeCSS.custom = fileadmin/fonts/yourfile.css

For more options, see: https://docs.typo3.org/m/typo3/reference-typoscript/master/en-us/Setup/Page/Index.html#includecss-array

1 Like
3

Hi Thom

I had already read the CSS variant somewhere and tested it for myself. Only when I read your post with the link did I realise that I had to enter it in the “Setup” and not in the “Constants” of the template. This mistake happens to me again and again. I don’t know what exactly the difference is. But it works now. Thank you very much. :+1: :hugs:

Greetings Kürä

1 Like
4

It’s quite easy:

“Setup” is for the whole processing in Frontend. “Constants” are only configuration possibilities which are handled by “Setup”.

1 Like