之前道招网一直是使用的是此主题simple-m的默认的设置,即是页面导航。目前是分类导航+页面导航,并且都支持二级子分类和二级子页面哦。实现这个功能要用到两个函数
[code]<!-- 页面导航菜单 START -->
<div id="menu">
<div class="menub">
<ul>
<li<?php if (is_home()) { echo ' class="current-cat"';} ?>><a title="<?php _e('Home', 'default'); ?>" href="<?php echo get_settings('home'); ?>/"><?php _e('Home', 'default'); ?></a></li>
<?php
$currentcategory = '';

// 以下这行代码用于在导航栏添加分类列表,
if (!is_page() && !is_home()) {
$catsy = get_the_category();
$myCat = $catsy[0]->cat_ID;
$currentcategory = '&current_category='.$myCat;
}
wp_list_categories('depth=2&title_li=&show_count=0&hide_empty=0'.$currentcategory);

// 以下这行代码用于在导航栏添加页面列表
wp_list_pages('depth=2&title_li=&sort_column=menu_order');

?><li><a rel="nofollow" href="<?php bloginfo('url'); ?>/?random" title="随便看看" target="_blank">随便看看</a></li><div id="close-sidebar"><li class="close-bar" style="float:right;"><a rel="nofollow" href="/daozhao/none" title="隐藏侧边栏">隐藏侧边栏</a></li>
</ul>
</div>
</div>
<!-- 页面导航菜单 END -->[/code]
然后就是css来设置这个menub了,
[code]#menu{width:960px;margin:10px auto 0px;border:1px #aaa;-webkit-box-shadow:#ccc 0 0 5px;-moz-box-shadow:#CCC 0 0 5px;box-shadow:#CCC 0 0 5px;background:#FFF;height:35px}
/*#menu{width:960px;margin:10px auto 0px;border:1px solid #aaa;-webkit-box-shadow:#ccc 0 0 5px;-moz-box-shadow:#CCC 0 0 5px;box-shadow:#CCC 0 0 5px;background:#FFF;height:35px}*/
#footer{width:960px;margin:30px auto 10px;border:1px solid #aaa;-webkit-box-shadow:#CCC 0 0 5px;-moz-box-shadow:#CCC 0 0 5px;box-shadow:#CCC 0 0 5px;background:#FFF;height:35px}
#menu ul li,#footer ul li{float:left;text-align:center;min-width:57px}
#menu ul li a,#footer ul li a{font-size:14px;display:block;padding:7px 14px;white-space:nowrap}
#menu ul li:hover a,#footer ul li:hover a{transform:rotate(6deg);-webkit-transform:rotate(6deg);-moz-transform:rotate(6deg);-o-transform:rotate(6deg)}
#menu ul li:hover,#footer ul li:hover{background:#f2f2f2;-webkit-border-radius:5px;-moz-border-radius:5px;border-radius:5px}
#menu ul li.current-cat a,.current_page_item a{color:#1ba1e2}
.menub{font-size:12px;position:relative;z-index:100;}
.menub ul{list-style:none;}
.menub li {float:left;position:relative;}
.menub ul ul {visibility:hidden;position:absolute;}
.menub table {position:absolute; top:0; left:0;}
.menub ul li:hover ul,
.menub ul a:hover ul{visibility:visible;}
.menub a{display:block;background:#ffffff;padding:0px;margin:0px;color:#777777;text-decoration:none;}
.menub a:hover{background:#f2f2f2;color:#f09609;}
.menub ul ul{}
.menub ul ul li {clear:both;text-align:left;font-size:12px;}
.menub ul ul li a{display:block;width:100px;height:13px;margin:0;border-bottom:1px solid #000000;}
.menub ul ul li a:hover{border:0;background:#bce27f;}[/code]


发表评论

电子邮件地址不会被公开。 必填项已用*标注