How to fix "load unsafe scripts"? - github

Question

so I'll start from the very beginning.
Basicly I purchased a template off themeforest and I manually edited the code in a markup editor to match my preferences.
As I was finished, I decided to host my website on github pages - I uploaded my code directory to a repository as you do.
Here's a link to my repository:
https://github.com/KristofferHari/kristofferhari.github.io
Here's a link to my current website URL:
https://kristofferhari.github.io/ (As you can see, everything's kinda buggy)
So I managed to contact the seller and this is what I was provided with:
The reason for that is because the resources are using a http connection and they can’t be loaded on https connection website. So
you have to upload all the resources (scripts/stylesheets) to github
in order to use them on github.
So I suppose that through my browser, I am trying to connect to my website through a https connection rather than an http. (Is this what is actually causing the problem, and what's the difference between a http connection and a https?)
Secondly, how would I upload all my resources (scripts/stylesheets) to github?
Thanks in advance!

Answer 1

There is a relatively simple solution: to use a protocol-relative URL format.
e.g. your error
Mixed Content: The page at 'https://kristofferhari.github.io/' was loaded over HTTPS, but requested an insecure stylesheet 'http://fonts.googleapis.com/css?family=Open+Sans:400,700,300,900'. This request has been blocked; the content must be served over HTTPS.
The problem is you are loading
http://fonts.googleapis.com/css?family=Open+Sans:400,700,300,900'
from
https://kristofferhari.github.io/
The page is secure (HTTPS), but it's loading insecure content (HTTP).
To fix it, you basically need to change the stylesheet to:
https://fonts.googleapis.com/css?family=Open+Sans:400,700,300,900'
But a more flexible solution is to use a protocol relative format:
//fonts.googleapis.com/css?family=Open+Sans:400,700,300,900'
which will then work on either http or https.
Apply this change to all included resources.