Select2 4.0.0 Bootstrap Theme

Question

Select2 version has a theme option. However, in the documentation I can not find what this parameter means and how I can create my own theme ( https://select2.imtqy.com/examples.html )

I found bootstrap 3 theme for select2, but it seems to work only for version 3.5.

So, can I create a custom theme for select2 latest version (4.0)? Basically, I need bootstrap 3 style, preferably with a LESS file

Answer 1

@fk is working on a Bootstrap 3 theme for Select2 4.0.0.

https://github.com/select2/select2-bootstrap-theme

There is currently no documentation on creating themes for Select2 4.0.0, but this can help look at the default SCSS theme for selectors.

Answer 2

If you want to use bootstrap style from Kevin Brown's answer

https://github.com/select2/select2-bootstrap-theme

You add this css file to your page, keep select2 styles as default

<link href="/select2-bootstrap-theme/select2-bootstrap.min.css" type="text/css" rel="stylesheet" /> 

Then install the theme

 $("#elem").select2({theme:"bootstrap"}); 

Also , use the .select2-bootstrap-prepend and .select2-bootstrap-append classes in .input-group shell elements to group buttons and select without problems.