WordPress CSS changes not reflecting immediately – Fixed

Story Highlights

• Wordpress Troubleshooting
• Wordpress CSS Changes
• Wordpress CSS changes not reflecting immediately on the webpage
• No dependency on browser cache

WordPress CSS changes not reflecting immediately – Fixed

This article will help solve your problem if you are not able to see the wordpress CSS changes immediately while creating your personal website or blog. This is article is primarily for wordpress however, will be applicable if you use any CMS with hosting providers.

Note: The console or screens shown below are from ipage however, you can find similar options with your hosting provider also. You can search for hosting service provider documentation in Google.

While creating or managing website or blog if there are any changes that will be made in CSS these changes are not getting reflected immediately, when actual site is visited for checking the changes. No matter even page is refreshed normally or by clearing the browser cache the changes are not reflected.

I am going to provide the steps that one needs to perform to solve this.

While creating or managing website or blog if there are any changes that will be made in CSS, these changes will be stored in the server cache. This cache will be part of hosting space provided by the service provider. Hence, even after trying multiple times, clearing the browser cache will not solve the problem.

Cache: There are two types of caches one is server cache and other is browser cache.

To have the CSS or HTML changes reflected immediately both the cache needs to be cleared. It means you need to have control over both the caches. Normally you will have control on your browser cache however, beginners will not have idea how to control the server cache. Here are the two things that you need to remember to get your changes reflected immediately.

Switching off Server Cache temporarily
You need to temporarily switch off the server caching while you are making the changes. The hosting provider caches the webpages at regular intervals and hence even if you make the change now it will get reflected after particular duration automatically. This is annoying and very difficult if some things needs to be fixed urgently. Hence, here are the steps that you can follow to manage the server cache duration and if required you can temporarily disable it.

• Login to your control panel of hosting provider
• Check where is the option known as “Cache Control”
• Click on it and you will find option “Website Cache”
• Website Cache: The interface looks like as below. It helps you in controlling the server cache. It allows you to turn caching of files off or on, and to select how long you want to cache different file types.
  Note: If you turn the server caching off the website might be slow hence it is recommended post your changes you again turn it on. The recommend setting for your server caching is at least an hour. If you want more granular control of your caching, you can manage your own .htaccess file.

Clear the browser cache

• Make whatever changes required to your webpage
• Go the your webpage URL
• Refresh the page by using Ctrl F5. This will clear the browser cache.
• You can see the changes are reflected
  Note: If sometimes Ctrl F5 does not work you can try clearing the browsing history from “Internet Options” or “Browser Options” available in respective web browsers

I hope that you enjoyed this article and able to solve caching issue in wordpress. Please provide your feedback in comments section or if you need to add anything to this article. Keep the technology moving…