在默认的二十一十二主题中,当浏览器/屏幕宽度小于 600 像素并且功能不同时,顶部主菜单会变为一个按钮。我不知道这个替代菜单的代码控制或样式。
有人可以帮我找到一种禁用/编辑它的方法吗?
这是由 /navigation.js 脚本处理的。
负责此的线路是这样的:
<script src="http://wp-themes.com/wp-content/themes/twentytwelve/js/navigation.js?ver=1.0" type="text/javascript">
您可以在 functions.php 的第 103 行禁用它:
wp_enqueue_script( 'twentytwelve-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '1.0', true );
像这样评论它:
// wp_enqueue_script( 'twentytwelve-navigation', get_template_directory_uri() . '/js/navigation.js', array(), '1.0', true );
话虽这么说,我真的不明白为什么有人要禁用它,但我想这与问题无关..
编辑我:
正如@Lucky Son 正确评论的那样,您应该使用wp_deregister_script()
wp_deregister_script( 'twentytwelve-navigation' )
好的,我已经设法弄清楚是什么控制了这个,我不确定它是否完全回答了我原来的问题,但我会分享我现在所知道的......
我相信它主要由主题 style.css 中的媒体查询控制。在本节中@media screen and (min-width: 600px)
,您将在屏幕/浏览器宽度超过 600 像素时找到导航菜单的样式,一旦宽度低于 600 像素,替代样式由主题 CSS 文件主体中的 CSS 声明控制,在第 578 行附近:/* Navigation Menu */
。
按钮的外观也设置在@media screen and (min-width: 600px)
代码下,.menu-toggle {display: none;}
即它隐藏在 600px 以上,一旦宽度低于 600px,就像以前一样,它会出现(不再设置为 display:none)并使用主体中的样式CSS 文件,在第 602 行附近。
因此,如果您想完全禁用该按钮,您可以将其设置为.menu-toggle {display: none !important;}
适用于所有屏幕宽度,并且如果您希望主导航菜单的外观保持固定,请确保它也适用于所有屏幕宽度,确保它覆盖所有屏幕宽度下的菜单样式@media screen and (min-width: 600px)
。您可以通过在媒体查询块之后编写代码来覆盖它。也可以在此处找到有关覆盖 CSS 媒体查询的有用答案。
上述解决方案不起作用。这似乎只是阻止菜单按钮起作用。我正在尝试做的(我假设 OP 也是如此)是防止它添加丑陋的菜单按钮,并且只使用与桌面相同的导航。
我的网站顶部只有三个按钮,可以轻松适应我的移动屏幕,相反,我得到了一个巨大的按钮,可以打开一个巨大的下拉菜单。这有零逻辑。几乎没有二十一十二主题在默认情况下将“留下回复”按钮放在帖子顶部的逻辑。愚蠢的设计师。
如果你问我最简单的解决方案是添加 min-width: 960px; 在 CSS 中,因此它不会在 960 像素以下调整网站主体的大小。
@media screen and (min-width: 600px) {
.site {
margin: 0 auto;
max-width: 960px;
min-width: 960px; --- THIS LINE ADDED
max-width: 68.571428571rem;
overflow: hidden;
}
应用移动插件并禁用菜单可能是谨慎的。从而允许用户选择。我想这取决于菜单中的元素。