CSS ne se met pas à jour dans le navigateur quand je le change

Je travaille sur le CSS de mon site wordpress. Lorsque j'apporte des modifications et actualise la page, les modifications ne sont pas reflétées. Lorsque j'efface l'historique du navigateur et le cache, les modifications sont toujours reflétées. Quand je vois le code source de la page et regarde le fichier css, il a l'ancien contenu avant le changement. Comment obtenir cette mise à jour pour que je puisse développer?

Ajoutez un numéro de version aléatoire à la fin du fichier css que vous joignez. Si vous utilisez les fonctions ' wp_enqueue_style ' ou wp_register_style , passez un nombre aléatoire (version) rand(111,9999)au 4e paramètre. Si vous joignez css en tant que balise html, vous devez ajouter " ?ver=<?php echo rand(111,999)?>" à la fin du nom de fichier. Des exemples sont ici

wp_register_style( 'custom-style', get_template_directory_uri() . '/css/custom-style.css', array(), rand(111,9999), 'all' );

ou

<link rel="stylesheet" type="text/css" href="http://website.com/css/custom-style.css?ver=<?php echo rand(111,999)?>">

Cela évitera la mise en cache à la fin de la mise en cache du client et éventuellement la mise en cache du serveur.

Je sais que ce message a plus d'un an, mais j'ai pensé mentionner que CloudFlare met en cache des fichiers statiques tels que css, js et images pour aider à accélérer les temps de chargement. Quelque chose que j'ai juste pris des heures à comprendre, car j'avais des problèmes avec mes modifications CSS qui ne réfléchissaient pas au rechargement. CloudFlare dispose d'un mode de développement que vous pouvez activer pendant 3 heures. Si vous oubliez de l'activer avant de commencer à apporter des modifications, vous pouvez purger le cache de la gestion cloudflare.

Il est possible que votre hébergeur utilise quelque chose comme Varnish pour mettre en cache la sortie de votre site. J'ai rencontré cela avec le site d'un client hébergé sur un compte d'hébergement partagé à taux réduit. Le seul remède que j'ai trouvé était simplement d'être patient.

Si vous utilisez un thème enfant, il est possible que vous deviez mettre en file d'attente la feuille de style de thème enfant afin de voir les changements immédiatement. Cela a résolu mon problème.

Je veux juste souligner - assurez-vous d'être attentif aux plugins de mise en cache que vous avez installés. WP Fastest Cache , par exemple, peut créer ce problème si vous ne vous souvenez pas de vous connecter au tableau de bord WP et de cliquer sur "Clear Cache -> Delete Cache and Minified CSS / JS" dans le menu de navigation.

C'est peut-être vieux. Mais je dois soutenir quelqu'un qui peut chercher de l'aide. J'ai eu le même problème et j'ai vérifié mes plugins. Il y avait un plugin "w3 total cache" qui accélère le chargement. C'est le plugin de cache côté serveur, donc je l'ai désactivé. Les modifications CSS sont à nouveau visibles en temps réel. Il existe de nombreux plugins de chargement. Vérifiez donc votre liste de plugins et désactivez-les jusqu'à la fin du développement.