How to use glyphicons in bootstrap 3.0

Solution 1:

The icons (glyphicons) are now contained in a separate css file...

The markup has changed to:

<i class="glyphicon glyphicon-search"></i>

<span class="glyphicon glyphicon-search"></span>

Here is a helpful list of changes for Bootstrap 3: http://bootply.com/bootstrap-3-migration-guide

Solution 2:

There you go:

<i class="glyphicon glyphicon-search"></i>

More information:

http://getbootstrap.com/components/#glyphicons

Btw. you can use this conversion tool, this will also update the code for the icons:

Solution 3:

If yout download a customized bootstrap 3 distro you must:

Download the full distro from https://github.com/twbs/bootstrap/archive/v3.0.0.zip
Uncompress and upload the entire folder called fonts to your bootstrap directory. Put together with the other folders "css, js".

Example Before:

\css
\js
index.html

Example After Upload:

\css
\fonts
\js
index.html

Solution 4:

If you're using less , and it's not loading the icons font you must check out the font path go to the file variable.less and change the @icon-font-path path , that worked for me.

Solution 5:

Bootstrap 3 requires span tag not i

<span class="glyphicon glyphicon-search"></span>`