c-topp

Tvinga CSS-ändringar att synas direkt


css-on-the-fly

Om du tillhör dem som gärna ändrar utseendet på din blogg och i detta fallet om du ändrar i din css, kommer här ett mycket bra tips jag läste på denna blogg.

Du har säkert märkt att när du ändrar ditt temas style.css måste du tvångsuppdatera browsern för att se ändringarna (shift+F5). Anledningen till detta är att browsern lagrar en lokal kopia av din CSS på hårddisken. Beroende på hur servern är konfigurerad kan det ta flera timmar eller dagar innan browsern kollar efter style.css igen! Du själv kan självklart köra en ‘force reload’ men det är inte säkert att dina besökare gör det.

Genom att versionshantera CSS-filen kollar browsern att den har den senaste versionen. Versionshanteringen gör du genom att lägga till ?v=123 till URL:en där du anger länken <link /> till ditt stylesheet. 123 representerar versionen. Det tråkiga är att du då måste sätta en ny version varje gång du gör en ändring.

Om du istället gör enligt följande behöver du aldrig mer tänka på uppdateringsproblemet:

<link rel=”stylesheet” href=”<?php bloginfo(‘template_url’); ?>/style.css?v=<?php echo filemtime(TEMPLATEPATH . ‘/style.css’); ?>” type=”text/css” media=”screen, projection” />

Detta lilla trick uppdaterar ?v= delen varje gång du ändrar din style.css. Aldrig mer force reload och dina besökare ser dina ändringar ögonblickligen!


, , , ,

No comments yet.

Kommentera