Forums › Forums › Search & Filter Pro › Javascript and CSS Styling

Tagged: , ,

  • This topic has 2 replies, 2 voices, and was last updated 6 years ago by Anonymous.
Viewing 3 posts - 1 through 3 (of 3 total)
  • Anonymous
    (Private)  November 21, 2018 at 7:11 pm #194224

    It would be great if there was an ‘out of the box’ styling to the dropdowns.
    Is there a recommended way to add styling as per these methods or similar? See:
    https://speckyboy.com/open-source-css-javascript-select-box-snippets/

    Trevor
    (Private)  November 22, 2018 at 1:37 pm #194265

    The most common styling ‘system’ applied to WordPress form select boxes is called Select2. It is used by a lot of plugins, even WooCommerce, and is mainated by the WooCommerce team (who are owned by Automattic, the owners of wordpress.com).

    We distribute this with our plugin. If you go to Seach & Filter -> Settings, you will see a setting for Combobox script. Set this to Select2. Whilst we normally only apply it to comboboxes, you can, relatively easily, apply it to normal dropdowns as well.

    These threads might help you:

    https://support.searchandfilter.com/forums/topic/customizing-select/

    https://support.searchandfilter.com/forums/topic/customise-dropdown-combobox/

    Anonymous
    (Private)  November 22, 2018 at 3:30 pm #194292

    Thanks! That was SO simple – maybe that should be your factory default!

    I only needed to switch to ‘Select2’, as you described, and then I added one line of javascript:

    jQuery(document).ready(function($){
 $('select.sf-input-select').select2();
});

    and it seemed to work immediately!

  • Author
    Posts
Viewing 3 posts - 1 through 3 (of 3 total)