[Resolved] eliminate render blocking resources

[Ying]

But the countdown text was using Manjariwhich you haven’t hosted locally.

Am I missing anything?

[Christopher]

Yes thats true, but I changed that font again so I think we can disregard it. I only downloaded the fonts that I choose myself for the content, was not aware that the countdown takes another font but it has changed.

Does not change my problem though that I cant use the downloaded fonts 🙁

[Ying]

Go to your @font-face CSS, test if the URLs are correct.

Copy the file URL, paste it into a browser, does it take you to the font file?

[Ying]

I checked your media library, you uploaded the .zip file of the fonts, but not the font files themselves.
https://www.screencast.com/t/qcApDr7esX98

So your CSS URL leads to no where, that’s why the font can not be used.

Always make sure the URL in@font-face CSS is correct and it can be linked to the actual file.

[Christopher]

Ok I see the problem now, I just uploaded the ZIP files and referenced the actual files 🙂 Makes sense now hehe.

So I unzipped it all and wanted to upload the files unzipped now, however despite adding the following code to allow for it via Code snippets, it wont let me upload?

<?php
add_filter( 'upload_mimes', function( $mimes ) {
    $mimes['woff']  = 'application/x-font-woff';
    $mimes['woff2'] = 'application/x-font-woff2';
    $mimes['ttf']   = 'application/x-font-ttf';
    $mimes['svg']   = 'image/svg+xml';
    $mimes['eot']   = 'application/vnd.ms-fontobject';

    return $mimes;
} );

oswald-v47-latin-200.woff2
Sorry, you are not allowed to upload this file type.
oswald-v47-latin-200.woff
Sorry, you are not allowed to upload this file type.
oswald-v47-latin-200.ttf
Sorry, you are not allowed to upload this file type.
oswald-v47-latin-200.svg
Sorry, you are not allowed to upload this file type.
oswald-v47-latin-200.eot
Sorry, you are not allowed to upload this file type.

[Christopher]

Pretty strange, even if I add the following line to the wp-config.php file, it wont let me upload it.

define('ALLOW_UNFILTERED_UPLOADS', true);

shouldnt that let me upload anything? I have logged out and back in as well.

[Christopher]

Hi there,

I tried the php way again this morning and this time it worked 🙂 All the fonts display normally again now.

The Google Fonts are now out of the render blocking resources, so that worked!

For some reason the site slowed down anyway from 0,5s to 1s despite not changing anything else, so I still quiet dont understand how these tools work haha.

But probably it makes sense to finish the site first now and then debug in the end for better performance.

Is there anything that could be done regarding the other render blocking resources that come up still?

Cheers,
Chris

[David]

Plugins like WP Rocket or Perfmatters can be used to combine/minimize and inline render blocking CSS. They also have options to defer Javascripts.
You can’t do much about jQuery apart from not using plugins ( or the Themes Sticky Navigation as thats all GP requires jQuery for ) that require it.

[Christopher]

Thanks David,
I am using WP-Optimize 3.2.3 and noticed that the Minify option was turned off.

“If this is turned on, then the default settings are that JavaScript and CSS on this website will be concatenated and minified and HTML will be minified. You can adjust the settings in the tabs above to control this to meet your requirements.”

This should help I guess. Wp Rocket and Wp Optimize pretty much do the same thing or would you recommend Wp Rocket over it?

[David]

I don’t have a preference, i think both plugins do very much the same thing.

[Christopher]

thanks!

[David]

You’re welcome

[Author]

Posts