Answers.Body: <p>I tend to use a config.php variable (called assetVersion) for the production site, and just generate a random value for the dev site using Twig's random function. Looks like this:</p>
  
  <pre><code>&lt;link rel="stylesheet" href="/assets/css/style-min.css{{ craft.config.devMode ? '?v=' ~ random() : '?v=' ~ craft.config.assetVersion }}"&gt;
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2020-08-22T03:59:14.420Z
Answers.Text: Nice, clean and simple.
Answers.UserDisplayName: Crafty Cat
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2016-11-20T19:41:52.940Z
Answers.LastActivityDate: 2016-11-20T19:41:52.940Z
Answers.UserDisplayName: Ian Ebden
Answers.Body: <p>This is also possible when using github actions as a deployment tool:</p>
  <p>if you have the link like this:</p>
  <pre><code>&lt;link href=&quot;/theme/css/styles.css?v=TAG&quot; rel=&quot;stylesheet&quot;&gt; 
  </code></pre>
  <p>you can add this to your GitHub action:</p>
  <pre><code>- name: Invalidate Stylesheet
          run: sed -i &quot;s/?v=TAG/?v=$(date +%s)/g&quot; $GITHUB_WORKSPACE/path/to/file.twig
  </code></pre>
  
Answers.ContentLicense: CC BY-SA 4.0
Answers.CreationDate: 2022-08-03T13:04:46.807Z
Answers.LastActivityDate: 2022-08-03T13:04:46.807Z
Answers.UserDisplayName: KSPR
Answers.Body: <p>Funny that you mention DeployBot — I actually wrote a post at DeployBot's blog about solving this exact problem with Craft, DeployBot, and Gulp.js: <a href="https://deploybot.com/blog/adding-fingerprints-to-assets-with-gulp-and-deploybot" rel="nofollow noreferrer">https://deploybot.com/blog/adding-fingerprints-to-assets-with-gulp-and-deploybot</a></p>
  
  <p>This approach doesn't require any Craft plugins, but assumes that you use a task runner like Gulp or Grunt for building your assets.</p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2016-11-21T17:09:34.620Z
Answers.LastActivityDate: 2016-11-21T17:09:34.620Z
Answers.UserDisplayName: efedorenko
Answers.Body: <p>There are several plugins that can do this. </p>
  
  <p>With my plugin <a href="https://github.com/aelvan/Stamp-Craft" rel="nofollow noreferrer">Stamp</a>, you can add a timestamp to the filename or path in the following formats:</p>
  
  <pre><code>&lt;script src="/assets/build/js/1399647655/scripts.js"&gt;&lt;/script&gt;
  &lt;script src="/assets/build/js/scripts.1399647655.js"&gt;&lt;/script&gt;
  &lt;script src="/assets/build/js/scripts.js?ts=1399647655"&gt;&lt;/script&gt;
  </code></pre>
  
  <p>The last one, which is the one you're looking for is made with:</p>
  
  <pre><code>&lt;script src="{{ craft.stamp.er('/assets/build/js/scripts.js', 'query') }}"&gt;&lt;/script&gt; 
  </code></pre>
  
  <p>You can also get only the timestamp, and use it however you want, like this:</p>
  
  <pre><code>{% set timestamp = craft.stamp.er('/assets/build/js/scripts.js', 'tsonly') %} 
  </code></pre>
  
  <p>It's worth noting that you'd ideally want to not use a query string for this, as various frontside proxies could ignore it. But, you need to be able to set up the proper url rewriting in your webserver for the filename and folder versions, so that might not always be possible.</p>
  
  <p>There is also <a href="https://github.com/focuslabllc/craftcms-cachebuster" rel="nofollow noreferrer">Cache Buster</a> from Focuslab which can add a query string, but also supports file revisioning based on a manifest file. </p>
  
  <p>And there's <a href="https://github.com/clubstudioltd/craft-asset-rev" rel="nofollow noreferrer">Asset Rev</a> from Club Studio which is primarily for file revisioning based on a manifest file, but falls back to a query string. </p>
  
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2016-11-12T16:21:33.537Z
Answers.Text: Thanks so much for this André! I will definitely use your plugin.
Answers.UserDisplayName: Magnus
Answers.ContentLicense: CC BY-SA 3.0
Answers.CreationDate: 2016-11-12T15:52:32.223Z
Answers.LastActivityDate: 2016-11-12T16:37:08.763Z
Answers.LastEditDate: 2016-11-12T16:37:08.763Z
Answers.UserDisplayName: André Elvan
Body: <p>Is there any simple way to automatically add a version number when referencing a CSS file?</p>
  
  <p>Example: <code>&lt;link href="style.css?v=VERSION-HERE" rel="stylesheet" type="text/css"&gt;</code></p>
  
  <p>Version could be a timestamp when the style.css was last modified or something like that. </p>
  
  <p>The reason for this is that I often have to tell my clients to force the browser to reload because they don't see the latest changes I've made in style.css. </p>
  
  <p>If it matters, I use Deploybot and github.</p>
  
Tags: <cache><css>
Title: Force browser to download latest CSS file
ThreadText: # Force browser to download latest CSS file
  
  (Asked by: username_0 on 2016-11-12)
  
  Is there any simple way to automatically add a version number when referencing a CSS file?
  
  Example: `<link href="style.css?v=VERSION-HERE" rel="stylesheet" type="text/css">`
  
  Version could be a timestamp when the style.css was last modified or something like that.
  
  The reason for this is that I often have to tell my clients to force the browser to reload because they don't see the latest changes I've made in style.css.
  
  If it matters, I use Deploybot and github.
  
  **Tags:** cache, css
  
  
  ---
  
  ## 4 answers
  
  ### Answer by username_5 on 2016-11-12. Score: 7 | Accepted answer
  
  There are several plugins that can do this.
  
  With my plugin [Stamp](https://github.com/aelvan/Stamp-Craft), you can add a timestamp to the filename or path in the following formats:
  
  ```
  <script src="/assets/build/js/1399647655/scripts.js"></script>
  <script src="/assets/build/js/scripts.1399647655.js"></script>
  <script src="/assets/build/js/scripts.js?ts=1399647655"></script>
  
  ```
  
  The last one, which is the one you're looking for is made with:
  
  ```
  <script src="{{ craft.stamp.er('/assets/build/js/scripts.js', 'query') }}"></script> 
  
  ```
  
  You can also get only the timestamp, and use it however you want, like this:
  
  ```
  {% set timestamp = craft.stamp.er('/assets/build/js/scripts.js', 'tsonly') %} 
  
  ```
  
  It's worth noting that you'd ideally want to not use a query string for this, as various frontside proxies could ignore it. But, you need to be able to set up the proper url rewriting in your webserver for the filename and folder versions, so that might not always be possible.
  
  There is also [Cache Buster](https://github.com/focuslabllc/craftcms-cachebuster) from Focuslab which can add a query string, but also supports file revisioning based on a manifest file.
  
  And there's [Asset Rev](https://github.com/clubstudioltd/craft-asset-rev) from Club Studio which is primarily for file revisioning based on a manifest file, but falls back to a query string.
  
  > **Comments:**
  > **username_0**: Thanks so much for this username_5! I will definitely use your plugin.  
  
  ---
  
  ### Answer by username_1 on 2016-11-20. Score: 6
  
  I tend to use a config.php variable (called assetVersion) for the production site, and just generate a random value for the dev site using Twig's random function. Looks like this:
  
  ```
  <link rel="stylesheet" href="/assets/css/style-min.css{{ craft.config.devMode ? '?v=' ~ random() : '?v=' ~ craft.config.assetVersion }}">
  
  ```
  
  > **Comments:**
  > **username_2**: Nice, clean and simple.  
  
  ---
  
  ### Answer by username_3 on 2022-08-03. Score: 0
  
  This is also possible when using github actions as a deployment tool:
  
  if you have the link like this:
  
  ```
  <link href="/theme/css/styles.css?v=TAG" rel="stylesheet"> 
  
  ```
  
  you can add this to your GitHub action:
  
  ```
  - name: Invalidate Stylesheet
          run: sed -i "s/?v=TAG/?v=$(date +%s)/g" $GITHUB_WORKSPACE/path/to/file.twig
  
  ```
  
  
  ---
  
  ### Answer by username_4 on 2016-11-21. Score: 0
  
  Funny that you mention DeployBot — I actually wrote a post at DeployBot's blog about solving this exact problem with Craft, DeployBot, and Gulp.js: <https://deploybot.com/blog/adding-fingerprints-to-assets-with-gulp-and-deploybot>
  
  This approach doesn't require any Craft plugins, but assumes that you use a task runner like Gulp or Grunt for building your assets.
  
  
  ---
  
  