Head:
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<link rel="icon" type="image/png" href="favicon.png"/> <!-- Here -->
<title>TITLE</title>
<script src="https://use.fontawesome.com/5aaf8b7460.js"></script>
<link href="https://fonts.googleapis.com/css?family=IBM+Plex+Sans:400,600" rel="stylesheet">
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/css/bootstrap.min.css">
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.5.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.4.1/js/bootstrap.min.js"></script>
<link rel="stylesheet" href="dist/css/style.css">
<script src="https://unpkg.com/[email protected]/lib/anime.min.js"></script>
<script src="https://unpkg.com/[email protected]/dist/scrollreveal.min.js"></script>
My favicon is in the same directory as index.html
However it just shows the favicon as a white page - not working.
How do I fix this?
try this
<link rel="icon"
type="image/png"
href="http://example.com/myicon.png">
See the full url instead only image name :
Source and more info about :
This is not mandatory, but it may affect on older browser, check this https://www.w3.org/2005/10/howto-favicon