“Try resetting your cache.” What does that mean?! Read this article first as it applies to 80% of caching issues. If this doesn’t help, read this As server side caching, not browser caching, could be because of your issue.

Resetting your cache in WordPress is one of the most common ways to fix formatting issues (as well as other problems) on your site. When helping others troubleshoot on Facebook or Reddit, it's our go to comment, because the cache is typically the cause of many simple issues. However, you may not understand what resetting your cache actually means, what it does, or how to do to do it.

We created this tutorial to act as an all-in-one guide on “Resetting Your Cache” in WordPress. Use the table of contents to the left of this post to easily navigate between sections.

What’s A Cache?

A cache is a collection of temporary files stored locally.

There are many different types of caching implementations, but when discussing WordPress caching we usually are talking about a “browser cache”.

A browser cache stores local copies of some components that make up web pages. These components typically consist of CSS stylesheets and HTML. When a visitor accesses your website for the first time, these files are downloaded onto their computer. That way, when a visitor comes back for a second time, the website loads faster because the majority of the files are already downloaded.

Typically, a cache will be applied to static components of a website, like Logos, Styling and other things that don’t change often. Dynamic components of the website will not have a cache, as they are constantly being updated with new content. If dynamic components did have a cache, the browser would be loading old data that is stored locally instead of new data that has recently been published on your website.

These files are opened nearly immediately, resulting in a faster perceived loading time of the respective page. Using a cache also reduces the number of requests that a website makes to a server when loading for repeat visitors.

This is especially helpful in a low bandwith environment, such as a 3G mobile connection please it takes awhile to download images and styling, so instead of doing it over and over again, the browser only does it once.

Browser caches have different expiration dates. When a cache expires, the locally stored files are deleted from the hard drive. Expiration dates for cashed assets typically change depending on what they are. For example:

• Truly static content (global CSS styles, logos, etc.) - access plus 1 year
• Everything else - access plus 1 week

With the above example, global CSS styles will be purged from your hard drive if not accessed for one year. If you access it in 2020, in 2021 the browser will download a new version of that asset for the website.

With WordPress, caches can be included with your hosting setup, or installed and configured manually. Again, this is referring to “browser caching”. If this article doesn’t help, read this: Server Side Caching Could Be The Cause Of The Issue.

Common Issues Caching Causes

We already know that browser caching results in a faster loading webpage for repeat visitors. That's definitely a benefit. However, caching can also cause many issues and is typically would be leading reasons you're experiencing trouble with your WordPress website.

When discussing caching issues in this article, we will only be taking a look at those that apply to WordPress designers and developers.

When using a cache on your WordPress website, the biggest issue that arises are changes seemingly not being applied to your site. Let's use a really simple example.

Say that you have specified the background color of all of your pages by using CSS:

Body {background-color:#ff0;}

you recently changed that color:

Body {background-color:#000;}

However, those changes are not showing up when you load your website in your browser. Why? The answer, like our example, is really simple. When loading the front end of your website in your browser, you're actually loading a cashed version of the site created the cached version of the site includes the OLD CSS stylesheet. It still dictates that the body background should be red, and not black.

Even though the changes have been made to the new version of your website, they may not be automatically applied to the website that you are viewing on your browser. This is true for any browser that has accessed your site in the recent past, as all browsers take advantage of browser caching (discussed above).

if you can, use somebody elses computer or a browser that you know has not loaded your website. Because it doesn't have a cache, it will load the newest version of your website, and you should see the changes applied.

The above example was incredibly simple, but this is the underlying cause of most WordPress issues. “My website isn't updating, even when I update it???” is a very common question, and the cache is the cause.

If you're using a page builder, or another plugin that has to do with formatting or styling, and you're experiencing this issue, the cash is the cause of it. Most, if not all plugins will apply styling using CSS. No matter how complicated, CSS is typically cached (with an expiration date of one week-1 year).

And, as discussed above, caching doesn't just apply to CSS, it can also apply to HTML and additional elements.

Other common issues include:

• If you are using a social media plugin to display posts from Instagram, Facebook, or other platforms, it may not be updating on the front end of your website.
• Making changes to posts or pages may not display immediately on the front end of your website.
• Specific plugins that need to update in the background, like events calendars may not display new entries.
• changing your site logo, CSS, or anything else in the core “customizer” may not seem to apply to the front end of your website.

How To Figure Out If You Have A Browser Cache For Your Site

It's fairly easy to figure out if your WordPress website has a cache. First, if you have installed a speed optimization plugin for your website, its main feature is typically browser caching. Plugins include:

• WP Rocket
• W3 Total Cache
• Autoptimize

Hosting solutions may also automatically apply browser caching. Both Bluehost and GoDaddy are examples of this.

All of these plugins and hosting solutions actually do the same thing, which is edit the .htaccess file to tell browsers that they should cache specific assets in the website.

If you can't figure out if you have caching by looking at your plugins and hosting, simply navigate to the .htaccess file in your cPanel file browser or FTP, and see if it looks anything like this:

Here, you can see organized caching rules. When the browser loads the page, it understands that it should save images, videos, CSS and JavaScript, and other file types locally for the specified amount of time.

What Does Resetting Your Cache Do?

Resetting your browser cache delete the locally stored copies of your website, and loads fresh ones from the server. The freshly loaded website will display all changes made to it. At the same time, it will load slower than a cached version (Because of increased HTTPs requests and the need to download everything).

How To Reset Your Cache

The process of resetting your cache differs between browser to browser. Instead of including the tutorials here, we will be linking to the official documentation of the four most popular browsers:

• Chrome: https://support.google.com/accounts/answer/32050
• Firefox: https://support.mozilla.org/en-US/kb/how-clear-firefox-cache
• Opera: https://www.opera.com/case-studies/clean-browser-and-remove-trackers
• Edge: https://support.microsoft.com/en-us/help/10607/microsoft-edge-view-delete-browser-history

You can also simply search Google for how to clear cache in [Browser name].

Common plugins will also have a “purge cache” button. This typically applies to caching styles that are different from browser caching, but will also tell the browser to clear it's local copies of the pages and refresh them. Clicking this button never hurts when there's an issue with WordPress!

Do You Need A Cache On Your WordPress Site?

You definitely want a cache in your WordPress website, as it will make your pages load much quicker. Just ensure that the expiry dates are set to adequate times. Typically, development issues caused by the cash only arise when you're trying to instantly view changes made from the back end of the website.

This article should have explained what browser caching in WordPress is. There are other types of caching like page caching, server side caching, and more which will be discussed in other articles. If clearing your browser cache doesn't help with your issue, take a look at our page cache and server cache articles.