O estilo global-styles-inline-css está te incomodando? Depois de algumas versões mais recentes, principalmente WP 5.9 foi adicionado logo após a tag <bod> algumas linhas de CCS inline, para inchar o código-fonte dos sites que não utilizam este recurso, principalmente aqueles como eu, que não utiliza o editor Gutenberg. Isso, no entanto, é um desperdício de banda, SEO e tudo mais que você pensou.
Neste pequeno artigo, vamos mostrar um código para você remover definitivamente este pedaço de estilo CSS que agora temos que engolir do WordPress. Ele á parecido com isso:
<style id="global-styles-inline-css"> body{--wp--preset--color--black: #000000;--wp--preset--color--cyan-bluish-gray: #abb8c3; --wp--preset--color--white: #ffffff;--wp--preset--color--pale-pink...}só que muito mais longo, é claro. </style>
Índice
Remover global-styles-inline-css no WordPress
Para WordPress 5.9 ou posterior, esta página explica como desabilitar global-styles-inline-css, que agora é gerado no head.
Basta copiar este pequeno trecho de código e colar no arquivo functions.php
do seu tema.
//desabilitar css inline de gutenberg add_action( 'wp_enqueue_scripts', 'remove_global_styles' ); function remove_global_styles(){ wp_dequeue_style( 'global-styles' ); }
Isso irá remover definitivamente o estilo inline: style id='global-styles-inline-css' do código-fonte do seu site WordPress. mas pensando bem, eu nem diria definitivamente, porque o WordPress sempre trabalha para atrapalhar algumas implementações e não vai ser diferente com esta.
também encontrei este outro script aqui. Ele pode remover a biblioteca de temas Gutenberg no front-end junto com a injeção em linha e vai lhe salvar de uns 70 KB adicionais no DOM. Remova apenas se não for necessário.
//Remove também o CSS Block Library do carregamento no front-end function remove_wp_block_library_css(){ wp_dequeue_style( 'wp-block-library' ); wp_dequeue_style( 'wp-block-library-theme' ); wp_dequeue_style( 'wc-block-style' ); // REMOVE WOOCOMMERCE BLOCK CSS wp_dequeue_style( 'global-styles' ); // REMOVE THEME.JSON } add_action( 'wp_enqueue_scripts', 'remove_wp_block_library_css', 100 );
Também é possível remover todo o CSS online de um site WordPress. Veja a seguir:
Como remover o CSS embutido do post junto no WordPress
Eu achei outra opção no próprio forum do WordPress, que promete desabilitar todos os recursos de CSS do Front-End e você também pode adicionar ao seu arquivo functions.php. É importante limpar o cache do site, especialmente se você usa algum plugin de cache, ou um CDN.
remove_action( 'wp_enqueue_scripts', 'wp_enqueue_global_styles' ); remove_action( 'wp_footer', 'wp_enqueue_global_styles', 1 );
O script acima pode ser adicionado em functions.php e depois verifique a ação dele. No meu site não funcionou, mas para remover todo o CSS inline eu recomendo usar o plugin Autoptimize que além disso ele otimiza seu código, minimiza HTML, CSS e Javascript e otimiza o carregamento das fontes do Google.
Minhas pequisar rederam isso que eu encontrei no GuitHub
Para a versão 5.9.1 global-styles-inline-css
remove_action( 'wp_enqueue_scripts', 'wp_enqueue_global_styles' ); remove_action( 'wp_body_open', 'wp_global_styles_render_svg_filters' );
Para a versão 5.9.0 ou inferior
remove_action( 'wp_enqueue_scripts', 'wp_enqueue_global_styles' ); remove_action( 'wp_footer', 'wp_enqueue_global_styles', 1 );
Se por algum motivo o código não funcionar, use um código como este
function custom_wp_remove_global_css() { remove_action( 'wp_enqueue_scripts', 'wp_enqueue_global_styles' ); remove_action( 'wp_body_open', 'wp_global_styles_render_svg_filters' ); } add_action( 'init', 'custom_wp_remove_global_css' );
OU
function custom_wp_remove_global_css() { remove_action( 'wp_enqueue_scripts', 'wp_enqueue_global_styles' ); remove_action( 'wp_footer', 'wp_enqueue_global_styles', 1 ); } add_action( 'init', 'custom_wp_remove_global_css' );
É isso!