Web site icons always show the "Bootstrap" icon in Safari

410 Views Asked by At

I have a site built with Bootstrap 3. I have created all the formats of favicons and apple-touch-icons:

  <link rel="icon" type="image/png" href="assets/images/favicon/favicon_16.png" sizes="16x16">
  <link rel="icon" type="image/png" href="assets/images/favicon/favicon_32.png" sizes="32x32">
  <link rel="icon" type="image/png" href="assets/images/favicon/favicon_57.png" sizes="57x57">
  <link rel="icon" type="image/png" href="assets/images/favicon/favicon_72.png" sizes="72x72">
  <link rel="icon" type="image/png" href="assets/images/favicon/favicon_96.png" sizes="96x96">
  <link rel="icon" type="image/png" href="assets/images/favicon/favicon_120.png" sizes="120x120">
  <link rel="icon" type="image/png" href="assets/images/favicon/favicon_128.png" sizes="128x128">
  <link rel="icon" type="image/png" href="assets/images/favicon/favicon_144.png" sizes="144x144">
  <link rel="icon" type="image/png" href="assets/images/favicon/favicon_152.png" sizes="152x152">
  <link rel="icon" type="image/png" href="assets/images/favicon/favicon_195.png" sizes="195x195">
  <link rel="icon" type="image/png" href="assets/images/favicon/favicon_228.png" sizes="228x228">
  <link rel="apple-touch-icon" sizes="57x57" href="assets/images/favicon/favicon_57.png" />
  <link rel="apple-touch-icon" sizes="114x114" href="assets/images/favicon/favicon_114.png" />
  <link rel="apple-touch-icon" sizes="72x72" href="assets/images/favicon/favicon_72.png" />
  <link rel="apple-touch-icon" sizes="144x144" href="assets/images/favicon/favicon_144.png" />

Yet when I look at a bookmark of my site in Safari, I get Bootstrap icons. I have no idea where those icons are coming from and/or how to override them.

enter image description here

Any ideas?

0

There are 0 best solutions below