Como impedir o cache de folhas de estilo (CSS)

Se você estiver fazendo algumas alterações no CSS do seu site, o cache do WordPress pode atrapalhar ou impedir que você veja o resultado esperado.

Achei no site Green Box 3 maneiras de driblar o cache do WP para ver logo as alterações no site.

1 – Usando o header

Você pode aplicar o código alterado direto no header.php do seu tema. É importante que você faça isso depois da chamada da função wp_head, já que os arquivos CSS são carregados na ordem em que são apresentados.

<head>
 ...
 <?php wp_head(); ?>

 <style type="text/css">
#bottom_logo{
 position: relative; left: -20px;
 }

@media screen and (max-width: 768px) {
 #bottom_logo{
padding-bottom: 20px;
}

}
 </style>
 </head>

2 – Alterando o endereço da folha de estilos

Você pode adicionar um parâmetro a mais no endereço da folha do estilo que seja dinâmico. Assim a cada carregamento de página, o navegador será forçado a ler a folha novamente.

No exemplo abaixo, foi adicionado o ?counter que terá o valor do tempo (em unix time), que será sempre diferente, alterando assim o endereço da folha.

<head>
...

<?php wp_head(); ?>

<link rel='stylesheet' href='<?php echo get_stylesheet_directory_uri();?>/mystyles.css?counter=<?php echo time(); ?>' type='text/css' media='all' />

</head>

3 – Alterando o functions.php

O próprio WordPress oferece uma solução para isso. Quando usar o wp_enqueue_style, que é o jeito certo de se adicionar folhas de estilo a um tema, basta adicionar mais um parâmetro.

O quarto parâmetro define a versão da folha de estilo. Em vez de usar um número fixo, use um valor dinâmico como o time() para forçar o WP a carregar como se fosse algo novo.

wp_enqueue_style( 'louiscss', get_template_directory_uri() . '/mystyles.css', array(), time() );

Deixe um comentário