The demo pages already include the following code. These steps are only necessary if you are building a page from scratch. Remove these references if you are not using this plugin to improve page load times.
1. Link the CSS right before the head closing tag of your page, where you see the other library scripts. This line should be inserted before main.css.
<!-- jQuery Nice Select Stylesheet -->
<link rel="stylesheet" href="plugins/nice-select/nice-select.css"/>
2. Link the JS before the body closing tag of your page, where you see the other library scripts. This line should be inserted after jquery.min.js and before custom.js.
<!-- jQuery Nice Select js -->
<script type="text/javascript" src="plugins/nice-select/jquery.nice-select.min.js"></script>
Alternatively you may wish to load this resource from a CDN to potentially improve page load times.
<!-- jQuery Nice Select CDN -->
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/jquery-nice-select/1.1.0/js/jquery.nice-select.min.js"></script>
Basic Usage
The Basic Nice Select HTML Structure
<select>
<option data-display="Select">Nothing</option>
<option value="1">Some option</option>
<option value="2">Another option</option>
<option value="3" disabled>A disabled option</option>
<option value="4">Potato</option>
</select>
The Basic jQuery Nice Select activation
$(document).ready(function(){
$('select').niceSelect();
});Consult the jQuery Nice Select Documentation for more details.