L’inspecteur de Chrome permet de modifier le style d’une page déjà en prod sur votre navigateur. En cochant une simple case « Enable local overrides », le changement est enregistré localement.
Cette fonction est très utile pour tester une petite modification de style et la montrer plus tard. Elle reste visible après rechargement de la page. Pour revenir au site réel, décochez la case et rechargez la page.
Comment activer la fonction « Local Overrides » de Chome devTools
Ouvrez l’inspecteur (clic droit « Inspecter » ou F12) et allez dans l’onglet Sources. Vous devriez voir l’entrée « Overrides » dans la partie de gauche .
Si Overrides n’apparait pas dans Sources, il doit être activé dans les réglages. Ouvrez le panneau des réglages (F1) et dans Préférences > Persistence, cochez « Enable Local Overrides »
Retour sur « Sources > Overrides ». Il faut maintenant choisir un dossier pour enregistrer les modifications sur votre ordinateur en cliquant sur « Select folder for Overrides ». Un bandeau apparaîtra ensuite pour vous demandant l’accès complet à ce dossier.
Et voilà !
A présent cochez « Enable Local Overrides ». Changez le style des élements souhaités dans « Elements ». Vous voyez directement le rendu sur la page.
Il existe aussi des extensions pouvant gérer par exemple plusieurs versions d’une même page : par exemple Stylish.