GitHub Pages doesn't use updated CSS file #22048
-
I’m using GitHub Pages for my website at this specific site: https://ludomath.net/LA/vectors.html. The problem is that whenever I push new files on GitHub, the CSS files do not update on the site. It just uses an older version. I tried making changes to the HTML file, and that works perfectly, but the CSS file still stays behind and loads an old version. It has been about 1 hour since I pushed the last changes, and it still doesn’t load the new CSS file. Just to be clear: the CSS file is updated on GitHub, but the actual website does not use the updated file. The CSS file can be found here: https://github.com/dexterAndre/LudoMath/tree/gh-pages/Common This problem seems to have many causes and fixes, but none have worked for me, so that’s why I’m asking here. I’m pretty new to web development, so please excuse me if I’m missing something obvious. |
Beta Was this translation helpful? Give feedback.
Replies: 17 comments
-
So I’ve waited for about 3 hours, and finally the changed were made. I worked with some other files in the meantime, but I don’t know if that was the solution. The problem that the HTML file does update quickly, while the CSS file doesn’t update before 3 hours still persists, and I’m still interested in hearing how I can improve the CSS update speed for GitHub pages. |
Beta Was this translation helpful? Give feedback.
-
Hi, When I first started using GitHub pages, I also had the same experience. It is not GitHub’s fault, instead it is your browser. The solution to this is by going to your browser settings and reset cache and cookies. This should work. Another way of doing this is by using Git. You make your changes on your local desktop, and see what the website looks like by opening index.html . Then you can git push it to github and be rest assured that it will be like what you saw in your local desktop. |
Beta Was this translation helpful? Give feedback.
-
I have tried deleting the cookies and resetting the cache in Chrome, but it doesn’t help. Also, I’m using both GitHub for Desktop and also directly modifying the file on the GitHub website itself, but none of these work, unfortunately. |
Beta Was this translation helpful? Give feedback.
-
About 4 hours and no updates happening. The files updated immediately in the repo, but not on the hosted page. Finally the page updated… |
Beta Was this translation helpful? Give feedback.
-
I am experiencing the same problem. When I use git to upload, the changes are only noticeable in incognito mode. But when I upload directly to github, the changes are noticeable after about 5 minutes. |
Beta Was this translation helpful? Give feedback.
-
same problem too yesterdy it takes 12 hour to updat the steelshet |
Beta Was this translation helpful? Give feedback.
-
Just clear the browsing data in the browser settings and it will work. |
Beta Was this translation helpful? Give feedback.
-
Same problem for me too. GitHub pages are not reflecting changes on the github repository. |
Beta Was this translation helpful? Give feedback.
-
Hi everyone! If clearing your cache/removing cookies doesn’t work as explained by @yangciou, I would recommend reaching out to private support with the name and link of the repository you are working with. They should be able to take a closer look. Cheers! |
Beta Was this translation helpful? Give feedback.
-
It happened to me too. What i understand is you need to clear the cache of your browser. I try on other browser it is working fine. Please clear cache and try hope it works… |
Beta Was this translation helpful? Give feedback.
-
Was having the same issue and Ctrl + f5 did the trick for me (refreshes your cache) |
Beta Was this translation helpful? Give feedback.
-
No, that is not the solution. The problem is that the content on gitHub from which the site is built, is not reflected in what github.io serves. There is an unpredicatble delay which can be seconds or hours. |
Beta Was this translation helpful? Give feedback.
-
As the CSS files could also be cached locally, it would be nice if support for https://github.com/tkareine/jekyll-minibundle is added to GitHub pages. minibundle adds a hash of the contents to the filename, so that a different filename is used when changes are made, avoiding the cache altogether for updated files. |
Beta Was this translation helpful? Give feedback.
-
If you have / before you css file remove it. Example <link rel=“stylesheet” href="/main.css" /> won’t work but <link rel=“stylesheet” href=“main.css” /> will work |
Beta Was this translation helpful? Give feedback.
-
I have the same problem. This is some kind of url caching on the server, if you change the url by adding There should be some kind of |
Beta Was this translation helpful? Give feedback.
-
Hello @dexterandre! It definitely sounds like your old version is being cached, and @yangciou, @yuyoux, @nadiajoyce, @jaikangam93, and @csteitz01 are correct in their suggestions. Sometimes a hard refresh of your browser (as opposed to a standard refresh) is necessary to really clear out the old file. Below are some instructions for how to do this in various browsers. Chrome: Option 1: Hold down Ctrl and click the Reload button (Windows) or Shift and click the Reload button (Mac) Firefox: Option 1: Hold Ctrl and press the F5 key (Windows) or Shift and click the Reload button (Mac) Internet Explorer: Option 1: Hold Ctrl and press the F5 key Safari: Press Shift and click the Reload button Additional Resources:Here are some resources on the subject of clearing browser cache: Chrome: Firefox: Microsoft Edge: Safari: |
Beta Was this translation helpful? Give feedback.
Hello @dexterandre! It definitely sounds like your old version is being cached, and @yangciou, @yuyoux, @nadiajoyce, @jaikangam93, and @csteitz01 are correct in their suggestions. Sometimes a hard refresh of your browser (as opposed to a standard refresh) is necessary to really clear out the old file. Below are some instructions for how to do this in various browsers.
Chrome:
Option 1: Hold down Ctrl and click the Reload button (Windows) or Shift and click the Reload button (Mac)
Option 2: Hold down Ctrl and press F5 (Windows) or Cmd and Shift and R (Mac)
Firefox:
Option 1: Hold Ctrl and press the F5 key (Windows) or Shift and click the Reload button (Mac)
Option 2: Hold down Ctrl and Shi…