How to Fix “Googlebot cannot access CSS and JS files” Error in WordPress

Google’s ranking algorithm likes to prioritize the top spots on search criteria to those who have user-friendly websites. These sites are fast, have good navigation, don’t have errors, etc. Therefore, Google likes to access the CSS and JavaScript files.

WordPress doesn’t block search bots from accessing CSS or JS files. However, there are the occasions when a website owner might accidentally block the search engines bots. This can be done without knowing what they’re doing or when they’re trying to add extra security measures to the website.

This will restrict search engines from indexing your website, and this can impact the success of your search engine performance.

The first thing you need to know is which files on your website Google is struggling to access on your website. Access your Google Search Console (formerly known as Webmaster Tools) and click on the ‘Crawl’ and then ‘Fetch as Google’.

Next you need to click on the ‘Fetch and Render’ button. You need to do this for both desktop and mobile versions.

Once fetched, you can see the results below. When you click on the results, you can see what the user sees and Googlebot.

Compare the two versions and if you notice any differences between the user and Googlebot versions, then you know where the issue was. The difference is where the Googlebot was not able to access CSS/JS files. You will also get the links to the files that the bot was not able to access.

You might also find a list of these resources under the ‘Google Index’ and then ‘Blocked Resources’ tab.

Now you’ve got a list of the resources that can’t be accessed, you can see the links and determine where they are. Most of the time, the CSS and JS files are added by a WordPress plugin or theme.

To fix the error you will need to edit the site’s robots.txt file. This controls the access for Google bots.

To access the file, open up your website’s files with a FTP client. The file will be located within your site’s root directory.

You will see that you site has probably disallowed some access to WordPress directories. Coding like this gives it away.

User-agent: *
Disallow: /wp-admin/
Disallow: /wp-includes/
Disallow: /wp-content/plugins/
Disallow: /wp-content/themes/

It might also contact other files that are being disallowed. All you need to do is to remove the disallow lines from the robots.txt that are blocking access to Google. You might need to remove wp-includes as many scripts for themes and plugins are located there.

Sometimes, you might need to add in:

User-agent: *
Allow: /wp-includes/js/

As some hosting providers will block access to WordPress folders for bots. This is a security feature, but the code above will bypass that.

Once, you’ve made changes, save the file and ensure it is loaded up to your website’s files.