144 * |
145 * |
145 * @type int $priority Priority of the panel, defining the display order |
146 * @type int $priority Priority of the panel, defining the display order |
146 * of panels and sections. Default 160. |
147 * of panels and sections. Default 160. |
147 * @type string $capability Capability required for the panel. |
148 * @type string $capability Capability required for the panel. |
148 * Default `edit_theme_options`. |
149 * Default `edit_theme_options`. |
149 * @type string|string[] $theme_supports Theme features required to support the panel. |
150 * @type mixed[] $theme_supports Theme features required to support the panel. |
150 * @type string $title Title of the panel to show in UI. |
151 * @type string $title Title of the panel to show in UI. |
151 * @type string $description Description to show in the UI. |
152 * @type string $description Description to show in the UI. |
152 * @type string $type Type of the panel. |
153 * @type string $type Type of the panel. |
153 * @type callable $active_callback Active callback. |
154 * @type callable $active_callback Active callback. |
154 * } |
155 * } |
345 protected function render_template() { |
346 protected function render_template() { |
346 ?> |
347 ?> |
347 <li id="accordion-panel-{{ data.id }}" class="accordion-section control-section control-panel control-panel-{{ data.type }}"> |
348 <li id="accordion-panel-{{ data.id }}" class="accordion-section control-section control-panel control-panel-{{ data.type }}"> |
348 <h3 class="accordion-section-title" tabindex="0"> |
349 <h3 class="accordion-section-title" tabindex="0"> |
349 {{ data.title }} |
350 {{ data.title }} |
350 <span class="screen-reader-text"><?php _e( 'Press return or enter to open this panel' ); ?></span> |
351 <span class="screen-reader-text"> |
|
352 <?php |
|
353 /* translators: Hidden accessibility text. */ |
|
354 _e( 'Press return or enter to open this panel' ); |
|
355 ?> |
|
356 </span> |
351 </h3> |
357 </h3> |
352 <ul class="accordion-sub-container control-panel-content"></ul> |
358 <ul class="accordion-sub-container control-panel-content"></ul> |
353 </li> |
359 </li> |
354 <?php |
360 <?php |
355 } |
361 } |
365 * @since 4.3.0 |
371 * @since 4.3.0 |
366 */ |
372 */ |
367 protected function content_template() { |
373 protected function content_template() { |
368 ?> |
374 ?> |
369 <li class="panel-meta customize-info accordion-section <# if ( ! data.description ) { #> cannot-expand<# } #>"> |
375 <li class="panel-meta customize-info accordion-section <# if ( ! data.description ) { #> cannot-expand<# } #>"> |
370 <button class="customize-panel-back" tabindex="-1"><span class="screen-reader-text"><?php _e( 'Back' ); ?></span></button> |
376 <button class="customize-panel-back" tabindex="-1"><span class="screen-reader-text"> |
|
377 <?php |
|
378 /* translators: Hidden accessibility text. */ |
|
379 _e( 'Back' ); |
|
380 ?> |
|
381 </span></button> |
371 <div class="accordion-section-title"> |
382 <div class="accordion-section-title"> |
372 <span class="preview-notice"> |
383 <span class="preview-notice"> |
373 <?php |
384 <?php |
374 /* translators: %s: The site/panel title in the Customizer. */ |
385 /* translators: %s: The site/panel title in the Customizer. */ |
375 printf( __( 'You are customizing %s' ), '<strong class="panel-title">{{ data.title }}</strong>' ); |
386 printf( __( 'You are customizing %s' ), '<strong class="panel-title">{{ data.title }}</strong>' ); |
376 ?> |
387 ?> |
377 </span> |
388 </span> |
378 <# if ( data.description ) { #> |
389 <# if ( data.description ) { #> |
379 <button type="button" class="customize-help-toggle dashicons dashicons-editor-help" aria-expanded="false"><span class="screen-reader-text"><?php _e( 'Help' ); ?></span></button> |
390 <button type="button" class="customize-help-toggle dashicons dashicons-editor-help" aria-expanded="false"><span class="screen-reader-text"> |
|
391 <?php |
|
392 /* translators: Hidden accessibility text. */ |
|
393 _e( 'Help' ); |
|
394 ?> |
|
395 </span></button> |
380 <# } #> |
396 <# } #> |
381 </div> |
397 </div> |
382 <# if ( data.description ) { #> |
398 <# if ( data.description ) { #> |
383 <div class="description customize-panel-description"> |
399 <div class="description customize-panel-description"> |
384 {{{ data.description }}} |
400 {{{ data.description }}} |