Github Pages doesn't show my index.html

Question

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.

Answer 1

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>

Answer 2

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.