wordpress下拉菜单，二级菜单制作（wordpress二级菜单设置）

发布时间：2023-04-10 10:40:22

文章来源：快乐收录网

访问次数：

在之前的建网站的教程中，我们给大家讲了如何制作网站导航的二级导航，通过DIV+CSS的方式，可以制作出网站的二级菜单。这种方法是可能帮助我们去制作出内容固定的二级菜单出来，需要手动的修改二级导航里面的内容，才能变成属于我们自己需要的二级导航栏。dp4快乐收录网

今天给广大学习如何做网站的学员介绍另一种更加方便快捷的wordpress下拉菜单制作的方法，它的内容是自动显示我们后台的菜单设置的内容。dp4快乐收录网

dp4快乐收录网

wordpress下拉菜单制作步骤

放一个jquery-xl.js到主题文件夹下的images文件夹；下载地址：https://pan.baidu.com/s/1eQH7EP8 将以下的代码放到自己网站模板头部文件header.php的</head>标签的上方。

删除原有的网站导航的整个DIV框，这个DIV框可以通过火狐浏览器的“审查元素”来找到；将以下的HTML代码放在上一步删除的导航的位置；（相关教程：html视频教程）

,menu_class => navigation,menu_id => "nav_sgBhgn",depth => 5, ) ); ?>dp4快乐收录网

</div> <script type="text/javascript">

var topMenuNum = 0;dp4快乐收录网

$("#nav_sgBhgn li").hover(dp4快乐收录网

function(){dp4快乐收录网

topMenuNum++;dp4快乐收录网

$(this).attr("id","kindMenuHover"+topMenuNum);dp4快乐收录网

$("#kindMenuHover" + topMenuNum + " > ul").show();dp4快乐收录网

$(this).parent().addClass("hover");dp4快乐收录网

},dp4快乐收录网

function(){dp4快乐收录网

$("#"+$(this).attr("id")+" > ul").hide();dp4快乐收录网

$(this).attr("id","");dp4快乐收录网

$(this).parent().removeClass("hover");dp4快乐收录网

}dp4快乐收录网

);dp4快乐收录网

</script>

将以下的CSS样式加入到自己网站模板的style.css的底部。

/*wordpress下拉菜单，二级菜单制作 https://www.xuewangzhan.net/*/dp4快乐收录网

#navnew {line-height: 60px; width: 100%; background: #3598db; height: 60px}dp4快乐收录网

#navnew .navigation {margin:0 auto;width:980px;height:100%;}dp4快乐收录网

#navnew .navigation li {height:60px;line-height:60px;width:100px; z-index: 100; POSITION: relative;text-align:center; FLOAT: left;border-right:1px solid #2f89c5;}dp4快乐收录网

#navnew .navigation li A {display: block; height: 100%;width:100%; TEXT-DECORATION: none;color: #ffffff;font-size:16px;}dp4快乐收录网

#navnew .navigation li:hover{background: #2f89c5;}dp4快乐收录网

#navnew .navigation li ul li,#navnew .navigation li ul li ul li,#navnew .navigation li ul li ul li ul li{border-right:none;border-top:1px solid #2f89c5;}dp4快乐收录网

#navnew .navigation ul {display: none}dp4快乐收录网

#navnew .navigation ul li {line-height: 60px; width: 101px;background: #3598db; height: 60px;}dp4快乐收录网

#navnew .navigation li ul {z-index: 999; POSITION: absolute; width: 100px; display: none; background: #0099ff; TOP: 60px;}dp4快乐收录网

#navnew .navigation li ul ul {z-index: 999; TOP: 0px; left: 101px}

进入网站后台，在左侧有一个菜单的选项，可以创建菜单，通过拖拉就可以随意的修改自己网站的导航和二级导航内容。有些学习如何做网站的学员使用的主题可能没有开启后台菜单功能，如果你进入网站后台后没有“菜单”选项的话，可以在自己网站的模板函数functions.php中加入以下的函数来开启菜单。

//添加菜单功能dp4快乐收录网

if (function_exists(add_theme_support)) {dp4快乐收录网

add_theme_support(nav-menus);dp4快乐收录网

register_nav_menus( array( primary => __( Primary Navigation, primary ) ) );dp4快乐收录网

}

通过以上的步骤，我们可以在自己建网站时创建一个wordpress下拉菜单，如果你想制作三级，四级菜单，方法可以参考网站三级菜单、四级菜单制作。dp4快乐收录网

　　《wordpress下拉菜单，二级菜单制作（wordpress二级菜单设置）》更新于时间：2023-04-10 10:40:22；由本站小编进行发布，目前浏览的小伙伴达到，感谢你们的支持，后期快乐收录网小编会继续为大家更新更多相关的文章，希望广大网友多多关注快乐收录网工作心得栏目，如果觉得本站不错，那就给我们一个分享的支持吧！

wordpress下拉菜单，二级菜单制作（wordpress二级菜单设置）特别声明

本站快乐收录网提供的wordpress下拉菜单，二级菜单制作（wordpress二级菜单设置）都来源于网络，不保证文章的准确性和真实性，同时，对于该文章所造成的影响，不由快乐收录网实际控制，在2023-04-10 10:40:22收录时，该网页上的内容，都属于合规合法，如有侵权违规，可以直接联系网站管理员进行整改或删除，快乐收录网不承担任何责任。

快乐收录网：致力于优质、实用的网络站点资源收集与分享！本文地址：https://nav.klxjz.cn/CMS/WordPress/93491.html转载请注明

标签：

资讯分类