Font Awesome Icon Picker in Bootstrap

Font Awesome Icon Picker

Create a font awesome icon picker easily using font awesome plugin in bootstrap. If you are using bootstrap and you have something knowledge of JS then you can do it quickly in your web page. I have done it using fontawesome-iconpicker.min.css and fontawesome-iconpicker.js lick in my local sever(xampp).

fontawesome-iconpicker.js is a simple plugin which allows the user to select Font Awesome icons from a filterable dropdown popup, Where you can search any Font Awesome icons and choose anyone that icon class show in your input box. When an icon is selected, the plugin will automatically fill the input field with the corresponding icon class. If you wish, you can store those icon class into the database and show anywhere on your page to fetch icon class from the database.

Create a form

First, create a simple bootstrap form, you can create only an input box to check it. I have created a form you can create the same form on your web page. You try it in your local server(xampp, wamp). Form example code:

1

2

3

4

5

6

<form>

<div class="form-control">

<input type="text"name=""class="form-control social-icon">

</div>

<input type="submit"class="btn btn-primary"name=""value="submit">

</form>

CSS file

Use fontawesome-iconpicker.min.css link to display Font Awesome icons in a filterable dropdown popup. I have use bootstrap.min.css and all.css CDN link these link help to display icons properly and you have knowledge of bootstrap, so I will not say anything more about bootstrap. Apply these CSS link, I will provide you a link to download these CSS and JS link with demo code.

JS file

As well as you have to use jquery.min.js with bootstrap.min.js and fontawesome-iconpicker.js. Because you need to initialize the jQuery code to display icon filterable dropdown popup on an input box. Add below JS link and jQuery code on your web page.

I am working as a Web Developer for the last 4 years, and the projects I’ve been involved in have ranged from simple web applications used by thousands of users every day. Most of the applications that I’ve worked on are still in use today. Whenever I've worked on a team with other engineers and blogger that help people learn more.

Hi
Do you want to make web application with php and php framework(CI, Laravel)? Want to make android application with hybrid framework ?
Then contact with us.
We provide support for developing website and web application at very affordable price.
E-Mail us at: dataflow1117@gmail.com