Blog

We talked about how to make Jetpack WordPress plugin work with AMP in this post. One of the great benefits of Jetpack is its related post feature. Enabling the related post in Jetpack will display links to relevant contents at the end of your blog post. The location of the related posts can be modified through additional modifications which will be discussed in another future post. Eventhough, the related posts don’t show up in AMP pages, the feature interferes with AMP validation and you will get an error related to jetpack_related-posts.css. This post will discuss how to the Jetpack related posts AMP validation error while still being able to use Jetpack related posts.

How to Fix the Jetpack Related Posts AMP Validation Error

The credit for this cod which fixes the problem goes to CSS-Tricks. Here are the steps:

• Download My Custom Functions plugin. This ensures that you don’t have to mess around with your functions.php file.
• Open My Custom Functions by going to Settings > PHP Inserter.
• Add the code listed below to My Custom Functions PHP code field.
• Turn ON the plugin by clicking on the ON/OFF toggle button.
• Wait for few minutes and run the AMP validation for your post again.

Here is the code to enter:

add_filter( 'jetpack_implode_frontend_css', '__return_false' );
// Then, remove each CSS file, one at a time
function jeherve_remove_all_jp_css() {
wp_deregister_style( 'jetpack_related-posts' ); //Related Posts
}
add_action('wp_print_styles', 'jeherve_remove_all_jp_css' );

This should fix the related posts AMP validation error. Please leave a comment if this post helped you.