Iconpicker for Bootstrap 3.0 By Victor Valencia Rico.

A simple iconpicker

1.- Add the style file bootstrap-iconpicker.min.css

                    <link rel="stylesheet" href="bootstrap-iconpicker/css/bootstrap-iconpicker.min.css">

2.- Add the javascript file bootstrap-iconpicker.min.js

                    <script type="text/javascript" src="bootstrap-iconpicker/js/bootstrap-iconpicker.min.js"></script>

Add role="iconpicker" to initialize the iconpicker.

role="iconpicker"

                    <button class="btn btn-default" role="iconpicker"></button>

Add data-iconset="glyphicon|fontawesome" to idicates the iconset.

data-iconset="glyphicon"

data-iconset="fontawesome"

                    <button class="btn btn-default" data-iconset="fontawesome" role="iconpicker"></button>

Add data-icon="glyphicon-heart" to select an icon.

data-icon="glyphicon-heart"

data-icon="fa-github-alt"

                    <button class="btn btn-default" data-icon="fontawesome" role="iconpicker"></button>

Add data-rows="3" or data-cols="6" to set rows and columns to showing in iconpicker.

data-rows="3" and data-cols="6"

                    <button class="btn btn-default" data-rows="3" data-cols="6" role="iconpicker"></button>

Add data-placement="left|top|bottom|right" to indicate where the datepicker will be display.

data-placement="left"

data-placement="top"

data-placement="bottom"

data-placement="right"

                    <button class="btn btn-default" data-placement="left|top|bottom|right" role="iconpicker"></button>

Add in class="" your custom style.

class="btn btn-default"

class="btn btn-primary"

class="btn btn-success"

class="btn btn-warning"

class="btn btn-danger"

class="btn btn-info"

                    <button class="btn btn-danger" role="iconpicker"></button>

                    $('#convert').iconpicker({ 
    iconset: 'fontawesome',
    icon: 'fa-key', 
    rows: 5,
    cols: 5,
    placement: 'top',
});