diff --git a/css/customizer.css b/css/customizer.css index 2dff689..11c090f 100644 --- a/css/customizer.css +++ b/css/customizer.css @@ -18,7 +18,7 @@ box-shadow: none; } -.select2-container--default .selection .select2-selection--multiple { +.wp-customizer .select2-container--default .selection .select2-selection--multiple { border: none; background: #fcfcff; border-radius: 0; @@ -28,7 +28,16 @@ box-shadow: none; } -.select2-container .select2-dropdown { +.wp-customizer .select2-container--default .select2-selection--multiple .select2-selection__rendered { + width: 95%; +} + +.wp-customizer .select2-container--default .select2-selection--multiple .select2-selection__clear { + position: absolute; + right: 0; +} + +.wp-customizer .select2-container .select2-dropdown { z-index: 900000; } diff --git a/inc/custom-controls.php b/inc/custom-controls.php index a497ff6..4f534fd 100644 --- a/inc/custom-controls.php +++ b/inc/custom-controls.php @@ -388,15 +388,23 @@ class Skyrocket_Dropdown_Select2_Custom_Control extends WP_Customize_Control { * The type of Select2 Dropwdown to display. Can be either a single select dropdown or a multi-select dropdown. Either false for true. Default = false */ private $multiselect = false; + /** + * The Placeholder value to display. Select2 requires a Placeholder value to be set when using the clearall option. Default = 'Please select...' + */ + private $placeholder = 'Please select...'; /** * Constructor */ public function __construct( $manager, $id, $args = array(), $options = array() ) { parent::__construct( $manager, $id, $args ); - // Get the font sort order + // Check if this is a multi-select field if ( isset( $this->input_attrs['multiselect'] ) && $this->input_attrs['multiselect'] ) { $this->multiselect = true; } + // Check if a placeholder string has been specified + if ( isset( $this->input_attrs['placeholder'] ) && $this->input_attrs['placeholder'] ) { + $this->placeholder = $this->input_attrs['placeholder']; + } } /** * Enqueue our scripts and styles @@ -411,6 +419,10 @@ public function enqueue() { * Render the control in the customizer */ public function render_content() { + $defaultValue = $this->value(); + if ( $this->multiselect ) { + $defaultValue = explode( ',', $this->value() ); + } ?>