WordPress下拉菜单失效解决办法

文章首发及后续更新:https://mwhls.top/769.html
新的更新内容请到mwhls.top查看。
如果没有图片请到上方的文章首发页面查看。

言简意赅

有插件将css优化了,关掉这个选项或这个插件即可。

不是所有优化都会产生错误。

例如,在Autoptimize 设置中,下面的选项会导致下拉菜单失效:

内联所有 CSS 内联所有 CSS 是解决 CSS 渲染阻塞的简便方法,但通常不建议这样做,因为 HTML 大小显著增加。此外,此操作可能会将元标记向下推迟到 Facebook 和 Whatsapp 找不到它们的位置,从而在共享时找不到缩略图。
好的,下面是一个简单的WordPress导航自适应下拉菜单的代码示例。 1. 首先,您需要在您的WordPress主题中添加以下代码片段以启用WordPress导航菜单: ```php <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu', 'fallback_cb' => '__return_false', ) ); ?> ``` 2. 然后,在您的CSS样式表中添加以下代码片段来创建自适应下拉菜单: ```css /* 隐藏下拉菜单 */ .nav-menu ul { display: none; } /* 显示当前菜单项下的下拉菜单 */ .nav-menu li:hover > ul { display: block; } /* 隐藏顶级菜单项下的下拉箭头 */ .nav-menu li.menu-item-has-children > a:after { display: none; } /* 显示下拉菜单项的右侧箭头 */ .nav-menu li.menu-item-has-children > ul:before { content: '\f107'; font-family: 'FontAwesome'; font-size: 12px; display: inline-block; margin-right: 5px; } ``` 3. 最后,您需要在您的WordPress导航菜单中添加“子菜单”类以指示该菜单项包含下拉菜单。例如: ```php <?php wp_nav_menu( array( 'theme_location' => 'primary', 'menu_class' => 'nav-menu', 'fallback_cb' => '__return_false', 'items_wrap' => '<ul id="%1$s" class="%2$s">%3$s<li class="menu-item-has-children"><a href="#">Dropdown Menu</a><ul class="sub-menu">%4$s</ul></li></ul>', ) ); ?> ``` 请注意,上面的代码中,我们在WordPress导航菜单中手动添加了一个包含子菜单的“Dropdown Menu”菜单项。 希望这个简单的代码示例能够帮助您创建一个自适应的WordPress导航下拉菜单
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值