I was hoping that this would be fixed in the latest Soledad theme update, but it seems it wasn't. Do you have an idea when this will be fixed? Could you help me with this?
Strange, we've added font-display:swap; for all the fonts loads by the theme.
Can you show me your site URL to I can take it a look?
Also, you can add font-display:swap; for your FontAwesome icons via Customize > General Options > and check to "Use display:swap for Font Icons from The Theme"
Thanks for your reply. I just deselected the minify option in Autoptimize. I left the option deselected for now. As you can see the text flash is still there. It is not necessarily the pagespeed score I am interested in (from the core web vitals report I know indeed my website loads very fast). I just want the text flash to be fixed if possible haha. Do you have any other suggestions?
The URL of the font icon - you can see it's from Elementor.. If so, I think we need to wait a solution from Elementor to solve this issue in the future updates. Because we can't affect anything to resource from Elementor..
Thank you for your reply. I think this only applies for the homepage (since the homepage is the only page that is build with elementor). If I look at one of my posts, the reason seems te be different. Refer to the attachment.
Strange, by default the theme doesn't loads that fonts. Also, all google fonts from the theme already loads via display:swap; already.
So, I think those fonts come from a plugin you're using. Can you please deactivate each plugin and check ? ( after deactivate a plugin, let's clear all the cache before check it )
Yesterday, I've logged in to your site and I see you're using WPBakery Page Builder plugin also. I think that's the google fonts from WPBakery Page Builder renders based on your settings. Can you please try deactivate WPBakery Page Builder and check it again? Because we really don't put any google fonts/custom fonts appears on single post page only. If it doesn't appears flash on the homepage - that mean it doesn't appears on the single post page also.
Sorry for my late reply, I was on holiday. This can not be the problem I think, because only two pages on the whole website are build with WPBakery. When I run the google speed test (and when I personally test it) the flash in text occurs on each page. I just checked additionally, the google speed test gives the error on every page (including elementor page, WPBakery page, classic page and classic editor posts).
I just checked your site again and I see the google fonts doesn't render by default, have you optimize the google fonts via Autoptimize plugin? If yes, let's un-check on that optimize.
I see that script: http://prntscr.com/u787zg - instead of loading an URL for google fonts with display:swap; like that:
I just changed the settings in autoptimize regarding google fonts (in tab "extra") from "Combine and load fonts asynchronously with webfont.js." to "Leave as is." but it still flashes. Is still what you mean?
And it's not the font from the theme because It doesn't render from our codes. All the google fonts from our theme has been passed with the check from Google page speed.
Can you please try deactivate all plugins ( except plugins from the theme & Autoptimize & W3 Total Cache ) - after that clear the cache and check it again on a post? Example this post:
Thank you for your reply. I disabled all the plugins as you mentioned and the error was gone. As soon as I activated the 'advanced ads' plugin (which is used to place adsense ads on the website) the error appeared again. This still leaves the question whether the error is created only by the advanced ads plugin, or that it is because of adsense. What do you think?
Hi Penci,
When I run the pagespeed insights test from Google I still get the "Flash of invisible text" warning. Refer to attached printscreen and the following link: https://web.dev/font-display/?utm_source=lighthouse&utm_medium=unknown
I was hoping that this would be fixed in the latest Soledad theme update, but it seems it wasn't. Do you have an idea when this will be fixed? Could you help me with this?
Best regards,
Teun
Hi,
Strange, we've added font-display:swap; for all the fonts loads by the theme.
Can you show me your site URL to I can take it a look?
Also, you can add font-display:swap; for your FontAwesome icons via Customize > General Options > and check to "Use display:swap for Font Icons from The Theme"
Best Regards,
PenciDesign
Hi Penci,
Thanks for your reply. I just deselected the minify option in Autoptimize. I left the option deselected for now. As you can see the text flash is still there. It is not necessarily the pagespeed score I am interested in (from the core web vitals report I know indeed my website loads very fast). I just want the text flash to be fixed if possible haha. Do you have any other suggestions?
Thanks.
Best regards,
Teun
Hi,
Ahh, I found it.
That's fontawesome icons from Elementor plugin has caused the issue.
Let's see here: http://prntscr.com/tpz9ok
The URL of the font icon - you can see it's from Elementor.. If so, I think we need to wait a solution from Elementor to solve this issue in the future updates. Because we can't affect anything to resource from Elementor..
Best Regards,
PenciDesign
Hi Penci,
Thank you for your reply. I think this only applies for the homepage (since the homepage is the only page that is build with elementor). If I look at one of my posts, the reason seems te be different. Refer to the attachment.
Do you know how to fix that?
Best regards,
Teun
Hi,
Strange, by default the theme doesn't loads that fonts. Also, all google fonts from the theme already loads via display:swap; already.
So, I think those fonts come from a plugin you're using. Can you please deactivate each plugin and check ? ( after deactivate a plugin, let's clear all the cache before check it )
Best Regards,
PenciDesign
Hi Penci,
Thank you for your reply. I tried, but it still gives the error. I really don't understand. Do you have any other suggestions?
Best regards,
Teun
Hi,
Can you please try clear all the cache and disable all caching plugin and check it again? To find where the fonts come from..
Best Regards,
PenciDesign
Hi Penci,
Thanks for your reply. I did, but I can't seem to find it. Maybe it can't be fixed strangely enough.
Best regards,
Teun
Hi,
Yesterday, I've logged in to your site and I see you're using WPBakery Page Builder plugin also. I think that's the google fonts from WPBakery Page Builder renders based on your settings. Can you please try deactivate WPBakery Page Builder and check it again? Because we really don't put any google fonts/custom fonts appears on single post page only. If it doesn't appears flash on the homepage - that mean it doesn't appears on the single post page also.
Best Regards,
PenciDesign
Hi Penci,
Sorry for my late reply, I was on holiday. This can not be the problem I think, because only two pages on the whole website are build with WPBakery. When I run the google speed test (and when I personally test it) the flash in text occurs on each page. I just checked additionally, the google speed test gives the error on every page (including elementor page, WPBakery page, classic page and classic editor posts).
Do you have any other thoughts?
Best regards,
Teun
Hi,
I just checked your site again and I see the google fonts doesn't render by default, have you optimize the google fonts via Autoptimize plugin? If yes, let's un-check on that optimize.
I see that script: http://prntscr.com/u787zg - instead of loading an URL for google fonts with display:swap; like that:
Best Regards,
PenciDesign
Hi Penci,
I just changed the settings in autoptimize regarding google fonts (in tab "extra") from "Combine and load fonts asynchronously with webfont.js." to "Leave as is." but it still flashes. Is still what you mean?
Best regards,
Teun
Hi,
Yes, you did what I mean.
That's strange, when I checked a post on your site, I just got issue with Roboto font only:
http://prntscr.com/u7hava
And it's not the font from the theme because It doesn't render from our codes. All the google fonts from our theme has been passed with the check from Google page speed.
Can you please try deactivate all plugins ( except plugins from the theme & Autoptimize & W3 Total Cache ) - after that clear the cache and check it again on a post? Example this post:
https://infoblaasontsteking.nl/blaasontsteking-behandeling/cranberry-blaasontsteking/
And see it works or not.
Best Regards,
PenciDesign
Hi Penci,
Thank you for your reply. I disabled all the plugins as you mentioned and the error was gone. As soon as I activated the 'advanced ads' plugin (which is used to place adsense ads on the website) the error appeared again. This still leaves the question whether the error is created only by the advanced ads plugin, or that it is because of adsense. What do you think?
Best regards,
Teun
Hi,
I think that's issues from plugin 'advanced ads' - your Roboto font has been rendered from this plugin.
Best Regards,
PenciDesign