

Curious about how the code looks? Here it is:Ī = document.getElementsByTagName('link') It doesn’t rely on jQuery or any other libraries. The bookmarklet works regardless of any specific JS setup on the page. Click the bookmark whenever you need to force-reload all CSS files on a page. To use it on any page drag the button to your bookmarks toolbar. The page flickers for a bit while the CSS reloads and you’ll have fresh copies of all CSS. It works in all browsers and on all pages regardless of their server-side setup. Because of the rnd part, neither the browser or the server have that request in the cache and are forced to grab a fresh copy of the file! Simple, fast, universal and clean solution!ĭrag the button below to your bookmarks bar, and you’ll be able to force reload CSS on any page.

Changing /some-path/style.css to /some-path/style.css?rnd=132 forces the browser to re-request the file from the server. With the magic of a few lines of JavaScript, we find all CSS files referenced on the page (all elements) and then change their URLs. Credits for it go to Paul Irish who wrote about the method back in 2008. That’s the whole premise behind our solution. Requesting file.css and file.css?rnd=23 will get you the contents of the same file but those two requests are not the same! Both the browser and the server see them as requests for two different resources. You can, however, trick it to grab a fresh copy of the file for you – and that’s what our solution does. In most cases, you’re not the admin, and you can’t affect the server’s behavior.

Although not practical, if you’re the admin you can always clean the cache. Instead of grabbing a new version of the file from the base source it continues to serve the version from the cache. The term server, in this case, covers anything that’s responsible for delivering files to you – a server, a CDN, a proxy. The server doesn’t want to send a fresh copy of the file The procedure is very hosting-company-specific but open the control panel, hit Ctrl+F and enter “cache”.

Before you dismantle the site into tiny pieces try disabling the server cache. Cache doesn’t throw anything good into the mix either. In Chrome, you can do a hard reload by opening the console (F12 key) and then right-clicking on the reload button to get a menu with additional reload options.ĭebugging a live site is rarely a good idea. The problem is, in most cases, easy to solve – do a force reload (hard reload, forced reload – it’s all the same thing) and if needed empty local cache. Problematic files are usually CSS, JS, and images, but it’s not limited to any specific file-type as everything depends on the headers which control the request (file) lifetime. It doesn’t want to request a new file from the server. The browser has a copy of the file in its cache and continuously serves it to you. The browser doesn’t want to request the new fileĪnything browser related is a local problem. There are an unlimited number of reasons why cache won’t purge, but they all fall into two categories 1. Problems occur when we want to get around the cache and grab a fresh copy of the file. It lowers resource usage on all levels and enables us to surf faster. What causes the problem?Ĭache is a wonderful thing.
FORCE RELOAD PAGE FIREFOX OS X INSTALL
To top it all off, using WP Reset you can create database snapshots that you can then restore taking your site back to a previous state, and plugin (+theme) collections which you can install after a reset also with just a click.īut enough about that, let’s get back to talking about cached CSS files. It comes with a ton of resetting tools, ranging from a nuclear reset that will wipe your entire site clean, to partial resets that will remove things like plugins, themes, users, widgets, content, and so on. WP Reset is a plugin that will enable you to reset your entire site or just aspects of it by simply pressing a button. Speaking of one-click solutions that can get you out of frustrating situations. Can’t get a CSS file to reload? Are you continuously getting a cached version? Here’s a simple trick to get around even the most stubborn caches.
