1 of 6

Fixing the Home Icon

English 3844, Fall 2016

Traci Gardner

Slide text is licensed under CC-BY-SA 4.0.

Home icon from Font Awesome is licensed under SIL OFL 1.1

2 of 6

Internet Protocols

​

HTTP

HyperText Transfer Protocol

HTTPS

HyperText Transfer Protocol Secure

Secure protocols must match within a file to display.

For example, if you embed content (like a CSS file) on a page, it has to use a secure protocol.

3 of 6

See the Error!

Note the Home shows if you go to http://github.tracigardner.com/1-column-template/

But not if you go to https://github.tracigardner.com/1-column-template/

You can Inspect the page to see the error on the HTTPS version.

​

4 of 6

Fix the Error by Adding an S

Wherever there is a link to the Font Awesome stylesheet change http:// to https://

<link rel="stylesheet" id="font-awesome-css" href="https://maxcdn.bootstrapcdn.com/font-awesome/4.6.3/css/font-awesome.min.css?ver=4.6.1" type="text/css" media="all" />

5 of 6

Pages You Will Need to Edit

  • navigation/menu.html
  • index.html
  • Any additional pages you have made.

6 of 6

Restoring the Icon

If you replaced the Home icon with the word "Home" or something similar, edit your navigation/menu.html file

Change�<li><a href="../index.html" target="_parent">Home</a></li>

to �<li><a href="../index.html" target="_parent">�<i class="fa fa-home fa-2x"></i></a></li>

​

​