I've created a Landing page template and linked CSS file to it. During development and testing I have uploaded using "replace" option several version of the CSS file and it worked great. Until yesterday. Any new updates to the CSS file are not shown. I've tried to delete and re-upload CSS file and it is still showing the previous styles and not the new ones. I know that I could rename CSS file and upload it but I already have several LPs in production mode and I don't want to make total mess with the code.
So is it a bug or a caching issue? Anyone have any idea how to solve this?
Hi @hrvoje, Firstly clear your cache and then re-upload the same file. If still issue exists then you have to contact support for the same.
I've run into this before now-and-again. It seems like sometimes "it just works" and other times it doesn't update the cached image of the file and you can't see your updates.
In the times where it doesn't seem to be working, here's a list of the steps I'll take to try and see it load the external stylesheet:
1) Open the file in your browser (click the link to the URL wherever you uploading your file to open it in a tab). This should open a tab where you can see all your CSS in the document inside a browser tab.
2) Do a hard refresh on your browser tab with the file open (on PC, CTRL + F5) - this should reload the file and pull in the most recent copy rather than the cached one. Look for some of the updates you made in the new version of the file to make sure those are coming thru.
3) Open the LP in your browser that's using the updated .css file and then do a hard refresh on that page in the browser as well. This should reload the page without the cache and pull in the most recent version.
For what it's worth - somewhere along the way Marketo started adding a parameter to files uploaded into Design Studio - for example: myfile.css?version=1. I normally remove everything after the "?" when I load something like a .css document onto a template b/c I expect to be updating it frequently. Once you update the file, it changes the parameter to "?version=2".
If you've got something like <link rel="stylesheet" href="myfile.css?version=1"> on your template and then you update and reload the CSS so that now it's "version=2" this might have something to do with the issue you're seeing?
For my own sanity, I'd just load this on the template as <link rel="stylesheet" href="myfile.css"> and just leave out the question mark and everything after it.
The issue you're experiencing is likely due to caching. Here are a few steps you can take to resolve this issue:
A simple force reload can bypass the cache. You can do this by pressing Ctrl + F5 on Windows or Cmd + Shift + R on Mac.
You can append a query string to the CSS file URL to ensure the browser loads the latest version. For example, if your CSS file is styles.css, you can change the link to styles.css?v=1.0.1. Incrementing the version number will make the browser think it’s a new file.
4. Developer Tools - Network Tab
In your browser Developer Tools, you can disable caching while the DevTools is open. Go to DevTools > Network tab > Check Disable cache. This ensures that the latest version of the file is fetched every time.