I recently added SSL to my website but it keeps giving me the error:
Mixed Content: The page at 'https://youtubehulp.nl/comingsoon/' was loaded over HTTPS, but requested an insecure stylesheet 'http://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,400italic,600,600italic,700,700italic,900,900italic'. This request has been blocked; the content must be served over HTTPS.
While the link to the fontsheet is https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,400italic,600,600italic,700,700italic,900,900italic
I also tried downloading the file and then loading the local version but that didn't work either.
Tried code:
<link rel="stylesheet" type="text/css" href="https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,400italic,600,600italic,700,700italic,900,900italic">
<link rel="stylesheet" type="text/css" href="//fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,400italic,600,600italic,700,700italic,900,900italic">
<link rel="stylesheet" type="text/css" href="font.css">
#import url("//fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,400italic,600,600italic,700,700italic,900,900italic");
#import url("https://fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,400italic,600,600italic,700,700italic,900,900italic");
Also made sure all links in the font file are HTTPS
I hope someone can help me with this.
You have a simple typo in your stylesheet https://youtubehulp.nl/comingsoon/css/style.css:
#import url("https//fonts.googleapis.com/css?family=…");
^^
The : is missing after the protocol name. Therefor, it is a relative URL, and when the browser makes an absolute URL out of that using the current URL, the result naturally is https://youtubehulp.nl/comingsoon/css/https//fonts.googleapis.com/css?family=Source+Sans+Pro:300,300italic,400,400italic,600,600italic,700,700italic,900,900italic
And requesting that URL makes your server issue a redirect to http://www.youtubehulp.nl/comingsoon – and that is the origin of the mixed content warning.
Related
I just recently bought a porfolio template and try to install it onto github pages. It will only show the background but there will be no images or text.
Note that your Github Pages site is hosted over https and your template is including plain text http links to resources. You cannot safely load plain text http resources in a secure https connection. You need to fix the error messages such as:
Blocked loading mixed active content http://fonts.googleapis.com/css?family=Lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic”
Note the conversion from http to https in the following links:
<link href='https://fonts.googleapis.com/css?family=Lato:100,300,400,700,900,100italic,300italic,400italic,700italic,900italic' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Lilita+One' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Alegreya+Sans+SC' rel='stylesheet' type='text/css'>
<link href='https://fonts.googleapis.com/css?family=Montserrat' rel='stylesheet' type='text/css'>
And there's another with the jQuery link:
<script src="https://code.jquery.com/jquery-latest.min.js"></script>
On a related note, your repository is missing the magnifique popup library. You can replace the URL with a link to a CDN. For example, change this line...
<script src="js/jquery.magnific-popup.min.js"></script>
to this line...
<script src="https://cdnjs.cloudflare.com/ajax/libs/magnific-popup.js/1.1.0/jquery.magnific-popup.min.js"></script>
It's loading your index.html just fine, the problem is that your webpage is loading resources over insecure http when github defaults to using secure https, this results in mixed content errors so a bunch of other resources are failing to load.
Currently I use font awesome well on the path http: // but it does not work on the url WWW.
The problem is due to the domain config URL WWW?
When you type in www, your browser may instead be using the HTTPS protocol, and font-awesome will not load because your browser is refusing to GET the font-awesome file through HTTP.
If your link is HTTP only, as in:
<link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
Then it may only work when you force it by going to your website through HTTP.
You can try to change it to //...:
<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">
This allows both HTTP and HTTPS protocols.
I have a standard page, with the following code on
<head>
<link href="http://path.to/stylsheet.css" rel="stylesheet">
</head>
However when I load the page via https and force https traffic through ReWrite conditions the stylsheet fails to load
Any Ideas?
Thank's in Advance
-C
Access your stylesheet over HTTPs as well.
<link href="https://path.to/stylsheet.css" rel="stylesheet">
All files in a site must be references as https if you intend to use it.
The syntax below allows your stylesheet to be loaded via whatever protocol your site is accessed through (assuming the stylesheet is accessible via http and https:
<link href="//path.to/stylsheet.css" rel="stylesheet" />
I was trying to host my css files on an cloud storage service but when I linked it to my website it was not executed,
so i created an small css which just changes background but yet it doesn't works.
It seems there is some problem with its server will you please tell me what could be the problem and how to use it as css
link of css file http://copy.com/Kgs8EaMF71Qa7zqo/style.css
HTML Code
<link href="http://copy.com/Kgs8EaMF71Qa7zqo/style.css" rel="stylesheet" type="text/css" />
https://developer.mozilla.org/en/docs/Incorrect_MIME_Type_for_CSS_Files
At least Gecko has a security feature for this: All stylesheets not from the same origin must be served with text/css.
In fact, you're file is served as text/plain, so the rules in it are ignored.
Due to security reasons MIME type of files hosted on copy.com is served as text/plain
So an normal link like of CSS file from copy.com will not work.
But if you still want to host your css files on this cloud storage service you can by adding ?download=1 after your link so you html should be like
<link href="http://copy.com/Kgs8EaMF71Qa7zqo/style.css?download=1" rel="stylesheet" type="text/css" />
there are several other cloud service like Dropbox,Google Drive where you can host your external CSS files.
I think, it may be due to MIME type, you uploaded assuming it will work as css file but its actual MIME type will be plain type text/plain but required MIME type to make it work as css file is text/css
So It Wont work.
This file worked perfectly for me.
here is the html code with the output.
<html>
<head>
<link href="http://copy.com/Kgs8EaMF71Qa7zqo/style.css" rel="stylesheet" type="text/css" />
</head>
<body>
</body>
</html>
hello i have a problem with my 404 error handling.
i added to htaccess:
ErrorDocument 404 /404.php
so in case of typing something like:
www.domain.com/abc
everything works fine with my php page. the problem will be when typing something like:
www.domain.com/abc/
means adding a slash to the url the 404 error page appears but doesn*t load the css file?
if there is someone who could tell me whats going wrong over here, i really would appreciate.
thanks alot.
Since the 404 page will be displayed from any URL, you will need to use absolute paths for any external page assets like CSS files, images, JavaScript files, etc.
So any relative paths...
<link type="text/css" rel="stylesheet" media="screen" href="site.css" />
will need to be changed to absolute paths...
<link type="text/css" rel="stylesheet" media="screen" href="/site.css" />