SOLVED google fonts as local fonts?
-
-
- Forum Service
- Jr. Rocketeer
- Posts: 21
- Thanks: 2
-
hi all.
a question maybe for (very) experts?
the gantry theme style panel allows to select a couple of pre-installed local font or any font from google library to set the $font-family-default, and even more (like specific title font, or logo font, and so on, depending on the theme).
$font-family-default is a parameter widely used, in theme and particles scss.
usually i use google fonts on my sites.
the choosen fonts will be loaded, as far as i understand, via get-font-family registered gantry function. which calls in some way the function libGetFontUrl, in /libraries/gantry5/src/classes/Gantry/Component/Stylesheet/Scss/Functions.php
after long preamble, my question: is there a way to override this "libGetFontUrl" function? (like, in the old days, /components/com_gantry/features/webfonts.php)
reason: i usually set "open sans" as default-font, that's not a local font. therefore it is loaded calling //fonts.googleapis.com. this way, i have a link to an external resource with no chance to set its integrity checksum to be compliant with Subresource integrity feature.
gantry does not allow, as far as i know, to select local fonts besides the ones coming with the theme.
my idea is to:
1. download the remote font and convert it
2. add a font.css with @import local font
3. hack libGetFontUrl with a redirect to libGetLocalFonts
or there's a simpler way i didn't get yet? like add local fonts to style panel fonts list (i can't find a way to do that)
hoping in some advices, regards.
-
-
-
- Matt
- Preeminent Rocketeer
- Posts: 21595
- Thanks: 3098
- messin' with stuff
-
I've added additional local fonts in the past... but it's been a while... don't remember if I had them loading all the way through to the admin but I'm sure that's doable if the Theme can do it... or maybe I'm not fully understanding
you want additional local fonts to show up here right?: imgur.com/a/1a5IxBr
have you reviewed everything here?:
docs.gantry.org/gantry5/tutorials/fonts - Last Edit: 5 months 6 days ago by Matt.
- SEARCH the forum first! These boards are rich in knowledge and vast in topics. This includes searching just the 'Solved' forums, using Google, and using ChatGPT
-
-
-
- Forum Service
- Jr. Rocketeer
- Posts: 21
- Thanks: 2
-
hi. thank you for your reply.
yes, i had read the tutorial. it lacks the part about "how to select my local fonts via admin panel?".
anyway, in the meanwhile i found a solution, more elegant than the hack i was thinking of. i can post it here, if someone intrested. the first part is mostly the RC tutorial you're speaking of, actually.
1. use an on line tool to convert your google fonts and get the css (i.e. gwfh.mranftl.com/fonts/roboto?subsets=latin , which i discovered thanks to gantry font tutorial)
2. save that css in custom/scss/ and declare it in custom.scss (i.e.: fonts.scss => @import "fonts"
3. copy the fonts into custom/fonts/ folder
4. override gantry/template.yaml by copying it in custom/gantry/ << here's the trick
5. modify template.yaml by adding your local fonts in "fonts" section
6. recompile scss
7. now you can see your local fonts as selectable in style panel.
and it works.
regards.
-
Time to create page: 0.035 seconds