Ensure text remains visible during webfont load - Forum | JoomShaper
Solved Helix Framework

Ensure text remains visible during webfont load

Asked by Baze 5 years ago Last activity 5 years ago

Hi guys,

i'm working on getting above 90 score on pagespeed, the only thing that i cannot sort out is the "Ensure text remains visible during webfont load".

Can you please let me know where does Shaper Helix calls them so that i can add font-display: swap; for them?
I've tried this in the custom css but it's not working:

@font-face {<br/>
font-display: swap !important;<br/>
}<br/>

the files in question are:<br/>
/templates/shaper_helixultimate/fonts/fa-brands-400.woff<br/>
/templates/shaper_helixultimate/fonts/fa-regular-400.woff<br/>
/templates/shaper_helixultimate/fonts/fa-solid-900.woff

Accepted answer

Marked as the solution
Baze Asked this

Guys do you even read the tickets? What url to check the issue? I'm asking for location of a file, you don't need url, nor screenshot for that. I've spent the day digging trough the code to find out where is the code located. I've found it myself and it's sorted out now.

Same as on the other tickets, 5 months ago i've sent you a bug for the BCC field in the contact form addon for sp page builder (which btw you still have it in the latest version) and 3 guys change on the ticket and ask for url. It's a bug on your system, you don't need url to check the issue.

Unbeleivable.

3 more replies

Baze Asked this

Found it, anybody that has the problem on page speed, you need to edit templates/shaper_helixultimate/css/font-awesome.min.css, at the very bottom you'll find these:

@font-face{font-family:"Font Awesome 5 Brands";font-style:normal;font-weight:normal;font-display:auto;src:url(../fonts/fa-brands-400.woff) format("woff"),url(../fonts/fa-brands-400.ttf) format("truetype"),font-display: swap}.fab{font-family:"Font Awesome 5 Brands"}@font-face{font-family:"Font Awesome 5 Free";font-style:normal;font-weight:400;font-display:auto;src:url(../fonts/fa-regular-400.woff) format("woff"),url(../fonts/fa-regular-400.ttf) format("truetype"),font-display: swap}.far{font-weight:400}@font-face{font-family:"Font Awesome 5 Free";font-style:normal;font-weight:900;font-display:auto;src:url(../fonts/fa-solid-900.woff) format("woff"),url(../fonts/fa-solid-900.ttf) format("truetype"),font-display: swap}.fa,.far,.fas{font-family:"Font Awesome 5 Free"}.fa,.fas{font-weight:900}

change the font-display:auto (3 occurances)to font-display: swap and you are good to go :)

Toufiq Senior Staff

Hi there,

Thanks for contacting us. Sorry for the inconvenience. Will you please share your site URL to check the issue?

-Thanks

Log in to reply.