湘龙工作室提供长沙做网站,长沙建站,长沙网站开发,软件制作,网站优化,域名注册,网络空间
长沙做网站

利用wordpress做网站制作二级导航菜单的方法

发布时间:2015/05/21 来源:长沙建站

 很多新手朋友还不会做二级导航菜单的调用,建站和网站优化是息息相关的,建站和网站优化结合,可以对网站内部优化做出调整,促进做网站优化的排名。
 
1、新建 functions.php 函数文件并添加以下代码:
<?php
//自定义菜单
register_nav_menus(
array(
‘header-menu’ => __( ‘导航自定义菜单’ ),
)
);?>
2、把导航位置的li标签都删除掉,换上调用代码:
<?php wp_nav_menu( array( ‘container’ => ”,’menu_class’ => ‘navigation’,’menu_id’ => ‘nav_sgBhgn’) ); ?>
3、添加一个jquery库,放在body开始和结束的适合的位置即可:
<script type=”text/jscript”>
$(document).ready(function(){
$(‘ul.navigation li’).hover(function(){
$(this).find(‘ul:first’).slideDown(200);//显示二级菜单,括号中的数字表示下拉菜单完全显示出来需要200毫秒。
$(this).addClass(“hover”);
},function(){
$(this).find(‘ul’).css(‘display’,’none’);
$(this).removeClass(“hover”);
});
function hide_submenu(){
$(‘ul.navigation li’).find(‘ul’).css(‘display’,’none’);//红色标注改为当前导航ul的class名称
}
$(‘ul.navigation li li:has(ul)’).find(“a:first”).append(“”);
document.onclick = hide_submenu;
});
</script>
4、使用jquery库文件加载,大家可以测试一下模板打开的速度,哪个快用那个:
谷歌加载:<script src=”http://ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js” type=”text/javascript”></script>
百度加载:<script type=”text/javascript” src=”//libs.baidu.com/jquery/2.0.3/jquery.min.js”></script>
新浪加载:<script type=”text/javascript” src=”//lib.sinaapp.com/js/jquery/1.7.2/jquery.min.js”></script>
5、添加CSS样式:
/* 二级菜单 */
.sub-menu{
display:none;/*初始状态下隐藏子目录*/
position:absolute;/*显示最顶层*/
}
.sub-menu li{
width:100%;/*显示子目录宽度/*针对IE6*/
clear:both;/*垂直显示*/
background:#000;/*子目录背景颜色*/
}
wp网站二级导航菜单制作完成。大家根据主题的不同,用火狐浏览器定位,做出微调的动作即可。
做网站版权所有 2009-2015 湘ICP备11020044号   sitemap
地址:长沙市天心区五一西路189号锦绣中环29楼(已搬至岳麓区金星北路89号)   邮编:410001
电话:0731-82067301   QQ:2668200050   Email:longyun1077@163.com
湘龙工作室为您提供:长沙做网站,长沙建站,长沙网站开发,软件制作,网站优化,域名注册,网络空间服务
Copyright 2002-2010 长沙做网站www.csjwang.com. 版权所有
长沙做网站多少钱   长沙做网站公司   长沙做网站价格   长沙做网站的 培训班管理软件
分享到: