invalid-css-stylesheet-jetpack-amp-error

How to Fix Invalid CSS Style AMP Error Due to Jetpack in WordPress

Jetpack is a wonderful plugin for WordPress which is bundled with some great features for novice WordPress users. However, the plugin also adds some CSS codes to the web pages which are not compatible with the new AMP HTML Code and results in AMP Validation errors. Given below is an example of an AMP error generated due to the Jetpack plugin.

invalid-css-stylesheet-jetpack-amp-error

As you can see from the error message, Jetpack is pointed out as the source of the error. Upon clicking on the error, the impacted code opens to the right and displays the following:

invalid-css-stylesheet-jetpack-amp-error-code

I have reached out to Jetpack to fix this problem in their upcoming releases as I find their plugin very useful. However, in the meantime, I had to disable the Jetpack plugin to remove this error message. To disable the Jetpack plugin, from your WordPress admin dashboard, go to Plugins > Installed Plugins and then locate Jetpack and disable it. The site becomes a valid AMP site after the Jetpack plugin is disabled.

A forum post on WordPress.org provides a solution to this problem. By adding the following code on your functions.php file, the problematic jetpack code will be stripped from your AMP pages.

add_filter( 'jetpack_implode_frontend_css', '__return_false' );

This method deals with updating the Functions file of your theme. Any update you make to the functions usually get overwritten during a theme update. As a result, it is strongly advised that you use a plugin like My Custom Functions before using the guide.

Leave a Comment

Your email address will not be published. Required fields are marked *

This site uses Akismet to reduce spam. Learn how your comment data is processed.