以前就知道wp3.0自定义菜单功能可以自己设置css类,对应不同的样式。我现在想随机指定菜单背景颜色,好用在新主题Abook的导航菜单上,研究了下如何给wp3.0以上的菜单加上随机颜色,分析了下wp的源代码,结果找到了nav_menu_css_class这个地方,加上个钩子搞定。

QQ截图20110823182022

下面这段放function.php里面,给菜单项加上对应的随机css class。

<?php 

/**
    给nav菜单加上不同的颜色by winy 

*/ 

function Colorfullnav($classes){ 

$c = array(1,2,3,4,5,6,7,8,9); 

$classes[]= 'menu-item-color_' .$c[mt_rand(0, count($c)-1)]; 

return $classes; 

} 

add_filter('nav_menu_css_class', 'Colorfullnav');

然后在style.css里面设置颜色代码,例如:

.menu-item-color_1 a{background: #F99D35;}
.menu-item-color_2 a{background: #FB353E;}
.menu-item-color_3 a{background: #301141;}
.menu-item-color_4 a{background: #388CDE;}
.menu-item-color_5 a{background: #000000;}
.menu-item-color_6 a{background: #FE0096;}
.menu-item-color_7 a{background: #1BA0E1;}
.menu-item-color_8 a{background: #339933;}
.menu-item-color_9 a{background: #E91104;}

效果可见Abook现在的菜单背景颜色,仿标签,花花绿绿的….

进一步思考:现在的问题是如何保证不同时出现一个颜色呢?我知道增加颜色种类可以减少几率。。。请各位朋友指教

  1. 淘博客 (2011.10.21 at 17:50) 9楼

    很实用的功能,有时间试试。。。

  2. 张全s'blog (2011.12.26 at 03:04) 10楼

    3.3的不行~

评论分页: 1 2

发布评论

邮箱(必填)

换个背景