Archived topic
Cant change Font on mobile devices
5 replies · Started by Mouse on May 12, 2021
In the typography - body section ... I am changing the font {Using only system fonts because of speed reasons) these fonts are visible on dekstop but are not viewed on mobile devices... Can you please let me know what is going on here and how do I fix it?
Hi there,
i checked your site - and its using the System Font: Century Gothic.
System Fonts are reliant on the user device having those fonts locally stored. If the device does not have the font eg. an Android phone - it will use whatever system font is available.
Is there any way to lazy load the google font on all devices? So that the font look good as well as doesn't cause the website to load slowly =)
Is there any way to lazy load the google font on all devices? So that the font look good as well as doesn’t cause the website to load slowly =)
I'm not sure what you mean by "lazy load". Perhaps you meant preload?
If so, you can use the Hook element for this hooked to wp_head
Generally, the preload tag is structured like this
<link rel="preload" href="yoursite.com/path/to/your/font/zantroke-webfont.woff2" as="font" type="font/woff2" crossorigin>
Would this be slowing down the website? Actually the goal is to dress up the website to look good with some font and keep the speed fast.
It depends on how many you preload.
This explains it nicely. https://wp-rocket.me/blog/font-preloading-best-practices/#:~:text=However%2C%20there%20are%20performance%20tradeoffs,the%20rest%20of%20your%20site.
