Como desabilitar o estilo inline: global-styles-inline-css no site WordPress

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>

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!

Teremos o maior prazer em ouvir seus pensamentos

Deixe uma Comentário


Temas Blog
Logo