When SharePoint's content editor CSS file (HtmlEditorCustomStyles.css) is customized how can I get the updated css file updated on the client browser?
In testing I've found the updated version is ignored in favor of the browser cached version and I've only been able to get the updated version by deleting the CSS file from the browser cache (or just deleting the cache completely).
If you figure out where the CSS file is being included, you can add a URL parameter to the end of the include. For example if you find the include is:
<link type="text/css" rel="stylesheet" href="[some path]HtmlEditorCustomStyles.css">
You can add:
<link type="text/css" rel="stylesheet" href="[some path]HtmlEditorCustomStyles.css?revision=1">
Related
I'm using node.js, express and mysql.
I have successfully followed these instructions to include my css file:
How can I include css files using node, express, and ejs?
The css does load on every page, except one link that contains an id in the url:
http://localhost:8089/edit/123
The last number is passed from the previous page, when the user clicks on an 'edit' link in a table row.
The styling is not loading on this edit page. It does load everywhere else.
My node.js server file:
app.use(express.static(__dirname + '/public'));
The edit.html is in the same 'views' folder as the other pages. The css link is the same in the html:
<link rel="stylesheet" href="css/style.css">
Can someone help what the problem is and how to fix it?
add /
<link rel="stylesheet" href="/css/style.css">
this way it will return to the document root not on here /edit/123/css/style.css
I looked over some of the same questions on stack overflow and tried all the best answers. None of them worked.
I am learning html5 with CSS stylesheet. I looked over a website tutorial of building a web page with login form by flask.
So it has this base.html file which has some code links to a css file:
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>RELAX AND WORKOUT</title>
<link rel="stylesheet" href="bulma.css" />
</head>
Originally, followed by 'href' was a http link and it worked. But I downloaded the same css file and put it in the same folder as the base.html file so I can play with this css file.
They are both at ./project/templates/the_file
This is the link to download the css file: https://cdnjs.cloudflare.com/ajax/libs/bulma/0.7.4/css/bulma.css
It was also originally the tutorial author put after 'href='. But when I changed it to my local file name 'bulma.css', it does not load the stylesheet at all.
I also tried absolute path and relative path. Neither of them worked.
I'm running it on Windows 10. Using Python 3.7 and flask.
So in my case, how do I make the html load this local css file?
Edit:
Ok, I made it work eventually.
I made a new folder called "static" and put the css file inside it. Then I changed the path to this:
<link rel="stylesheet" href="../static/bulma.css" />.
Does it mean flask treats the "templates" folder as a special folder only for html templates, it does not recognize other file formats?
But I saw a question which the person put his css file in the same directory. The answer is to just add a dot and it worked. That was why I put it with all the other html templates in my templates folder. But it never worked in my case.
From flask docs:
Flask automatically adds a static view that takes a path relative to the flaskr/staticdirectory and serves it. The base.htmltemplate already has a link to the style.cssfile:
{{ url_for('static', filename='style.css') }}
You need to create a folder called static inside your flask app directory with your static files inside, ex.: CSS, images, etc.
In your html code use:
<head>
<link rel="stylesheet" href= {{ url_for('static', filename='bulma.css') }}>
</head>
Try changing your href="bulma.css" to href="./bulma.css" and see if it works.
Are you sure you don't have to go into the templates folder? "/templates/bulma.css"
Hit F12 to open up the development pane. Go to the network tab. Refresh the page. Is the file listed in that list? You may have to refresh your cache to have it take effect. To do that: CTRL+SHIFT+R. If the file is listed in there you can view the preview to make sure it's current, if not you will still need to do a force refresh on the cache.
As for URL's you can also use an absolute file path starting at the root with href="../project/templates/filename.css" (use 2 periods). The following is a website for more info on this:
https://www.w3schools.com/html/html_filepaths.asp
i created a html page in pingendo using its drag and drop feature.
3 files were created draft.html, draft.css, draft.less.
I uploaded files on my website on hostinger.
But it only shows the html part and css is not loaded.
what changes should I make in pingendo files to make it work?
Are you linking to the css file sored locally on your machine in your HTML?
IE: <link href="C:\Users\USERNAME\Desktop\web\assets\draft.css" rel="stylesheet" type="text/css">
Rather than directly going to the path of the CSS in relation to your HTML page?
IE <link href="assets\draft.css" rel="stylesheet" type="text/css">
May I have a link to your site to take a look?
can someone explain what is the difference in accessing CSS in browser by putting question mark ? in the end and why the new CSS is not making any affects on Website.
I have deployed a new CSS on web server but its not making any affect.
I tried to open the URL in browser as below:
www.mysite.com/styles/css/main.css
and it loads the older version of CSS.
Then I tried it as below and it loads the new version of CSS.
www.mysite.com/styles/css/main.css?
After doing all this. New CSS change does not affecting the website. Its still displaying the old design.
Kind Regards
You need to add something after the ? then change it when you change the CSS. What is happening is a browser will cache anything that doesn't change for a specific period, it does that by checking file names. so main.css? is still main.css? Anything after the question mark is a query string, generally it's used to pass data to a particular file. In this case it's just used to change the file string so the browser will update it every time it changes without affecting the file itself.
There are a couple of ways you can handle this, the first is manually changing the version, probably the easiest idea if you have a single header file, as in a template system that always loads the same head data.
<link rel="stylesheet" type="text/css" href="assets/css/main.css?ver1/>
Then on next change:
<link rel="stylesheet" type="text/css" href="assets/css/main.css?ver2/>
If you'd rather do it automatically you can add a bit of PHP script to the css line like this:
<link rel="stylesheet" type="text/css" href="assets/css/main.css?time=<?php echo filemtime('./assets/css/main.css');?>" />
This is essentially adding a value that changes every time you save the file and results in something like this, the next time I save the file that time= value will change:
<link rel="stylesheet" type="text/css" href="http://localhost/refficient/trunk/assets/css/main.css?time=1350305706" />
browser cache is the reason,Adding ? after css is not recommended.Open your hosting space and clear cache and thread pool as well.
I got "dump" isp that always cached internet pages and its css for at least 1 day.
Although the css / js in the server changed, the presented css are not changed (i have been clear my cache everytime)
how to "tell" my isp not to cache some files like css and js ?
thank you !!
at the moment: i'm using proxy to check a under developed web so that it don't get cached ..
The way Stack Overflow itself solves this problem is to add a version parameter to the CSS and JS URLs, which refer to the version of the referenced files:
<link rel="stylesheet" href="http://sstatic.net/so/all.css?v=4542">
Every time the referenced files change, the href attribute of the link tag is updated in the HTML code, thus supporting caching and updated referenced files.
You could try to append some random string to every request of an external file like:
<link href="/css/style.css?cachekiller=1337" media="screen" rel="stylesheet" type="text/css" />
where the 1337 in the above code should be generated randomly for every request e.g.
<?php time() ?>
or something
You can include these documents directly in your HTML files, between <script> or <style> tags. It will obviously make all your HTML files bigger, but that's basically what you're asking.
It's the only way you can be 100% sure that your CSS and JS is not cached at all.