Bootstrap glyphicons are missing

Question

I don't know why, but my glyphicons from Bootstrap (3.3.7) are missing, they are being substituted by a normal and ugly square. Here is an example of code that calls a missing glyphicon:

        <button type="button" class="btn btn-default">
          <span class="glyphicon glyphicon-star" aria-hidden="true"></span> Star
        </button>

And here it is the Bootstrap part that contains glyphicon's font:

 @font-face {
  font-family: 'Glyphicons Halflings';

  src: url('../fonts/glyphicons-halflings-regular.eot');
  src: url('../fonts/glyphicons-halflings-regular.eot?#iefix') format('embedded-opentype'), url('../fonts/glyphicons-halflings-regular.woff2') format('woff2'), url('../fonts/glyphicons-halflings-regular.woff') format('woff'), url('../fonts/glyphicons-halflings-regular.ttf') format('truetype'), url('../fonts/glyphicons-halflings-regular.svg#glyphicons_halflingsregular') format('svg');
}

Can you show the part of your code that links to the glyphicons or bootstrap files? — Blue Boy, Mar 27 '17 at 01:36
@BlueBoy Thanks man, but already solved my problem! However, I left the part of glyphicon's font from bootstrap — Vithor Escames, Mar 27 '17 at 01:58

score 6 · Accepted Answer · answered Mar 27 '17 at 01:40

6

you need to update it , use cdn link, add this to your code

 <link href="http://netdna.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet">

answered Mar 27 '17 at 01:40

Otávio Barreto

1,536
3
16
35

I'm a newbie here and not able to upvote, but I already marked it as right! – Vithor Escames Mar 27 '17 at 01:48
Vlw, sou brasileiro também, boa sorte! – Otávio Barreto Mar 27 '17 at 01:52

score 1 · Answer 2 · edited May 20 '20 at 18:06

1

You need to download Bootstrap in this link https://getbootstrap.com/docs/4.5/getting-started/download/, after download you need to put the fonts in your project. In the new version don't have fonts in Bootstrap package, but you can download in the older version.

edited May 20 '20 at 18:06

David Newcomb

10,639
3
49
62

answered Jan 09 '18 at 12:41

Vinícius

443
1
8
29

score 0 · Answer 3 · answered Oct 17 '22 at 14:44

The same thing happened to me when I added caching. VS updated the web config with

            <clear/>
            <clientCache cacheControlMode="UseMaxAge" cacheControlMaxAge="00:01:00" />
            <mimeMap fileExtension=".jpg" mimeType="image/jpg"/>
            <mimeMap fileExtension=".png" mimeType="image/jpg"/>
            <mimeMap fileExtension=".css" mimeType="text/css"/>
            <mimeMap fileExtension=".js" mimeType="text/javascript"/>

When you remove or comment-out these lines, the glyph icons display again.

Bootstrap glyphicons are missing

3 Answers3

Linked