WP_Customize_Nav_Menu_Locations_Control
概述
WP_Customize_Nav_Menu_Locations_Control 是 WordPress 自定义器中的一个控件类，用于管理导航菜单位置。它继承自 WP_Customize_Control，主要使用 JS/Underscore 模板来渲染界面。
关键要点
- 继承自 WP_Customize_Control，类型为 'nav_menu_locations'。
- 重写了 render_content() 方法，不直接渲染内容，而是依赖 JS 模板。
- 通过 content_template() 方法提供基于 Underscore 模板的 UI 实现。
- 需要主题支持 'menus' 功能才能正常工作。
代码示例
class WP_Customize_Nav_Menu_Locations_Control extends WP_Customize_Control {
public $type = 'nav_menu_locations';
public function render_content() {}
public function content_template() {
if ( current_theme_supports( 'menus' ) ) :
// JS/Underscore 模板代码
endif;
}
}注意事项
- 该控件自 WordPress 4.9.0 版本引入。
- 使用时需确保主题已启用 'menus' 支持。
- 界面渲染完全依赖前端 JavaScript 和 Underscore 模板，后端不输出 HTML。
Customize Nav Menu Locations Control Class.
Description
See also
Methods
| Name | Description |
|---|---|
| WP_Customize_Nav_Menu_Locations_Control::content_template | JS/Underscore template for the control UI. |
| WP_Customize_Nav_Menu_Locations_Control::render_content | Don’t render the control’s content – it uses a JS template instead. |
Source
class WP_Customize_Nav_Menu_Locations_Control extends WP_Customize_Control {
/**
* Control type.
*
* @since 4.9.0
* @var string
*/
public $type = 'nav_menu_locations';
/**
* Don't render the control's content - it uses a JS template instead.
*
* @since 4.9.0
*/
public function render_content() {}
/**
* JS/Underscore template for the control UI.
*
* @since 4.9.0
*/
public function content_template() {
if ( current_theme_supports( 'menus' ) ) :
?>
<# var elementId; #>
<ul class="menu-location-settings">
<li class="customize-control assigned-menu-locations-title">
<span class="customize-control-title">{{ wp.customize.Menus.data.l10n.locationsTitle }}</span>
<# if ( data.isCreating ) { #>
<p>
widget%3$s</a>, skip this step.)', 'menu locations' ),
__( 'https://wordpress.org/documentation/article/manage-wordpress-widgets/' ),
' class="external-link" target="_blank"',
sprintf(
'<span class="screen-reader-text"> %s</span>',
/* translators: Hidden accessibility text. */
__( '(opens in a new tab)' )
)
);
?>
</p>
<# } else { #>
<p></p>
<# } #>
</li>
$description ) : ?>
<# elementId = _.uniqueId( 'customize-nav-menu-control-location-' ); #>
<li class="customize-control customize-control-checkbox assigned-menu-location">
<span class="customize-inside-control-row">
<input id="{{ elementId }}" type="checkbox" data-menu-id="{{ data.menu_id }}" data-location-id="<?php echo esc_attr( $location ); ?>" class="menu-location" />
<label for="{{ elementId }}">
<span class="theme-location-set">
</span>'
);
?>
</span>
</label>
</span>
</li>
</ul>
</pre><p class="wporg-dot-link-list"><a href="https://developer.wordpress.org/reference/files/wp-includes/customize/class-wp-customize-nav-menu-locations-control.php/">View all references</a> <a href="https://core.trac.wordpress.org/browser/tags/6.9.4/src/wp-includes/customize/class-wp-customize-nav-menu-locations-control.php#L17">View on Trac</a> <a href="https://github.com/WordPress/wordpress-develop/blob/6.9.4/src/wp-includes/customize/class-wp-customize-nav-menu-locations-control.php#L17-L92">View on GitHub</a></p></section>
<section class="wp-block-wporg-code-reference-related" data-nosnippet="true"><h2 id="related" class="is-toc-heading wp-block-heading has-heading-5-font-size" tabindex="-1" ><a href="#related">Related</a></h2> <section style="margin-top:var(--wp--preset--spacing--20)" class="wp-block-wporg-code-table" id="uses"><figure class="wp-block-table "><table><thead><tr><th scope="col">Uses</th><th scope="col">Description</th></tr></thead><tbody><tr class=""><td><a href="https://developer.wordpress.org/reference/classes/wp_customize_control/">WP_Customize_Control</a><code>wp-includes/class-wp-customize-control.php
Changelog
| Version | Description |
|---|---|
| 4.9.0 | Introduced. |