Customizer Search - Version 1.1.0

Version Description

  • Rewrite the search logic to improve the search results.
  • The search results are direct links to the customizer panel where the searched setting resides, This improves the required clicks to get to the search setting from old version.
Download this release

Release Info

Developer Nikschavan
Plugin Icon 128x128 Customizer Search
Version 1.1.0
Comparing to
See all releases

Code changes from version 1.0.0 to 1.1.0

Files changed (9) hide show
  1. assets/css/customizer-search-admin.css +112 -4
  2. assets/js/customizer-search-admin.compiled.js +1 -0
  3. assets/js/customizer-search-admin.js +197 -149
  4. class-bsf-customizer-search.php +0 -72
  5. class-customizer-search.php +5 -7
  6. customizer-search.php +4 -4
  7. languages/customizer-search.pot +8 -8
  8. readme.txt +20 -6
  9. templates/admin-customize-js-templates.php +10 -23
assets/css/customizer-search-admin.css CHANGED
@@ -4,17 +4,125 @@
4
  }
5
 
6
  .customizer-search-section {
7
- padding: 10px;
8
  }
9
 
10
  .customizer-search-input {
11
- width: 75%
12
  }
13
 
14
  .customizer-search-section {
15
- padding: 10px;
16
  }
17
 
18
  .customize-pane-parent {
19
- overflow: inherit;
20
  }
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
4
  }
5
 
6
  .customizer-search-section {
7
+ padding: 10px;
8
  }
9
 
10
  .customizer-search-input {
11
+ width: 77%
12
  }
13
 
14
  .customizer-search-section {
15
+ padding: 10px;
16
  }
17
 
18
  .customize-pane-parent {
19
+ overflow: inherit;
20
  }
21
+
22
+ #customize-controls .customize-info .customize-search-toggle {
23
+ padding: 20px;
24
+ }
25
+
26
+ #customize-controls .customize-info .customize-search-toggle {
27
+ position: absolute;
28
+ bottom: 4px;
29
+ right: 1px;
30
+ width: 20px;
31
+ height: 20px;
32
+ cursor: pointer;
33
+ box-shadow: none;
34
+ -webkit-appearance: none;
35
+ background: transparent;
36
+ color: #555d66;
37
+ border: none;
38
+ }
39
+
40
+ #customize-controls .customize-info .customize-search-toggle:before {
41
+ padding: 4px;
42
+ }
43
+
44
+ #customize-controls .customize-info .customize-search-toggle:before {
45
+ position: absolute;
46
+ top: 5px;
47
+ left: 6px;
48
+ }
49
+
50
+ #accordion-section-customizer-search {
51
+ margin-bottom: 0;
52
+ color: #555d66;
53
+ background: #fff;
54
+ padding: 12px 15px;
55
+ border-top: 1px solid #ddd;
56
+ }
57
+
58
+ #accordion-section-customizer-search .accordion-section-title:after {
59
+ content: none;
60
+ }
61
+
62
+ .customizer-search-section {
63
+ padding: 0;
64
+ }
65
+
66
+ .search-not-found {
67
+ height: 0;
68
+ transition: height 0.3s ease-in-out;
69
+ visibility: hidden;
70
+ opacity: 0;
71
+ display: none;
72
+ }
73
+
74
+ .search-found {
75
+ height: 100%;
76
+ transition: height 0.3s ease-in-out;
77
+ visibility: visible;
78
+ opacity: 1;
79
+ }
80
+
81
+ #search-results .accordion-section {
82
+ border-left: none;
83
+ border-right: none;
84
+ padding: 10px 10px 11px 14px;
85
+ line-height: 21px;
86
+ background: #fff;
87
+ position: relative;
88
+ }
89
+
90
+ #search-results .accordion-section h3 {
91
+ padding: 0;
92
+ margin: 0
93
+ }
94
+
95
+ #search-results .accordion-section:hover {
96
+ background: #f3f3f5;
97
+ }
98
+
99
+ .search-setting-path {
100
+ display: flex;
101
+ cursor: pointer;
102
+ }
103
+
104
+ #search-results .accordion-section:after {
105
+ font: normal 20px/1 dashicons;
106
+ speak: none;
107
+ display: block;
108
+ -webkit-font-smoothing: antialiased;
109
+ -moz-osx-font-smoothing: grayscale;
110
+ text-decoration: none !important;
111
+ }
112
+
113
+ #search-results .accordion-section:after {
114
+ content: "\f345";
115
+ position: absolute;
116
+ top: 12px;
117
+ right: 10px;
118
+ z-index: 1;
119
+ top: calc(50% - 10px);
120
+ }
121
+
122
+ #search-results .accordion-section h3:after {
123
+ content: none;
124
+ }
125
+
126
+ #search-results .accordion-section h3:hover {
127
+ background: inherit;
128
+ }
assets/js/customizer-search-admin.compiled.js ADDED
@@ -0,0 +1 @@
 
1
+ (function(a){var b="";CustomizerSearchAdmin={_init:function _init(){this._bind();var c=a.map(_wpCustomizeSettings.controls,function(b){return a.map(_wpCustomizeSettings.sections,function(c){b.section==c.id&&a.map(_wpCustomizeSettings.panels,function(a){""==c.panel&&(b.panelName=c.title),c.panel==a.id&&(b.sectionName=c.title,b.panel=c.panel,b.panelName=a.title)})}),[b]});b=document.getElementById("customize-theme-controls"),customizePanelsParent=a("#customize-theme-controls"),customizePanelsParent.after("<div id=\"search-results\"></div>"),a(document).on("keyup","#customizer-search-input",function(b){b.preventDefault(),$this=a("#customizer-search-input"),string=$this.val(),0<string.length?CustomizerSearchAdmin.displayMatches(string,c):CustomizerSearchAdmin._clearSearch()}),a(document).on("click",".clear-search",function(){CustomizerSearchAdmin._clearSearch()}),a(document).on("click",".customize-search-toggle",function(){CustomizerSearchAdmin._display_search_form()})},expandSection:function expandSection(){var a=this.getAttribute("data-section"),b=wp.customize.section(a);CustomizerSearchAdmin._clearSearch(),b.expand()},displayMatches:function displayMatches(a,c){var d=CustomizerSearchAdmin.findMatches(a,c);if(0!==d.length){html=d.map(function(a){if(""!==a.label){var b=a.panelName;return""!=a.sectionName&&(b="".concat(b," \u25B8 ").concat(a.sectionName)),"\n <li id=\"accordion-section-".concat(a.section,"\" class=\"accordion-section control-section control-section-default customizer-search-results\" aria-owns=\"sub-accordion-section-").concat(a.section,"\" data-section=\"").concat(a.section,"\">\n <h3 class=\"accordion-section-title\" tabindex=\"0\">\n ").concat(a.label,"\n <span class=\"screen-reader-text\">Press return or enter to open this section</span>\n </h3>\n <span class=\"search-setting-path\">").concat(b,"</i></span>\n </li>\n ")}}).join(""),b.classList.add("search-not-found"),document.getElementById("search-results").innerHTML="<ul id=\"customizer-search-results\">".concat(html,"</ul>");var e=document.querySelectorAll("#search-results .accordion-section");e.forEach(function(a){return a.addEventListener("click",CustomizerSearchAdmin.expandSection)})}},findMatches:function findMatches(a,b){return b.filter(function(b){null==b.panelName&&(b.panelName=""),null==b.sectionName&&(b.sectionName="");var c=new RegExp(a,"gi");return b.label.match(c)||b.panelName.match(c)||b.sectionName.match(c)})},_bind:function _bind(){wp.customize.previewer.targetWindow.bind(a.proxy(this._showSearchButtonToggle,this))},_showSearchButtonToggle:function _showSearchButtonToggle(){var b=wp.template("search-button");0==a("#customize-info .accordion-section-title .customize-search-toggle").length&&a("#customize-info .accordion-section-title").append(b());var b=wp.template("search-form");0==a("#customize-info #accordion-section-customizer-search").length&&a("#customize-info .customize-panel-description").after(b())},_display_search_form:function _display_search_form(){a("#accordion-section-customizer-search").hasClass("open")?(a("#accordion-section-customizer-search").removeClass("open"),a("#accordion-section-customizer-search").slideUp("fast")):(a(".customize-panel-description").removeClass("open"),a(".customize-panel-description").slideUp("fast"),a("#accordion-section-customizer-search").addClass("open"),a("#accordion-section-customizer-search").slideDown("fast"))},_clearSearch:function _clearSearch(){var b=document.getElementById("customize-theme-controls");b.classList.remove("search-not-found"),document.getElementById("search-results").innerHTML="",document.getElementById("customizer-search-input").value="",a("#customizer-search-input").focus()}},a(function(){CustomizerSearchAdmin._init()})})(jQuery);
assets/js/customizer-search-admin.js CHANGED
@@ -5,152 +5,200 @@
5
  * @package Customizer_Search
6
  */
7
 
8
- ( function( $ ) {
9
-
10
- /**
11
- * Selector for the search field
12
- * @type {String}
13
- */
14
- var searchInputSelector = '#customizer-search-input';
15
-
16
- /**
17
- * Handles logic for the admin customize interface.
18
- *
19
- * @class CustomizerSearchAdmin
20
- * @since 1.0.0
21
- */
22
- CustomizerSearchAdmin = {
23
-
24
- /**
25
- * Initializes the admin customize interface.
26
- *
27
- * @since 1.0.0
28
- * @access private
29
- * @method _init
30
- */
31
- _init: function()
32
- {
33
- this._bind();
34
- var searchArray = this._searchArray(),
35
- sections = _wpCustomizeSettings.sections;
36
-
37
- $(document).on('keyup', searchInputSelector, function(event) {
38
- event.preventDefault();
39
- $this = $( searchInputSelector );
40
- string = $this.val();
41
-
42
- if ( string.length > 2 ) {
43
- CustomizerSearchAdmin._searchString( string, searchArray, sections );
44
- } else {
45
- $( 'li.accordion-section' ).removeClass('search-not-found').addClass('search-found');
46
- $( 'li.accordion-panel' ).removeClass('search-not-found').addClass('search-found');
47
- }
48
-
49
- });
50
-
51
- $( document ).on('click', '.clear-search', function(event) {
52
- CustomizerSearchAdmin._clearSearch();
53
- });
54
- },
55
-
56
- /**
57
- * Binds admin customize events.
58
- *
59
- * @since 1.0.0
60
- * @access private
61
- * @method _bind
62
- */
63
- _bind: function()
64
- {
65
- wp.customize.previewer.targetWindow.bind( $.proxy( this._showHeaderFooterMessage, this ) );
66
- },
67
-
68
- /**
69
- * Shows the message that is shown for when a header
70
- * or footer is already set for this page.
71
- *
72
- * @since 1.0.0
73
- * @access private
74
- * @method _showHeaderFooterMessage
75
- */
76
- _showHeaderFooterMessage: function()
77
- {
78
- var template = wp.template( 'fl-theme-builder-header-footer-message' );
79
-
80
- if( $( '#accordion-section-customizer-search' ).length == 0 ) {
81
- $( '#accordion-section-themes' ).after( template() );
82
- }
83
- },
84
-
85
- /**
86
- * Search for key inside an array.
87
- *
88
- * @since 1.0.0
89
- */
90
- _searchArray: function()
91
- {
92
- searchArray = _wpCustomizeSettings.controls;
93
-
94
- $.each(searchArray, function(index, val) {
95
- // We are removing 'nav_menu_item' options from searchArray.
96
- if (index.toLowerCase().indexOf("nav_menu_item") >= 0) {
97
- delete searchArray[index];
98
- }
99
-
100
- // We are removing 'theme_' options from searchArray.
101
- if (index.toLowerCase().indexOf("theme_") >= 0) {
102
- delete searchArray[index];
103
- }
104
- });
105
-
106
- return searchArray;
107
- },
108
-
109
- /**
110
- * Searches for the string in the given source array.
111
- *
112
- * @since 1.0.0
113
- * @param {String} key Key to be searched.
114
- * @param {Array} sourceArray Array in which the key is to be searched.
115
- * @param {Array} sections Section in the customizer.
116
- */
117
- _searchString: function( key, sourceArray, sections ) {
118
- resultArray = []
119
-
120
- $.each(sourceArray, function(index, val) {
121
- if ( typeof val.label !== "undefined" ) {
122
- if (val.label.toLowerCase().indexOf(key) >= 0) {
123
- resultArray.push( sourceArray[index] );
124
- }
125
- }
126
- });
127
-
128
- $.each(resultArray, function(index, val) {
129
- $found = $('li#accordion-section-' + val['section']);
130
- $foundPanel = $('li#accordion-panel-' + sections[val['section']]['panel']);
131
- $found.addClass('search-found');
132
- $foundPanel.addClass('search-found');
133
- $found.siblings('.control-section').removeClass('search-found').addClass('search-not-found');
134
- $foundPanel.siblings('.control-section').removeClass('search-found').addClass('search-not-found');
135
- });
136
- },
137
-
138
- /**
139
- * Clear Search input and display all the options
140
- *
141
- * @since 1.0.0
142
- * @access private
143
- */
144
- _clearSearch: function() {
145
- $( '#customizer-search-input' ).val('');
146
- $( 'li.accordion-section' ).removeClass('search-not-found').addClass('search-found');
147
- $( 'li.accordion-panel' ).removeClass('search-not-found').addClass('search-found');
148
-
149
- $( searchInputSelector ).focus();
150
- }
151
- };
152
-
153
- // Initialize
154
- $( function() { CustomizerSearchAdmin._init(); } );
155
-
156
- } )( jQuery );
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
5
  * @package Customizer_Search
6
  */
7
 
8
+ (function ($) {
9
+
10
+ /**
11
+ * Selector for the search field
12
+ * @type {String}
13
+ */
14
+ const searchInputSelector = '#customizer-search-input';
15
+
16
+ /**
17
+ * innerHTML of all the customizer panels.
18
+ * @type {String}
19
+ */
20
+ let customizerPanels = '';
21
+
22
+ /**
23
+ * Handles logic for the admin customize interface.
24
+ *
25
+ * @class CustomizerSearchAdmin
26
+ * @since 1.0.0
27
+ */
28
+ CustomizerSearchAdmin = {
29
+
30
+ /**
31
+ * Initializes the admin customize interface.
32
+ *
33
+ * @since 1.0.0
34
+ * @access private
35
+ * @method _init
36
+ */
37
+ _init: function () {
38
+ this._bind();
39
+
40
+ const controls = $.map(_wpCustomizeSettings.controls, function(control, index) {
41
+ $.map(_wpCustomizeSettings.sections, function(section, index) {
42
+ if (control.section == section.id) {
43
+ $.map(_wpCustomizeSettings.panels, function(panel, index) {
44
+ if ('' == section.panel) {
45
+ control.panelName = section.title;
46
+ }
47
+
48
+ if (section.panel == panel.id) {
49
+ control.sectionName = section.title;
50
+ control.panel = section.panel;
51
+ control.panelName = panel.title;
52
+ }
53
+ });
54
+ }
55
+ });
56
+
57
+ return [control];
58
+ });
59
+
60
+ customizerPanels = document.getElementById('customize-theme-controls');
61
+
62
+ customizePanelsParent = $('#customize-theme-controls');
63
+ customizePanelsParent.after('<div id="search-results"></div>');
64
+
65
+ $(document).on('keyup', searchInputSelector, function (event) {
66
+ event.preventDefault();
67
+ $this = $(searchInputSelector);
68
+ string = $this.val();
69
+
70
+ if (string.length > 0) {
71
+ CustomizerSearchAdmin.displayMatches(string, controls);
72
+ } else {
73
+ CustomizerSearchAdmin._clearSearch();
74
+ }
75
+
76
+ });
77
+
78
+ $(document).on('click', '.clear-search', function (event) {
79
+ CustomizerSearchAdmin._clearSearch();
80
+ });
81
+
82
+ $(document).on('click', '.customize-search-toggle', function (event) {
83
+ CustomizerSearchAdmin._display_search_form();
84
+ });
85
+ },
86
+
87
+ expandSection: function(setting) {
88
+ const sectionName = this.getAttribute('data-section');
89
+ const section = wp.customize.section( sectionName );
90
+ CustomizerSearchAdmin._clearSearch();
91
+ section.expand();
92
+ },
93
+
94
+ displayMatches: function (stringToMatch, controls) {
95
+ const matchArray = CustomizerSearchAdmin.findMatches(stringToMatch, controls);
96
+
97
+ if ( 0 === matchArray.length ) return; // Return if empty results.
98
+
99
+ html = matchArray.map(function(index, elem) {
100
+
101
+ if ( '' === index.label ) return; // Return if empty results.
102
+
103
+ let settingTrail = index.panelName;
104
+ if ("" != index.sectionName) {
105
+ settingTrail = `${settingTrail} ▸ ${index.sectionName}`;
106
+ }
107
+
108
+ return `
109
+ <li id="accordion-section-${index.section}" class="accordion-section control-section control-section-default customizer-search-results" aria-owns="sub-accordion-section-${index.section}" data-section="${index.section}">
110
+ <h3 class="accordion-section-title" tabindex="0">
111
+ ${index.label}
112
+ <span class="screen-reader-text">Press return or enter to open this section</span>
113
+ </h3>
114
+ <span class="search-setting-path">${settingTrail}</i></span>
115
+ </li>
116
+ `;
117
+ }).join('');
118
+
119
+ customizerPanels.classList.add('search-not-found');
120
+ document.getElementById('search-results').innerHTML = `<ul id="customizer-search-results">${html}</ul>`;
121
+
122
+ const searchSettings = document.querySelectorAll('#search-results .accordion-section');
123
+ searchSettings.forEach( setting => setting.addEventListener('click', CustomizerSearchAdmin.expandSection) );
124
+ },
125
+
126
+ findMatches: function (stringToMatch, controls) {
127
+ return controls.filter(control => {
128
+ // here we need to figure out if the city or state matches what was searched.
129
+ if (control.panelName == null) control.panelName = '';
130
+ if (control.sectionName == null) control.sectionName = '';
131
+
132
+ const regex = new RegExp(stringToMatch, 'gi');
133
+ return control.label.match(regex) || control.panelName.match(regex) || control.sectionName.match(regex)
134
+ });
135
+ },
136
+
137
+ /**
138
+ * Binds admin customize events.
139
+ *
140
+ * @since 1.0.0
141
+ * @access private
142
+ * @method _bind
143
+ */
144
+ _bind: function () {
145
+ wp.customize.previewer.targetWindow.bind($.proxy(this._showSearchButtonToggle, this));
146
+ },
147
+
148
+ /**
149
+ * Shows the message that is shown for when a header
150
+ * or footer is already set for this page.
151
+ *
152
+ * @since 1.0.0
153
+ * @access private
154
+ * @method _showSearchButtonToggle
155
+ */
156
+ _showSearchButtonToggle: function () {
157
+ var template = wp.template('search-button');
158
+ if ($('#customize-info .accordion-section-title .customize-search-toggle').length == 0) {
159
+ $('#customize-info .accordion-section-title').append(template());
160
+ }
161
+
162
+ var template = wp.template('search-form');
163
+ if ($('#customize-info #accordion-section-customizer-search').length == 0) {
164
+ $('#customize-info .customize-panel-description').after(template());
165
+ }
166
+ },
167
+
168
+ _display_search_form: function () {
169
+
170
+ if ($('#accordion-section-customizer-search').hasClass('open')) {
171
+ $('#accordion-section-customizer-search').removeClass('open')
172
+ $('#accordion-section-customizer-search').slideUp('fast');
173
+ } else {
174
+ $('.customize-panel-description').removeClass('open');
175
+ $('.customize-panel-description').slideUp('fast');
176
+
177
+ $('#accordion-section-customizer-search').addClass('open');
178
+ $('#accordion-section-customizer-search').slideDown('fast');
179
+ }
180
+
181
+ },
182
+
183
+ /**
184
+ * Clear Search input and display all the options
185
+ *
186
+ * @since 1.0.0
187
+ * @access private
188
+ */
189
+ _clearSearch: function () {
190
+ const panels = document.getElementById('customize-theme-controls');
191
+ panels.classList.remove('search-not-found');
192
+ document.getElementById('search-results').innerHTML = '';
193
+ document.getElementById('customizer-search-input').value = '';
194
+
195
+ $(searchInputSelector).focus();
196
+ }
197
+ };
198
+
199
+ // Initialize
200
+ $(function () {
201
+ CustomizerSearchAdmin._init();
202
+ });
203
+
204
+ })(jQuery);
class-bsf-customizer-search.php DELETED
@@ -1,72 +0,0 @@
1
- <?php
2
- /**
3
- * Initial Class for Customizer Search
4
- *
5
- * @since 1.0.0
6
- * @package BSF_Customizer_Search
7
- */
8
-
9
- /**
10
- * Handles Customizer logic for the theme builder.
11
- *
12
- * @since 1.0
13
- */
14
- class BSF_Customizer_Search {
15
-
16
- /**
17
- * Instance of BSF_Customizer_Search
18
- *
19
- * @var BSF_Customizer_Search
20
- */
21
- private static $instance;
22
-
23
- /**
24
- * Initiator
25
- */
26
- public static function instance() {
27
-
28
- if ( ! isset( self::$instance ) ) {
29
- self::$instance = new BSF_Customizer_Search();
30
-
31
- self::$instance->hooks();
32
- }
33
-
34
- return self::$instance;
35
- }
36
-
37
- /**
38
- * Initialize hooks.
39
- *
40
- * @since 1.0
41
- * @return void
42
- */
43
- private function hooks() {
44
- add_action( 'customize_controls_enqueue_scripts', array( $this, 'enqueue_scripts' ) );
45
- add_action( 'customize_controls_print_footer_scripts', array( $this, 'footer_scripts' ) );
46
- }
47
-
48
- /**
49
- * Enqueues scripts for the Customizer.
50
- *
51
- * @since 1.0
52
- * @return void
53
- */
54
- public function enqueue_scripts() {
55
- $slug = 'customizer-search-admin';
56
-
57
- wp_enqueue_style( $slug, BSFCS_URL . 'assets/css/' . $slug . '.css', array(), BSFCS_VER );
58
- wp_enqueue_script( $slug, BSFCS_URL . 'assets/js/' . $slug . '.js', array(), BSFCS_VER, true );
59
- }
60
-
61
- /**
62
- * Renders the Customizer footer scripts.
63
- *
64
- * @since 1.0
65
- * @return void
66
- */
67
- public function footer_scripts() {
68
- include BSFCS_DIR . 'templates/admin-customize-js-templates.php';
69
- }
70
- }
71
-
72
- BSF_Customizer_Search::instance();
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
class-customizer-search.php CHANGED
@@ -41,8 +41,8 @@ class Customizer_Search {
41
  * @return void
42
  */
43
  private function hooks() {
44
- add_action( 'customize_controls_enqueue_scripts', array( $this, 'enqueue_scripts' ) );
45
- add_action( 'customize_controls_print_footer_scripts', array( $this, 'footer_scripts' ) );
46
  }
47
 
48
  /**
@@ -52,10 +52,8 @@ class Customizer_Search {
52
  * @return void
53
  */
54
  public function enqueue_scripts() {
55
- $slug = 'customizer-search-admin';
56
-
57
- wp_enqueue_style( $slug, CS_URL . 'assets/css/' . $slug . '.css', array(), CS_VER );
58
- wp_enqueue_script( $slug, CS_URL . 'assets/js/' . $slug . '.js', array(), CS_VER, true );
59
  }
60
 
61
  /**
@@ -65,7 +63,7 @@ class Customizer_Search {
65
  * @return void
66
  */
67
  public function footer_scripts() {
68
- include CS_DIR . 'templates/admin-customize-js-templates.php';
69
  }
70
  }
71
 
41
  * @return void
42
  */
43
  private function hooks() {
44
+ add_action( 'customize_controls_enqueue_scripts', array( $this, 'enqueue_scripts' ) );
45
+ add_action( 'customize_controls_print_footer_scripts', array( $this, 'footer_scripts' ) );
46
  }
47
 
48
  /**
52
  * @return void
53
  */
54
  public function enqueue_scripts() {
55
+ wp_enqueue_style( 'customizer-search-admin', BSFCS_URL . 'assets/css/customizer-search-admin.css', array(), BSFCS_VER );
56
+ wp_enqueue_script( 'customizer-search-admin', BSFCS_URL . 'assets/js/customizer-search-admin.compiled.js', array(), BSFCS_VER, true );
 
 
57
  }
58
 
59
  /**
63
  * @return void
64
  */
65
  public function footer_scripts() {
66
+ include BSFCS_DIR . 'templates/admin-customize-js-templates.php';
67
  }
68
  }
69
 
customizer-search.php CHANGED
@@ -2,17 +2,17 @@
2
  /**
3
  * Plugin Name: Customizer Search
4
  * Plugin URI: https://github.com/Nikschavan/customizer-search
5
- * Description: Search all the options in customizer.
6
  * Author: Brainstorm Force
7
  * Author URI: https://www.brainstormforce.com/
8
  * Text Domain: customizer-search
9
  * Domain Path: /languages
10
- * Version: 1.0.0
11
  *
12
  * @package Customizer_Search
13
  */
14
 
15
- define( 'BSFCS_VER', '1.0.0' );
16
  define( 'BSFCS_DIR', plugin_dir_path( __FILE__ ) );
17
  define( 'BSFCS_URL', plugins_url( '/', __FILE__ ) );
18
  define( 'BSFCS_PATH', plugin_basename( __FILE__ ) );
@@ -20,4 +20,4 @@ define( 'BSFCS_PATH', plugin_basename( __FILE__ ) );
20
  /**
21
  * Load the plugin.
22
  */
23
- require_once 'class-bsf-customizer-search.php';
2
  /**
3
  * Plugin Name: Customizer Search
4
  * Plugin URI: https://github.com/Nikschavan/customizer-search
5
+ * Description: Search for settings in customizer.
6
  * Author: Brainstorm Force
7
  * Author URI: https://www.brainstormforce.com/
8
  * Text Domain: customizer-search
9
  * Domain Path: /languages
10
+ * Version: 1.1.0
11
  *
12
  * @package Customizer_Search
13
  */
14
 
15
+ define( 'BSFCS_VER', '1.1.0' );
16
  define( 'BSFCS_DIR', plugin_dir_path( __FILE__ ) );
17
  define( 'BSFCS_URL', plugins_url( '/', __FILE__ ) );
18
  define( 'BSFCS_PATH', plugin_basename( __FILE__ ) );
20
  /**
21
  * Load the plugin.
22
  */
23
+ require_once 'class-customizer-search.php';
languages/customizer-search.pot CHANGED
@@ -1,15 +1,15 @@
1
- # Copyright (C) 2017 Brainstorm Force
2
  # This file is distributed under the same license as the Customizer Search package.
3
  msgid ""
4
  msgstr ""
5
- "Project-Id-Version: Customizer Search 1.0.0\n"
6
  "Report-Msgid-Bugs-To: "
7
  "https://wordpress.org/support/plugin/customizer-search\n"
8
- "POT-Creation-Date: 2017-07-29 10:22:15+00:00\n"
9
  "MIME-Version: 1.0\n"
10
  "Content-Type: text/plain; charset=utf-8\n"
11
  "Content-Transfer-Encoding: 8bit\n"
12
- "PO-Revision-Date: 2017-MO-DA HO:MI+ZONE\n"
13
  "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
14
  "Language-Team: LANGUAGE <LL@li.org>\n"
15
  "X-Generator: grunt-wp-i18n 0.5.4\n"
@@ -25,15 +25,15 @@ msgstr ""
25
  "X-Poedit-Bookmarks: \n"
26
  "X-Textdomain-Support: yes\n"
27
 
28
- #: templates/admin-customize-js-templates.php:14
29
  msgid "Search"
30
  msgstr ""
31
 
32
- #: templates/admin-customize-js-templates.php:16
33
  msgid "Search..."
34
  msgstr ""
35
 
36
- #: templates/admin-customize-js-templates.php:17
37
  msgid "Clear"
38
  msgstr ""
39
 
@@ -46,7 +46,7 @@ msgid "https://github.com/Nikschavan/customizer-search"
46
  msgstr ""
47
 
48
  #. Description of the plugin/theme
49
- msgid "Search all the options in customizer."
50
  msgstr ""
51
 
52
  #. Author of the plugin/theme
1
+ # Copyright (C) 2018 Brainstorm Force
2
  # This file is distributed under the same license as the Customizer Search package.
3
  msgid ""
4
  msgstr ""
5
+ "Project-Id-Version: Customizer Search 1.1.0\n"
6
  "Report-Msgid-Bugs-To: "
7
  "https://wordpress.org/support/plugin/customizer-search\n"
8
+ "POT-Creation-Date: 2018-03-03 10:43:17+00:00\n"
9
  "MIME-Version: 1.0\n"
10
  "Content-Type: text/plain; charset=utf-8\n"
11
  "Content-Transfer-Encoding: 8bit\n"
12
+ "PO-Revision-Date: 2018-MO-DA HO:MI+ZONE\n"
13
  "Last-Translator: FULL NAME <EMAIL@ADDRESS>\n"
14
  "Language-Team: LANGUAGE <LL@li.org>\n"
15
  "X-Generator: grunt-wp-i18n 0.5.4\n"
25
  "X-Poedit-Bookmarks: \n"
26
  "X-Textdomain-Support: yes\n"
27
 
28
+ #: templates/admin-customize-js-templates.php:20
29
  msgid "Search"
30
  msgstr ""
31
 
32
+ #: templates/admin-customize-js-templates.php:22
33
  msgid "Search..."
34
  msgstr ""
35
 
36
+ #: templates/admin-customize-js-templates.php:23
37
  msgid "Clear"
38
  msgstr ""
39
 
46
  msgstr ""
47
 
48
  #. Description of the plugin/theme
49
+ msgid "Search for settings in customizer."
50
  msgstr ""
51
 
52
  #. Author of the plugin/theme
readme.txt CHANGED
@@ -1,18 +1,28 @@
1
- === Customizer Search Settings ===
2
  Contributors: brainstormforce, Nikschavan
3
  Donate link: https://www.paypal.me/BrainstormForce
4
  Tags: customizer, search
5
  Requires at least: 4.4
6
- Tested up to: 4.8.1
7
- Stable tag: 1.0.0
8
  License: GPLv2 or later
9
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
10
 
11
- Search all the options in customizer.
12
 
13
  == Description ==
14
 
15
- Search all the options in customizer.
 
 
 
 
 
 
 
 
 
 
16
 
17
  == Installation ==
18
 
@@ -22,5 +32,9 @@ Search all the options in customizer.
22
 
23
  == Changelog ==
24
 
 
 
 
 
25
  = 1.0.0 =
26
- * Initial Release
1
+ === Customizer Search ===
2
  Contributors: brainstormforce, Nikschavan
3
  Donate link: https://www.paypal.me/BrainstormForce
4
  Tags: customizer, search
5
  Requires at least: 4.4
6
+ Tested up to: 4.9.4
7
+ Stable tag: 1.1.0
8
  License: GPLv2 or later
9
  License URI: http://www.gnu.org/licenses/gpl-2.0.html
10
 
11
+ Search for settings in customizer.
12
 
13
  == Description ==
14
 
15
+ Using a theme powered by the WordPress Customizer? Then you will love this plugin. Save the time and frustration finding options. Simply search for the setting you're looking for and get there instantly.
16
+
17
+ Works with all WordPress theme. Tested with:
18
+
19
+ 1. <a href="https://wpastra.com/pro/?utm_source=customizer-search-plugin&utm_medium=plugin-readme&utm_campaign=tested-with-astra&bsf=162">Astra</a>
20
+ 2. GeneratePress
21
+ 3. OceanWP
22
+ 4. Hestia
23
+ 5. Sydney
24
+
25
+ https://www.youtube.com/watch?v=81LSHXHw058
26
 
27
  == Installation ==
28
 
32
 
33
  == Changelog ==
34
 
35
+ = 1.1.0 =
36
+ - Rewrite the search logic to improve the search results.
37
+ - The search results are direct links to the customizer panel where the searched setting resides, This improves the required clicks to get to the search setting from old version.
38
+
39
  = 1.0.0 =
40
+ - Initial Release
templates/admin-customize-js-templates.php CHANGED
@@ -8,34 +8,21 @@
8
 
9
  ?>
10
 
11
- <script type="text/html" id="tmpl-fl-theme-builder-header-footer-message">
12
- <div id="accordion-section-customizer-search" style="display: block;">
13
- <h3 class="customizer-search-section accordion-section-title">
 
 
 
 
 
 
14
  <span class="search-input"><?php _e( 'Search', 'customizer-search' ); ?></span>
15
  <span class="search-field-wrapper">
16
  <input type="text" placeholder="<?php _e( 'Search...', 'customizer-search' ); ?>" name="customizer-search-input" autofocus="autofocus" id="customizer-search-input" class="customizer-search-input">
17
  <button type="button" class="button clear-search" tabindex="0"><?php _e( 'Clear', 'customizer-search' ); ?></button>
18
  </span>
19
 
20
- </h3>
21
  </div>
22
- <style type="text/css">
23
- #accordion-section-customizer-search {
24
- margin-bottom: 0;
25
- }
26
-
27
- #accordion-section-customizer-search .accordion-section-title:after{
28
- content: none;
29
- }
30
-
31
- .search-not-found {
32
- height: 0;
33
- transition: height 0.3s ease-in-out;
34
- }
35
-
36
- .search-found {
37
- height: 100%;
38
- transition: height 0.3s ease-in-out;
39
- }
40
- </style>
41
  </script>
8
 
9
  ?>
10
 
11
+ <script type="text/html" id="tmpl-search-button">
12
+
13
+ <button type="button" class="customize-search-toggle dashicons dashicons-search" aria-expanded="false"><span class="screen-reader-text">Search</span></button>
14
+
15
+ </script>
16
+
17
+ <script type="text/html" id="tmpl-search-form">
18
+ <div id="accordion-section-customizer-search" style="display: none;">
19
+ <h4 class="customizer-search-section accordion-section-title">
20
  <span class="search-input"><?php _e( 'Search', 'customizer-search' ); ?></span>
21
  <span class="search-field-wrapper">
22
  <input type="text" placeholder="<?php _e( 'Search...', 'customizer-search' ); ?>" name="customizer-search-input" autofocus="autofocus" id="customizer-search-input" class="customizer-search-input">
23
  <button type="button" class="button clear-search" tabindex="0"><?php _e( 'Clear', 'customizer-search' ); ?></button>
24
  </span>
25
 
26
+ </h4>
27
  </div>
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
28
  </script>