How to fix Facebook share issues related to autoptimize inline css?

The problem is that autoptimize inlines the styles before the meta tags and sometimes when the inlined css is too large facebook can’t properly read them.

The solution is a small code sniplet that inserts the inline css after the meta tags. This code sniplet needs to be added into a child theme functions.php file.


add_filter('autoptimize_filter_css_replacetag','fix_css_replacetag',10,1);
function fix_css_replacetag($replacetag) {
return array("</head>","before");
}

If after adding this code there is visual problems, check your custom css and place it inside child themes `style.css` file and that should do the trick.

If adding code sniplet is too hard for you you can use this plugin