首先, 让我解释一下我要达到的目标:
在由StudioPress重新设计Wordpress Genesis-sample主题时, 我决定仅对所有显示分辨率使用响应菜单(移动菜单, 带有汉堡图标的菜单)。我已经将菜单附加到的右钩子上, 并按自己的喜好设置了部分样式, 还设置了移动菜单以在所有媒体查询中显示。
我接下来要做的是在主菜单(nav-primary)的下面, 在标签内添加我的自定义菜单(已创建), 以便它与单击一起显示和隐藏。
我尝试使用nav-extras将我的代码片段添加到标签的末尾, 其中以下代码来自创世纪摘要库:
// Adding custom menu supportadd_theme_support(
'genesis-menus', array(
'primary'=>
__( 'Header Menu', 'genesis-sample' ), 'secondary' =>
__( 'Footer Menu', 'genesis-sample' ), 'custom' =>
__( 'Custom Menu', 'genesis-sample' ), )
);
//My custom menu function function add_custom_menu() {// Do nothing if menu not supported.if ( ! genesis_nav_menu_supported( 'custom' ) || ! has_nav_menu( 'custom' ) ) {
return;
}$class = 'menu genesis-nav-menu menu-custom';
if ( genesis_superfish_enabled() ) {
$class .= ' js-superfish';
}genesis_nav_menu( array(
'theme_location' =>
'custom', 'menu_class'=>
$class, ) );
}// Add typical attributes for navigation elements.add_filter( 'genesis_attr_nav-custom', 'genesis_attributes_nav' );
add_filter( 'genesis_attr_nav-custom', 'my_skiplinks_attr_nav_custom' );
/**
* Adds ID markup to custom navigation.
*
* @param array $attributes Existing attributes for custom navigation element.
* @return array Amended attributes for custom navigation element.
*/function my_skiplinks_attr_nav_custom( $attributes ) {$attributes['id'] = 'genesis-nav-custom';
return $attributes;
}add_filter( 'genesis_skip_links_output', 'my_skip_links_output' );
/**
* Adds skip link for custom navigation.
*
* @param array $links Exiting skiplinks.
* @return array Amended skiplinks.
*/function my_skip_links_output( $links ) {if ( genesis_nav_menu_supported( 'custom' ) &
&
has_nav_menu( 'custom' ) ) {
$links['genesis-nav-custom'] = __( 'Skip to custom navigation', 'genesis' );
}return $links;
}//Adding custom menu to <
nav>
tagadd_filter( 'wp_nav_menu_items', 'theme_menu_extras', 10, 2 );
/**
* Filter menu items, appending either a search form or today's date.
*
* @param string$menu HTML string of list items.
* @param stdClass $args Menu arguments.
*
* @return string Amended HTML string of list items.
*/
function theme_menu_extras( $menu, $args ) {
//* Change 'primary' to 'secondary' to add extras to the secondary navigation menu *//
if ( 'primary' !== $args->
theme_location )
return $menu;
$menu .= '<
div id="sub-menu">
'. add_custom_menu() .'<
/div>
';
return $menu;
}
结果是, 即使我添加的div也未放置到位。可以找到我的路。帮助将不胜感激:), 在此先感谢你。
#1我已经解决了:
// Hide/display on mobile-menu button clickwindow.onclick = hideFunction;
function hideFunction() {
let x = document.getElementById("genesis-mobile-nav-primary").getAttribute("aria-expanded");
if (x == "true") {
document.getElementById("genesis-nav-custom").style.display = "block";
} else {
document.getElementById("genesis-nav-custom").style.display = "none";
};
}// Create custom menu and hook into the header just under <
nav>
(the primary navigation) tag// Register the custom menus.function register_additional_menu() {
register_nav_menu( 'custom' , __( 'Header Submenu' ));
}
add_action( 'init', 'register_additional_menu' );
/**
* Echoes the "Custom Navigation" menu.
*/
function custom_do_nav() {
$class = 'custom';
if ( genesis_superfish_enabled() ) {
$class .= ' js-superfish';
}genesis_nav_menu( array(
'theme_location' =>
'custom', 'menu_class'=>
$class, 'menu_id'=>
'custom-menu', ) );
}// Add typical attributes for navigation elements.
add_filter( 'genesis_attr_nav-custom', 'genesis_attributes_nav' );
add_filter( 'genesis_attr_nav-custom', 'skiplinks_attr_nav_custom' );
/**
* Adds ID markup to custom navigation.
*
* @param array $attributes Existing attributes for custom navigation element.
* @return array Amended attributes for custom navigation element.
*/
function skiplinks_attr_nav_custom( $attributes ) {$attributes['id'] = 'genesis-nav-custom';
return $attributes;
}
// Custom menu action hook
add_action( 'genesis_header', 'custom_do_nav', 12 );
【在nav标签内添加动态wordpress/genesis菜单,并使其隐藏。】就是这样:)
推荐阅读
- 如何强制WordPress查询满足所有要求()
- 如何在WordPress主题中修复白屏()
- 如何从实时网站中找到wordpress主题名称()
- 致同首席合伙人李惠琦(金融开放与金融改革需要齐头并进)
- kill -9 进程 杀掉僵死进程
- oeasy教您玩转vim - 41 - # 各寄存器
- 部署SFTP
- windows ubuntu uefi dual systemgrub
- fastposter 1.6.0 发布 电商级海报生成器