Home › Forums › Basel support forum › Font management
Font management
- This topic has 11 replies, 3 voices, and was last updated 4 years ago by Artem Temos.
-
AuthorPosts
-
October 24, 2020 at 5:19 pm #235840
pierredemeudonParticipantHi
Within theme settings, I chose 2: hind 400 + palanquin 600.In source code: href=’//fonts.googleapis.com/css?family=Hind%3A300%2C400%2C500%2C600%2C700%7CPalanquin%3A100%2C200%2C300%2C400%2C500%2C600%2C700&subset=latin-ext&display=swap&ver=5.3.0
=> How to limit the download strictly to chosen ones? Eg not download palanquin 100 + 200 + 300 + 400 + 500 + 600 + 700 when only 600 is chosen in the theme?
Kind regards
Attachments:
You must be logged in to view attached files.October 25, 2020 at 8:14 am #235907
Elise NoromitMemberHello,
Your questions is not clear. You have uploaded palanquin font and font-weight:600, so you should set this font and choose the appropriate font-weight.
You do not need to upload all the font weights if you are not going to use them, however, you need to upload all the fonts file types. Here is the more detailed instruction: https://xtemos.com/docs/basel/faq-guides-2/upload-custom-fonts/
Best Regards
October 25, 2020 at 2:53 pm #235971
pierredemeudonParticipantHi
Within theme settings, I chose 2: hind 400 + palanquin 600 (see formerly attached image).
This results in Basel theme requesting to load all the types (eg for Palanquin: the 100 + the 200 + the 300 + the 400 + the 500 + the 600 + the 700). Via this instruction:
href=’//fonts.googleapis.com/css?family=Hind%3A300%2C400%2C500%2C600%2C700%7CPalanquin%3A100%2C200%2C300%2C400%2C500%2C600%2C700&subset=latin-ext&display=swap&ver=5.3.0
Q1: why do you “impose” to load all styles (here all available weights) when only 1 weight is used and defined so in the theme?
Q2. How to limit the download strictly to chosen 2 ones? Eg how to only download palanquin 600 + + Hind 400, when only 600 is chosen in the theme?
Kind regards
October 26, 2020 at 8:16 am #236115
Artem TemosKeymasterHello,
1. Because we use all font-weight in the style.css. There are a lot of places with font-weight 400,500,600,700 etc. If we don’t include all variations that a lot of places will be not styled properly.
2. In this case, you will need to use a custom code to include only those fonts that you need. And we can give you a custom PHP to remove our theme’s Google Fonts completely.
Kind Regards
October 29, 2020 at 7:27 am #236947
pierredemeudonParticipantHi,
The absolute key priority is speed (priority n°1 for UX, growing pressure from Google) … on mobile.
When I look at a simple product page, for this specific layout, the weight of fonts is excessive: Main image is 45k (on mobile), fonts weight 200k (see attached). On total bytes, fonts weight 3 times more in bytes than images (see image attached=xtemos72a)
Re. font awesome. During last days, I tried another theme, in the settings, they propose not to download the full FA library, and use instead a local library … with the few needed ones (ie cart, my account, search, social, …).
Re font weights, if not mistaken, on the page, all texts are written with the fonts and weights chosen via theme settings. So, why instruct for all weights in all styles for all available unicodes? (see image attached=xtemos72b)
And if no font-weight is defined is theme settings, then download the full library …
My understanding is also that, if normal is chosen for font style and an
Attachments:
You must be logged in to view attached files.October 29, 2020 at 8:50 am #236974
Artem TemosKeymasterHello,
Re. font awesome. During last days, I tried another theme, in the settings, they propose not to download the full FA library, and use instead a local library … with the few needed ones (ie cart, my account, search, social, …).
If you will not use any WPBakery elements that use Font Awesome icons then it will not be loaded at all. We don’t have a limited version of the font.
Re font weights, if not mistaken, on the page, all texts are written with the fonts and weights chosen via theme settings. So, why instruct for all weights in all styles for all available unicodes? (see image attached=xtemos72b)
Some font weights are also defined by CSS rules in style.css files so that is why we load all font-weight by default. But we can give you a custom PHP to remove our theme’s Google Fonts completely so you can load only font styles that you need with your custom CSS.
Kind Regards
November 4, 2020 at 4:55 pm #238732
pierredemeudonParticipantHi,
After deeper investigations …
Re. font awesome:
OK, your comment enabled me to find the solution. My footers, as you recommended me, were made via html blocks. And when you add a link to, for instance instagram, the icon is automatically added by Wpbakery. But it can be changed, via text editor. And it works“Re font weights”
I was not understanding why you wrote that … but finally found why… Even if a given font and weight -say Palanquin 600- is chosen for titles, this choice -what I supposed to be imposed everywhere by default, can be over-ruled by your elements … or wp bakery’s … without a way to correct. And so, the Palanquin 600 can become a 700 … somewhere like in attached.
And this is very … tricky and impossible to manage on case by case. So:
1. As of now, it would be nice to have a way to only load latin + latin ext.
2. Could you please clarify what Simple-Line-Icons and basel-font are needed for, even when specific font are chosen? Can they be easily replaced by fonts chosen via theme? Asking because if is as tricky as for font weight … well ….
Waiting for your feedback
Kind regardsAttachments:
You must be logged in to view attached files.November 5, 2020 at 2:40 pm #239119
Artem TemosKeymasterHello,
1. Do you mean that latin-ext is not loaded on your website? Could you please send us a link?
2. Simple line icons examples
https://prnt.sc/ve31jg
https://prnt.sc/ve31uf
https://prnt.sc/ve32rt
https://prnt.sc/ve335n
https://prnt.sc/ve33lu
https://prnt.sc/ve355z
https://prnt.sc/ve35rwBasel font
https://prnt.sc/ve2tr1
https://prnt.sc/ve2u8b
https://prnt.sc/ve2ul2
https://prnt.sc/ve2z0t
https://prnt.sc/ve2zovNovember 6, 2020 at 2:46 pm #239483
pierredemeudonParticipantHi,
After deeper investigations, I discovered that the services like GTmetrix, webpagetest etc are not reliable on fonts, and meaning that they are not giving the right picture.
Indeed, the browser loads what it needs, so the genuine picture is different.Re. your fonts, I understand. Indeed, they can’t be replaced by a lighter library. This said, since both are icons, why don’t you do only 1 file? What would help to simplify the whole
Kind regards
November 7, 2020 at 9:33 am #239655
Artem TemosKeymasterWe can’t combine them since “Simple line icons” is a separate library and we can’t customize it. Moreover, as we mentioned, combining these two files into one will not increase your website performance at all.
November 7, 2020 at 2:13 pm #239742
pierredemeudonParticipantThat could contribute. Reduce the number of requests. Simplify html parsing.
That’s what is called marginal gains. Which addition gives something more visible.
But agreed, your use of deprecated and old unsecure js is more important than this little detail.
Among others
Kind regardsNovember 9, 2020 at 7:23 am #240071
Artem TemosKeymasterYes, but we are not able to do this since the “Simple line icons” is a separate library, it is not a file developed by us. And font files can’t be simply combined as CSS or JS files.
-
AuthorPosts
- You must be logged in to create new topics. Login / Register