Magento adds querystring parameter to CSS and JS

Question

How to add querystring parameter for each CSS and JavaScript in HTML to clear CSS and JavaScript cache. I tried

<action method="addCss"><stylesheet>css/style.css?123</stylesheet></action>

and

<action method="addItem"><type>skin_css</type><name>css/styles.css?123</name><params/></action>

. But each time it returns a basic package, for example

http://www.example.com/skin/frontend/base/default/styles.css?123

not my custom themes directory.

How to solve this?

Answer 1

When you add a css file through xml layout updates, the addCss action (which actually only calls the addItem action with the type set to skin_css ) looks for the file path, not the URL. Although the query strings are valid in the URLs, they are not specified in file names. Magento sees this as an invalid parameter, gets confused, and returns to base/default .

I can think of 2 solutions for this. Unfortunately, both are hackers.

• Move the css file to the default base theme. It works, but it depends on backups, which may not remain the same in other versions of magento.

• instead of directly pasting the css file, create a phtml template file with the html code to insert the css file. Then insert the core/template block with this new template file as its template into the xml layout. I used this method on sites that I develop to solve this problem.

Answer 2

This free extension should do what you want - works fine for me:

https://github.com/jreinke/magento-suffix-static-files

Answer 3

as a follow-up answer to this question, I found the following (paid) magento extension that does what you need:

http://www.magentocommerce.com/magento-connect/clear-css-and-javascript-cache.html

Answer 4

Here is what we do:

 <reference name="head"> <block type="core/text" name="link.tags"> <action method="setText"> <text> <![CDATA[<link rel="stylesheet" href="/css/style.css?v=2">]]> </text> </action> </block> </reference> 

Got this idea along with some useful things from 5 useful tricks for your Magento local.xml .

Alternatively, you can always simply rename the file from style_v1.css to style_v2.css , etc. when you make changes - it has the same effect as changing style.css?v=1 to style.css?v=2 .