Pular para o conteúdo

Como evitar que o CSS do teu site fique armazenado em cache

Dica publicada em Javascript / Design
Fábio Berbert de Paula fabio
Hits: 13.894 Categoria: Javascript Subcategoria: Design
  • Indicar
  • Impressora
  • Denunciar
O Viva o Linux depende da receita de anúncios para se manter. Ative os cookies aqui para nos patrocinar.
Não conseguimos carregar os anúncios. Se usa bloqueador, considere liberar o Viva o Linux para nos patrocinar.

Como evitar que o CSS do teu site fique armazenado em cache

Supondo que você está em fase de mudanças de layout e gostaria de evitar que teu arquivo CSS fique armazenado em cache no browser de seus visitantes. Como fazer?

Uma declaração tradicional de uma folha de estilo é assim:

<link rel="stylesheet" href="/css/estilo.css" type="text/css">

O truque pra evitar que o arquivo fique armazenado em cache é adicionar uma variável GET aleatória à URL. Exemplo:

<link rel="stylesheet" href="/css/estilo.css?id=12345" type="text/css">
O Viva o Linux depende da receita de anúncios para se manter. Ative os cookies aqui para nos patrocinar.
Não conseguimos carregar os anúncios. Se usa bloqueador, considere liberar o Viva o Linux para nos patrocinar.

O "como" criar tal variável de modo aleatório fica por sua conta. Se você usa PHP por exemplo, ficaria assim:

<link rel="stylesheet" href="/css/estilo.css?id=<?php echo time(); ?>" type="text/css">

Ou então mude o conteúdo de "?id=xxxx" toda vez que atualizar teu arquivo CSS.

O mesmo conceito vale para qualquer arquivo estático de seu website. Basta fazer com que o link que leva até ele tenha uma variável GET aleatória. Essa variável obviamente será descartada pelo arquivo, mas isso não importa.

O Viva o Linux depende da receita de anúncios para se manter. Ative os cookies aqui para nos patrocinar.
Não conseguimos carregar os anúncios. Se usa bloqueador, considere liberar o Viva o Linux para nos patrocinar.

O comando split

Jogando Xadrez através da Internet com o Linux

Utilizando Fontes TrueType no Linux

Android - Como localizar seu dispositivo via web

Como instalar Opera no Debian 10 Buster

CSS3 - Forçando quebra de linha em URL longa

NVU - Editor HTML visual para Linux

Tamanho das Fontes

Botões com imagem cambiável

Javascript - Criando galeria de imagens com "LIGTHBOX"

#1 Comentário enviado por Thihup em 11/10/2014 - 23:39h
Fabio , eu costumo importar o CSS assim :


<style type="text/css">
@import url('style.css');
</style>


Como posso realizar esse processo ?

[]'s

T+
#2 Comentário enviado por fabio em 12/10/2014 - 01:24h

[1] Comentário enviado por Thihup em 11/10/2014 - 23:39h:

Fabio , eu costumo importar o CSS assim :

...

Como posso realizar esse processo ?

[]'s

T+


<style type="text/css">
@import url('style.css?id=001');
</style>

Espero que ajude!
#3 Comentário enviado por Thihup em 12/10/2014 - 11:34h

[2] Comentário enviado por fabio em 12/10/2014 - 01:24h:

&lt;style type="text/css"&gt;
@import url('style.css?id=001');
&lt;/style&gt;

Espero que ajude!


Cara , funcionou bem , nao sabia que era possivel misturar o PHP dentro de uma importação , mas tudo bem.

Muito obrigado

[]'s

T+

#4 Comentário enviado por fabio em 12/10/2014 - 23:09h

[3] Comentário enviado por Thihup em 12/10/2014 - 11:34h:

Cara , funcionou bem , nao sabia que era possivel misturar o PHP dentro de uma importação , mas tudo bem.



Na verdade não usei PHP, isso é sintaxe do HTML mesmo. Você pode adicionar argumentos a qualquer URL. Quem vai processar as variáveis GET enviadas via URL é que pode ser o PHP, Java, ASP.net, Python, Perl e por aí vai. Neste caso, como não vamos processar nada, o destino foi o arquivo CSS.

Contribuir com comentário

Entre na sua conta para comentar.