WP_Customize_Nav_Menu_Control
云策文档标注
概述
WP_Customize_Nav_Menu_Control 是 WordPress 自定义器中用于导航菜单的控件类,继承自 WP_Customize_Control。它通过 JS/Underscore 模板渲染 UI,不直接输出 HTML 内容。
关键要点
- 继承自 WP_Customize_Control,类型为 'nav_menu'。
- 使用 JS/Underscore 模板(content_template 方法)来定义控件 UI。
- render_content 方法为空,避免直接渲染内容。
- json 方法返回控件的参数,包括菜单 ID。
代码示例
class WP_Customize_Nav_Menu_Control extends WP_Customize_Control {
public $type = 'nav_menu';
public function render_content() {}
public function content_template() {
$add_items = __( 'Add Items' );
?>
<div class="customize-control-nav_menu-buttons">
<button type="button" class="button add-new-menu-item" aria-label="<?php esc_attr_e( 'Add or remove menu items' ); ?>" aria-expanded="false" aria-controls="available-menu-items">
<?php echo $add_items; ?>
</button>
<button type="button" class="button reorder-toggle" aria-label="<?php esc_attr_e( 'Reorder menu items' ); ?>" aria-describedby="reorder-items-desc-{{ data.menu_id }}">
<?php _e( 'Reorder' ); ?>
</button>
</div>
<?php
}
public function json() {
$exported = parent::json();
$exported['menu_id'] = $this->setting->term_id;
return $exported;
}
}
原文内容
Customize Nav Menu Control Class.
Description
See also
Methods
| Name | Description |
|---|---|
| WP_Customize_Nav_Menu_Control::content_template | JS/Underscore template for the control UI. |
| WP_Customize_Nav_Menu_Control::json | Return parameters for this control. |
| WP_Customize_Nav_Menu_Control::render_content | Don’t render the control’s content – it uses a JS template instead. |
Source
class WP_Customize_Nav_Menu_Control extends WP_Customize_Control {
/**
* Control type.
*
* @since 4.3.0
* @var string
*/
public $type = 'nav_menu';
/**
* Don't render the control's content - it uses a JS template instead.
*
* @since 4.3.0
*/
public function render_content() {}
/**
* JS/Underscore template for the control UI.
*
* @since 4.3.0
*/
public function content_template() {
$add_items = __( 'Add Items' );
?>
<p class="new-menu-item-invitation">
</p>
<div class="customize-control-nav_menu-buttons">
<button type="button" class="button add-new-menu-item" aria-label="<?php esc_attr_e( 'Add or remove menu items' ); ?>" aria-expanded="false" aria-controls="available-menu-items">
</button>
<button type="button" class="button-link reorder-toggle" aria-label="<?php esc_attr_e( 'Reorder menu items' ); ?>" aria-describedby="reorder-items-desc-{{ data.menu_id }}">
<span class="reorder"></span>
<span class="reorder-done"></span>
</button>
</div>
<p class="screen-reader-text" id="reorder-items-desc-{{ data.menu_id }}">
</p>
setting->term_id;
return $exported;
}
}
Changelog
| Version | Description |
|---|---|
| 4.3.0 | Introduced. |