Forum
Welcome, Guest
Please Login to access forum.
Eliminate render-blocking JavaScript and CSS in above-the-fold content (1 viewing) 
Go to bottom
TOPIC: Eliminate render-blocking JavaScript and CSS in above-the-fold content
#2009
Joman Auto Service
Fresh Boarder
Posts: 2
User Offline
Eliminate render-blocking JavaScript and CSS in above-the-fold content Karma: 0  
Upon enabling this module and selecting the type of font I want to use here:



I receive the following error message while checking PageSpeed Insights:

Eliminate render-blocking JavaScript and CSS in above-the-fold content
Your page has 1 blocking CSS resources. This causes a delay in rendering your page.
None of the above-the-fold content on your page could be rendered without waiting for the following resources to load. Try to defer or asynchronously load blocking resources, or inline the critical portions of those resources directly in the HTML.

Optimize CSS Delivery of the following:

https://fonts.googleapis.com/css?family=TYPE OF FONT


Now I had this error message with my template previously and I was able to correct it by creating a custom.css file and putting the following code there:

Code:

@import url(https://fonts.googleapis.com/css?family=Raleway:700,300|Roboto+Slab:400,300,700);
What do I have to do to correct this error and have the component pull in the fonts from the custom.css file which already exists. This error significantly affects my Insights rating.
 
Logged Logged  
  The administrator has disabled public write access.
#2010
John Dagelmore
Admin
Posts: 3722
User Offline
Re:Eliminate render-blocking JavaScript and CSS in above-the-fold content Karma: 79  
Hello,

the css files in any Joomla templates are always loaded in this way.
However you can place the Google font loading in an existant CSS file of responsivizer as you pointed out and remove the selection from the dropdown:

Code:

@import url(https://fonts.googleapis.com/css?family=Raleway:700,300|Roboto+Slab:400,300,700);
You can either use the standard 'main.css' file to load the Google font, or create a new file in Responsivizer called 'custom.css' if you prefer and call it in the template index.php. Notice that to get best speed performance, the file loading for CSS should be positioned just before the end </body> tag. best regards John
 
Logged Logged  
  The administrator has disabled public write access.
#2011
Joman Auto Service
Fresh Boarder
Posts: 2
User Offline
Re:Eliminate render-blocking JavaScript and CSS in above-the-fold content Karma: 0  
I need to know where it's calling from now so I can remove it please.
 
Logged Logged  
  The administrator has disabled public write access.
#2012
John Dagelmore
Admin
Posts: 3722
User Offline
Re:Eliminate render-blocking JavaScript and CSS in above-the-fold content Karma: 79  
The call to the loading of the Google fonts is placed at the bottom of the file:

Code:

joomlapath/templates/responsivizer/framework/bootstrap.php
However it's activated only when in the backend dropdowns a Google font is selected. Thus if you choose a standard font it won't be called anymore.
 
Logged Logged  
  The administrator has disabled public write access.
Go to top