使用WordPress开发网站项目,很多时候都需要对进行后台定制,今天倡萌主要分享下自定义顶部管理工具条的使用技巧。

注:如无特殊说明,请将下面的代码添加到主题的 functions.php  或者插件的函数文件中。

对所有用户和访客隐藏工具条

1
2
3
4
/*
* 对所有用户和访客隐藏工具条
*/
remove_action( 'init', '_wp_admin_bar_init' );

只对管理员显示工具条

1
2
3
4
5
6
/*
* 只对管理员显示工具条
*/
if ( !current_user_can( 'manage_options' ) ) {
remove_action( 'init', '_wp_admin_bar_init' );
}

只在后台隐藏工具条

1
2
3
4
5
6
/*
* 只在后台隐藏工具条
*/
if ( is_admin() ) {
remove_action( 'init', '_wp_admin_bar_init' );
}

只在前台隐藏工具条

1
2
3
4
5
6
/*
* 只在前台隐藏工具条
*/
if ( !is_admin() ) {
remove_action( 'init', '_wp_admin_bar_init' );
}

多站点管理后台隐藏工具条

1
2
3
4
5
6
/*
* 对多站点后台隐藏工具条
*/
if ( is_network_admin() ) {
remove_action( 'init', '_wp_admin_bar_init' );
}

移除工具条占位高度

隐藏工具条以后,顶部可能会残留 28 像素的空白,你可以使用下面的代码删除空白。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
/*
* 移除工具条占位空白
*/
function remove_adminbar_margin() {
$remove_adminbar_margin = '<style type="text/css">
html { margin-top: -28px !important; }
* html body { margin-top: -28px !important; }
</style>';
echo $remove_adminbar_margin;
}
/* 针对后台 */
if ( is_admin() ) {
remove_action( 'init', '_wp_admin_bar_init' );
add_action( 'admin_head', 'remove_adminbar_margin' );
}
/* 针对前台 */
if ( !is_admin() ) {
remove_action( 'init', '_wp_admin_bar_init' );
add_action( 'wp_head', 'remove_adminbar_margin' );
}

移除工具条默认菜单

下面的代码可以移除WordPress顶部工具条的默认项目,请根据自己的需要选择

1
2
3
4
5
6
7
8
9
10
11
12
function wpdaxue_admin_bar() {
global $wp_admin_bar;
$wp_admin_bar->remove_menu('wp-logo'); //移除Logo
$wp_admin_bar->remove_menu('my-account'); //移除个人中心
$wp_admin_bar->remove_menu('comments'); //移除评论
$wp_admin_bar->remove_menu('my-sites'); //移除我的网站(多站点)
$wp_admin_bar->remove_menu('site-name'); //移除网站名称
$wp_admin_bar->remove_menu('new-content'); // 移除“新建”
$wp_admin_bar->remove_menu('search'); //移除搜索
$wp_admin_bar->remove_menu('updates'); //移除升级通知
}
add_action( 'wp_before_admin_bar_render', 'wpdaxue_admin_bar' );

添加一个简单的菜单

添加一个简单的菜单,并且在设置为新窗口打开

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
/*
* 添加一个简单的菜单
* 自行修改 'title' 和 'href' 的值
*/
function custom_adminbar_menu( $meta = TRUE ) {
global $wp_admin_bar;
if ( !is_user_logged_in() ) { return; }
if ( !is_super_admin() || !is_admin_bar_showing() ) { return; }
$wp_admin_bar->add_menu( array(
'id' => 'custom_menu',
'title' => __( 'Menu Name' ),
'href' => 'http://google.com/',
'meta' => array( target => '_blank' ) )
);
}
add_action( 'admin_bar_menu', 'custom_adminbar_menu', 15 );
/* add_action # 后面的数字表示位置:
10 = 在 Logo 的前面
15 = 在 logo 和 网站名之间
25 = 在网站名后面
100 = 在菜单的最后面
*/

添加一个菜单(只显示图标)

上面的例子是添加一个显示文字的链接,如果你只希望显示一个图标,可以使用下面的代码

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
/*
* Add Icons Instead of Text to the Main Admin Bar
*/
function custom_adminbar_menu( $meta = TRUE ) {
global $wp_admin_bar;
if ( !is_user_logged_in() ) { return; }
if ( !is_super_admin() || !is_admin_bar_showing() ) { return; }
$wp_admin_bar->add_menu( array(
'id' => 'custom_menu',
'title' => __( '<img src="http://domain.com/wp-content/themes/theme_name/images/wpdaxue-icon.gif" width="25" height="25" />' ),
'href' => 'http://www.wpdaxue.com/',
'meta' => array( target => '_blank' ) )
);
}
add_action( 'admin_bar_menu', 'custom_adminbar_menu', 15 );
function custom_menu_css() {
$custom_menu_css = '<style type="text/css">
#wp-admin-bar-custom_menu img { margin:0 0 0 12px; } /** moves icon over */
#wp-admin-bar-custom_menu { width:75px; } /** sets width of custom menu */
</style>';
echo $custom_menu_css;
}
add_action( 'admin_head', 'custom_menu_css' );

注意:第 9 行的 'id' => 'custom_menu' 要和 17、18 行的 #wp-admin-bar-custom_menu  的后半段对应。同时注意修改第 10 行的图片链接。

添加后台管理菜单

通过下面的代码,可以添加任何左边菜单到顶部工具条,支持单站点和多站点模式。这里以“添加 主题编辑 ”为例,更换为其他菜单,请修改里面的 admin_url( 'theme-editor.php' )

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
/*
* 添加快捷菜单到 主题编辑 (支持单站点和多站点)
*/
function add_theme_menu() {
global $wp_admin_bar;
if ( !is_user_logged_in() ) { return; }
if ( !is_super_admin() || !is_admin_bar_showing() ) { return; }
if ( function_exists('is_multisite') && is_multisite() ) {
$wp_admin_bar->add_menu( array(
'id' => 'theme-editor',
'title' => __('Edit Theme'),
'href' => network_admin_url( 'theme-editor.php' ) )
);
}else{
$wp_admin_bar->add_menu( array(
'id' => 'theme-editor',
'title' => __('Edit Theme'),
'href' => admin_url( 'theme-editor.php' ) )
);
}
}
add_action( 'admin_bar_menu', 'add_theme_menu', 100 ); //关于数字 100 ,请查看上一条技巧

添加下拉菜单

添加下拉菜单到工具条,设置为 在新窗口或新标签打开

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
/*
* 添加下拉菜单
* 修改菜单名、链接名和链接地址
*/
function custom_adminbar_menu( $meta = TRUE ) {
global $wp_admin_bar;
if ( !is_user_logged_in() ) { return; }
if ( !is_super_admin() || !is_admin_bar_showing() ) { return; }
$wp_admin_bar->add_menu( array(
'id' => 'custom_menu',
'title' => __( 'Menu Name' ) ) /* 设置菜单名 */
);
$wp_admin_bar->add_menu( array(
'parent' => 'custom_menu',
'id' => 'custom_links',
'title' => __( 'Google'), /* 设置链接名*/
'href' => 'http://google.com/', /* 设置链接地址 */
'meta' => array( target => '_blank' ) )
);
}
add_action( 'admin_bar_menu', 'custom_adminbar_menu', 15 );

添加包含多个链接的子菜单

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
/*
* 添加包含多个链接的子菜单,在新窗口打开链接
* 请修改菜单名和链接地址
*/
function custom_adminbar_menu( $meta = TRUE ) {
global $wp_admin_bar;
if ( !is_user_logged_in() ) { return; }
if ( !is_super_admin() || !is_admin_bar_showing() ) { return; }
$wp_admin_bar->add_menu( array(
'id' => 'custom_menu',
'title' => __( 'Menu Name' ) ) /* 设子菜单名 */
);
/* sub-menu */
$wp_admin_bar->add_menu( array(
'parent' => 'custom_menu',
'id' => 'custom_links',
'title' => __( 'Sub menu') ) /* 设置子菜单名 */
);
/* menu links */
$wp_admin_bar->add_menu( array(
'parent' => 'custom_links',
'title' => 'Google', /* 设置链接名 */
'href' => 'http://google.com/', /* 设置链接地址 */
'meta' => array( target => '_blank' ) )
);
$wp_admin_bar->add_menu( array(
'parent' => 'custom_links',
'title' => 'Yahoo', /* 设置链接名 */
'href' => 'http://yahoo.com/', /* 设置链接地址 */
'meta' => array( target => '_blank' ) )
);
}
add_action( 'admin_bar_menu', 'custom_adminbar_menu', 15 );

在新窗口打开“访问站点”

默认的情况下,点击”访问网站“这个菜单时,是直接在本窗口打开的,你可以使用下面的代码让它默认在新窗口/标签 打开。

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/*
* 新窗口打开:我的网站 > 网站名 > 访问网站
*/
function my_site_links() {
global $wp_admin_bar;
foreach ( (array) $wp_admin_bar->user->blogs as $blog ) {
$menu_id = 'blog-' . $blog->userblog_id;
$wp_admin_bar->add_menu( array(
'parent' => $menu_id,
'id' => $menu_id . '-v',
'title' => __( 'Visit Site' ),
'href' => get_home_url( $blog->userblog_id, '/' ),
'meta' => array( target => '_blank' ) )
);
}
}
add_action( 'wp_before_admin_bar_render', 'my_site_links' );

隐藏“我的站点”的子菜单(多站点)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/*
* 移除多站点的“我的网站”的子菜单: 仪表盘、新文章、管理评论 和 访问文章
*/
function remove_mysites_links () {
global $wp_admin_bar;
foreach ( (array) $wp_admin_bar->user->blogs as $blog ) {
$menu_id_d = 'blog-' . $blog->userblog_id . '-d'; /* Dashboard var */
$menu_id_n = 'blog-' . $blog->userblog_id . '-n'; /* New Post var */
$menu_id_c = 'blog-' . $blog->userblog_id . '-c'; /* Manage Comments var */
$menu_id_v = 'blog-' . $blog->userblog_id . '-v'; /* Visit Site var */
$wp_admin_bar->remove_menu($menu_id_d); /* 移除 仪表盘 */
$wp_admin_bar->remove_menu($menu_id_n); /* 移除 发布新文章 */
$wp_admin_bar->remove_menu($menu_id_c); /* 移除 管理评论 */
$wp_admin_bar->remove_menu($menu_id_v); /* 移除 访问网站 */
}
}
add_action( 'wp_before_admin_bar_render', 'remove_mysites_links' );

添加子菜单到“我的站点”(多站点)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
/*
* 添加子菜单到“我的网站”: Log Out, Media, Links, Pages, Appearance, Plugins, Users, Tools and Settings
*/
function add_mysites_link () {
global $wp_admin_bar;
foreach ( (array) $wp_admin_bar->user->blogs as $blog ) {
$menu_id = 'blog-' . $blog->userblog_id;
/* Add a Log Out Link */
$wp_admin_bar->add_menu( array(
'parent' => $menu_id,
'id' => $menu_id . '-logout',
'title' => __( 'Log Out' ),
'href' => get_home_url( $blog->userblog_id, '/wp-login.php?action=logout' ) )
);
/* Media Admin */
$wp_admin_bar->add_menu( array(
'parent' => $menu_id,
'id' => $menu_id . '-media',
'title' => __( 'Media Admin' ),
'href' => get_home_url( $blog->userblog_id, '/wp-admin/upload.php' ) )
);
/* Links Admin */
$wp_admin_bar->add_menu( array(
'parent' => $menu_id,
'id' => $menu_id . '-links',
'title' => __( 'Links Admin' ),
'href' => get_home_url( $blog->userblog_id, '/wp-admin/link-manager.php' ) )
);
/* Pages Admin */
$wp_admin_bar->add_menu( array(
'parent' => $menu_id,
'id' => $menu_id . '-pags',
'title' => __( 'Pages Admin' ),
'href' => get_home_url( $blog->userblog_id, '/wp-admin/edit.php?post_type=page' ) )
);
/* Appearance Admin */
$wp_admin_bar->add_menu( array(
'parent' => $menu_id,
'id' => $menu_id . '-appearance',
'title' => __( 'Appearance' ),
'href' => get_home_url( $blog->userblog_id, '/wp-admin/themes.php' ) )
);
/* Plugin Admin */
$wp_admin_bar->add_menu( array(
'parent' => $menu_id,
'id' => $menu_id . '-plugins',
'title' => __( 'Plugin Admin' ),
'href' => get_home_url( $blog->userblog_id, '/wp-admin/plugins.php' ) )
);
/* Users Admin */
$wp_admin_bar->add_menu( array(
'parent' => $menu_id,
'id' => $menu_id . '-users',
'title' => __( 'Users Admin' ),
'href' => get_home_url( $blog->userblog_id, '/wp-admin/users.php' ) )
);
/* Tools Admin */
$wp_admin_bar->add_menu( array(
'parent' => $menu_id,
'id' => $menu_id . '-tools',
'title' => __( 'Tools Admin' ),
'href' => get_home_url( $blog->userblog_id, '/wp-admin/tools.php' ) )
);
/* Settings Admin */
$wp_admin_bar->add_menu( array(
'parent' => $menu_id,
'id' => $menu_id . '-settings',
'title' => __( 'Settings Admin' ),
'href' => get_home_url( $blog->userblog_id, '/wp-admin/options-general.php' ) )
);
}
}
add_action( 'wp_before_admin_bar_render', 'add_mysites_link' );

使用 Domain.com 作为显示名称(多站点)

默认情况下,多站点的网站名称都是显示“站点名”,如果你要显示为 Domain.com 这样的,可以使用下面的代码:

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
/*
* 以域名 to Domain.com 作为菜单名
*/
function change_site_names() {
global $wp_admin_bar;
$blue_wp_logo_url = includes_url('images/wpmini-blue.png');
$blavatar = '<img src="' . esc_url($blue_wp_logo_url) . '" alt="' . esc_attr__( 'Blavatar' ) . '" width="16" height="16" class="blavatar"/>';
foreach ( (array) $wp_admin_bar->user->blogs as $blog ) {
$menu_id = 'blog-' . $blog->userblog_id;
$blogname = ucfirst( $blog->domain );
$wp_admin_bar->add_menu( array(
'parent' => 'my-sites-list',
'id' => $menu_id,
'title' => $blavatar . $blogname,
'href' => get_admin_url( $blog->userblog_id ) )
);
}
}
add_action( 'wp_before_admin_bar_render', 'change_site_names' );

移除网站LOGO(多站点)

移除多站点下子站点的logo

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
/*
* Remove the WP Logo from the My Sites Menu
*/
function remove_wplogo_mysites() {
global $wp_admin_bar;
foreach ( (array) $wp_admin_bar->user->blogs as $blog ) {
$menu_id = 'blog-' . $blog->userblog_id;
$blogname = emptyempty( $blog->blogname ) ? $blog->domain : $blog->blogname;
$wp_admin_bar->add_menu( array(
'parent' => 'my-sites-list',
'id' => $menu_id,
'title' => $blogname,
'href' => get_admin_url( $blog->userblog_id ) )
);
}
}
add_action( 'wp_before_admin_bar_render', 'remove_wplogo_mysites' );

修改“我的站点”的logo(多站点)

将logo图片上传到 你主题的 images 文件夹,然后根据实际修改第 10 行的 NEW-ICON-HERE.png

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
/*
* Change the WP Logo Icon within the My Sites Menu to any icon you want
* Update the NEW-ICON-HERE.png name to match the proper file name.
*/
function add_mysites_logo() {
global $wp_admin_bar;
foreach ( (array) $wp_admin_bar->user->blogs as $blog ) {
$menu_id = 'blog-' . $blog->userblog_id;
$blogname = emptyempty( $blog->blogname ) ? $blog->domain : $blog->blogname;
$blavatar = '<img src="' . get_bloginfo('template_directory') . '/images/NEW-ICON-HERE.png" alt="' . esc_attr__( 'Blavatar' ) . '" width="16" height="16" class="blavatar"/>';
$wp_admin_bar->add_menu( array(
'parent' => 'my-sites-list',
'id' => $menu_id,
'title' => $blavatar . $blogname,
'href' => get_admin_url( $blog->userblog_id ) )
);
}
}
add_action( 'wp_before_admin_bar_render', 'add_mysites_logo' );

对访客显示工具条

对没有登录的访客也显示工具条

1
2
3
4
/*
* 对没有登录的访客显示工具条
*/
add_filter( 'show_admin_bar', '__return_true' );

对已注销的用户创建一个菜单

1
2
3
4
5
6
7
8
9
10
11
12
13
14
/*
* Create a menu for Logged Out Users
*/
function loggedout_menu( $meta = TRUE ) {
global $wp_admin_bar;
if ( is_user_logged_in() ) { return false; }
$wp_admin_bar->add_menu( array(
'id' => 'custom_menu',
'title' => __( 'Menu Name' ),
'href' => 'http://google.com/',
'meta' => array( target => '_blank' ) )
);
}
add_action( 'admin_bar_menu', 'loggedout_menu', 15 );

为已注销的用户添加“登录”链接

1
2
3
4
5
6
7
8
9
10
11
12
13
14
/*
* Add a Log In Link for Logged Out Users to the Admin Bar
*/
function add_login_link( $meta = FALSE ) {
global $wp_admin_bar, $blog_id;
if ( is_user_logged_in() ) { return false; }
$wp_admin_bar->add_menu( array(
'id' => 'custom_menu',
'title' => __( 'Login' ),
'href' => get_home_url( $blog_id, '/wp-login.php' ) )
);
}
add_filter( 'show_admin_bar', '__return_true' ); /* turn on adminbar for logged out users */
add_action( 'admin_bar_menu', 'add_login_link', 15 );

修改工具条的透明度

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
/*
* 修改工具条的透明度
*/
function adminbar_opacity() {
$adminbar_opacity = '<style type="text/css">#wpadminbar { filter:alpha(opacity=50); opacity:0.5; }</style>';
echo $adminbar_opacity;
}
/* 后台*/
if ( is_admin() ) {
add_action( 'admin_head', 'adminbar_opacity' );
}
/* 前台 */
if ( !is_admin() ) {
add_action( 'wp_head', 'adminbar_opacity' );
}

鼠标悬停时才显示工具条

隐藏工具条,当鼠标悬停在上面时才显示

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
/*
* Hide the WordPress Admin Bar with CSS, then display the Admin Bar on hover with CSS and jQuery
*/
function hide_adminbar() {
$hide_adminbar = '<script type="text/javascript">
$(document).ready( function() {
$("#wpadminbar").fadeTo( "slow", 0 );
$("#wpadminbar").hover(function() {
$("#wpadminbar").fadeTo( "slow", 1 );
}, function() {
$("#wpadminbar").fadeTo( "slow", 0 );
});
});
</script>
<style type="text/css">
html { margin-top: -28px !important; }
* html body { margin-top: -28px !important; }
#wpadminbar {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=0)";
filter: alpha(opacity=0);
-moz-opacity:0;
-khtml-opacity:0;
opacity:0;
}
#wpadminbar:hover, #wpadminbar:focus {
-ms-filter:"progid:DXImageTransform.Microsoft.Alpha(Opacity=100)";
filter: alpha(opacity=100);
-moz-opacity:1;
-khtml-opacity:1;
opacity:1;
}
</style>';
echo $hide_adminbar;
}
/* wp-admin area */
if ( is_admin() ) {
add_action( 'admin_head', 'hide_adminbar' );
}
/* websites */
if ( !is_admin() ) {
add_action( 'wp_head', 'hide_adminbar' );
}

修改工具条的颜色

下面的例子是将工具条修改为“蓝色”,你可以通过修改颜色的值来改变颜色

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
/*
* Change the Admin Bar Color Scheme
*/
function change_adminbar_colors() {
$change_adminbar_colors = '<style type="text/css">
#wpadminbar *, #wpadminbar{ color:#ffffff;text-shadow:#444444 0 -1px 0; }
#wpadminbar{
background-color:#003399;
background-image:-ms-linear-gradient(bottom,#000033,#003399 5px);
background-image:-moz-linear-gradient(bottom,#000033,#003399 5px);
background-image:-o-linear-gradient(bottom,#000033,#003399 5px);
background-image:-webkit-gradient(linear,left bottom,left top,from(#000033),to(#003399));
background-image:-webkit-linear-gradient(bottom,#000033,#003399 5px);
background-image:linear-gradient(bottom,#000033,#003399 5px);
}
/* menu separators */
#wpadminbar .quicklinks>ul>li{border-right:1px solid #003399;}
#wpadminbar .quicklinks>ul>li>a,#wpadminbar .quicklinks>ul>li>.ab-emptyempty-item{border-right:1px solid #000033;}
#wpadminbar .quicklinks .ab-top-secondary>li{border-left:1px solid #000033;}
#wpadminbar .quicklinks .ab-top-secondary>li>a,#wpadminbar .quicklinks .ab-top-secondary>li>.ab-emptyempty-item{border-left:1px solid #003399;}
/* menu hover color and hover link color */
#wpadminbar.nojs .ab-top-menu>li.menupop:hover>.ab-item,#wpadminbar .ab-top-menu>li.menupop.hover>.ab-item{background:#333333;color:#ffffff;}
#wpadminbar .hover .ab-label,#wpadminbar.nojq .ab-item:focus .ab-label{color:#ffffff;}
#wpadminbar .menupop.hover .ab-label{color:#ffffff;}
/* menu, on mouse over hover colors */
#wpadminbar .ab-top-menu>li:hover>.ab-item,#wpadminbar .ab-top-menu>li.hover>.ab-item,#wpadminbar .ab-top-menu>li>.ab-item:focus,#wpadminbar.nojq .quicklinks .ab-top-menu>li>.ab-item:focus{
color:#fafafa;
background-color:#000033;
background-image:-ms-linear-gradient(bottom,#003399,#000033);
background-image:-moz-linear-gradient(bottom,#003399,#000033);
background-image:-o-linear-gradient(bottom,#003399,#000033);
background-image:-webkit-gradient(linear,left bottom,left top,from(#003399),to(#003399));
background-image:-webkit-linear-gradient(bottom,#003399,#000033);
background-image:linear-gradient(bottom,#003399,#000033);
}
/* menu item links hover color */
#wpadminbar .menupop li:hover,#wpadminbar .menupop li.hover,#wpadminbar .quicklinks .menupop .ab-item:focus,#wpadminbar .quicklinks .ab-top-menu .menupop .ab-item:focus{background-color:#ccffcc;}
/* menu item non-link colors */
#wpadminbar .ab-submenu .ab-item{color:#333333;}
/* menu item link colors */
#wpadminbar .quicklinks .menupop ul li a,#wpadminbar .quicklinks .menupop ul li a strong,#wpadminbar .quicklinks .menupop.hover ul li a,#wpadminbar.nojs .quicklinks .menupop:hover ul li a{color:#0099cc;}
/* my sites hover color */
#wpadminbar .quicklinks .menupop .ab-sub-secondary>li:hover,#wpadminbar .quicklinks .menupop .ab-sub-secondary>li.hover,#wpadminbar .quicklinks .menupop .ab-sub-secondary>li .ab-item:focus{background-color:#dfdfdf;}
/* update menu colors */
#wpadminbar .quicklinks a span#ab-updates{background:#eeeeee;color:#333333;}
#wpadminbar .quicklinks a:hover span#ab-updates{background:#ffffff;color:#000000;}
/* howdy menu */
#wpadminbar .ab-top-secondary{
background-color:#003399;
background-image:-ms-linear-gradient(bottom,#000033,#003399 5px);
background-image:-moz-linear-gradient(bottom,#000033,#003399 5px);
background-image:-o-linear-gradient(bottom,#000033,#003399 5px);
background-image:-webkit-gradient(linear,left bottom,left top,from(#000033),to(#003399));
background-image:-webkit-linear-gradient(bottom,#000033,#003399 5px);
background-image:linear-gradient(bottom,#000033,#003399 5px);
}
/* Howdy menu, username text color in dropdown */
#wpadminbar #wp-admin-bar-user-info .display-name{color:#333333;}
#wpadminbar #wp-admin-bar-user-info .username{color:#999999;}
/* search */
#wpadminbar #adminbarsearch .adminbar-input{color:#ccc;text-shadow:#444 0 -1px 0;background-color:rgba(255,255,255,0);}
#wpadminbar #adminbarsearch .adminbar-input:focus{color:#555;text-shadow:0 1px 0 #fff;background-color:rgba(255,255,255,0.9);}
#wpadminbar.ie8 #adminbarsearch .adminbar-input{background-color:#003399;}
#wpadminbar.ie8 #adminbarsearch .adminbar-input:focus{background-color:#fff;}
#wpadminbar #adminbarsearch .adminbar-input::-webkit-input-placeholder{color:#ddd;}
#wpadminbar #adminbarsearch .adminbar-input:-moz-placeholder{color:#ddd;}
</style>';
echo $change_adminbar_colors;
}
/* wp-admin area */
if ( is_admin() ) {
add_action( 'admin_head', 'change_adminbar_colors' );
}
/* websites */
if ( !is_admin() ) {
add_action( 'wp_head', 'change_adminbar_colors' );
}

PHP类:只为管理员显示工具条(移除占位高度)

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
/*
* PHP Class that enables the Admin Bar for Admins Only and Removes 28px Space
*/
class admins_only_admin_bar {
/*
* Loads when class is called
*/
function __construct() {
/* disables admin bar */
remove_action( 'init', '_wp_admin_bar_init' );
/* calls function to remove 28px space */
add_action( 'admin_head', array( &$this, 'remove_adminbar_margin' ) );
add_action( 'wp_head', array( &$this, 'remove_adminbar_margin' ) );
}
/*
* Removes the 28px margin for the Admin Bar
*/
public function remove_adminbar_margin() {
$remove_adminbar_margin = '<style type="text/css">
html { margin-top: -28px !important; }
* html body { margin-top: -28px !important; }
</style>';
echo $remove_adminbar_margin;
}
}
/* Admins Only - Call Class */
if ( current_user_can( 'manage_options' ) ) {
$display_admin_bar = new admins_only_admin_bar();
}

PHP类:自定义已注销的用户的工具条

为已注销用户(游客)显示工具条、添加登录链接、移除WP Logo、添加自定义菜单

下面的例子,将移除WordPress 的logo、添加一个 登录链接、创建一个包含2个网站名为“Our Other Sites”的下拉菜单

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
/*
* Force Admin Bar for logged out users, add a login link, remove the wp logo, and add a custom link menu
*/
class force_admin_bar {
/*
* Loads when class is called
*/
function __construct() {
/* logged out users only */
if ( is_user_logged_in() ) { return false; }
/* remove wp logo */
add_action( 'wp_before_admin_bar_render', array( &$this, 'remove_wp_logo' ) );
/* remove search icon [uncomment to activate] */
//add_action( 'wp_before_admin_bar_render', array( &$this, 'disable_bar_search' ) );
/* force adminbar to logged out users */
add_filter( 'show_admin_bar', '__return_true' );
/* call function to add login link to admin bar */
add_action( 'admin_bar_menu', array( &$this, 'logged_out_menus' ), 15 );
}
/*
* Menus for logged out users
*/
function logged_out_menus( $meta = FALSE ) {
global $wp_admin_bar, $blog_id;
/* logout menu link */
$wp_admin_bar->add_menu( array(
'id' => 'login_menu',
'title' => __( 'Login' ),
'href' => get_home_url( $blog_id, '/wp-login.php' ) )
);
/* create menus */
$wp_admin_bar->add_menu( array(
'id' => 'custom_menu',
'title' => __( 'Our Other Websites' ) ) /* set the menu name */
);
/* menu link */
$wp_admin_bar->add_menu( array(
'parent' => 'custom_menu',
'id' => 'techNerdia', /* unique id name */
'title' => 'techNerdia', /* Set the link title */
'href' => 'http://technerdia.com/', /* Set the link a href */
'meta' => array( target => '_blank' ) )
);
/* menu link */
$wp_admin_bar->add_menu( array(
'parent' => 'custom_menu',
'id' => 'Google', /* unique id name */
'title' => 'Google', /* Set the link title */
'href' => 'http://google.com/', /* Set the link a href */
'meta' => array( target => '_blank' ) )
);
}
/*
* Remove the WordPress Logo from the WordPress Admin Bar
*/
function remove_wp_logo() {
global $wp_admin_bar;
$wp_admin_bar->remove_menu('wp-logo');
}
/*
* Disable the Search Icon and Input within the Admin Bar [uncomment to activate]
*/
//function disable_bar_search() {
// global $wp_admin_bar;
// $wp_admin_bar->remove_menu('search');
//}
}
/* Call Class */
$force_admin_bar = new force_admin_bar();

将登录链接从左边移动到右边

只针对上面的那个例子

1
2
3
4
5
6
7
8
9
10
11
/*
* Move the Login Link from the left side to the right side within the Admin Bar for logged out users.
*/
function move_login_link() {
$move_login_link = '<style type="text/css">
#wpadminbar #wp-admin-bar-login_menu{float:right}
}
</style>';
echo $move_login_link;
}
add_action( 'wp_head', 'move_login_link' );

参考资料:http://technerdia.com/1140_wordpress-admin-bar.html

黄聪:自定义WordPress前台、后台顶部菜单栏管理工具条的技巧的更多相关文章

  1. 黄聪:自定义WordPress顶部管理工具条的技巧(转)

    使用WordPress开发网站项目,很多时候都需要对进行后台定制,今天倡萌主要分享下自定义顶部管理工具条的使用技巧. 注:如无特殊说明,请将下面的代码添加到主题的 functions.php  或者插 ...

  2. 黄聪:wordpress前台自定义用户,调用wp_editor上传附件提示【抱歉,出于安全的考虑,不支持此文件类型】错误。

    1.直接禁用文件类型检测,在wp-config.php文件中,添加这样一句代码define('ALLOW_UNFILTERED_UPLOADS', true); 2.在functions.php里面, ...

  3. 黄聪:wordpress登录后台后load-scripts.php载入缓慢

    今天一个微信群里一个好友问大鸟,他的wordpess后台载入非常缓慢,缓慢到什么程度,我们看图: 这个真的是超级慢了,这类问题怎么解决呢,我们登录后台后,按下F12打开控制台,接着点击network, ...

  4. 黄聪:《跟黄聪学WordPress插件开发》

    续<跟黄聪学WordPress主题开发>之后,又一个作品完成!<跟黄聪学Wordpress插件开发>,国内最好的Wordpress插件开发视频教程!! 目录预览: WordPr ...

  5. 黄聪:《跟黄聪学WordPress主题开发》

    又一个作品完成!<跟黄聪学Wordpress主题开发>,国内最好的Wordpress主题模版开发视频教程!! 目录预览: WordPress官方源文件层式结构讲解 WordPress数据库 ...

  6. 黄聪:wordpress教程

    又一个作品完成!<跟黄聪学Wordpress主题开发>,国内最好的Wordpress主题模版开发视频教程!! 目录预览: WordPress官方源文件层式结构讲解 WordPress数据库 ...

  7. WordPress前台后台出现一片空白的原因以及解决办法

    WordPress前台后台出现空白的可能原因有以下: 这个问题,一般是在进行以下操作后出现的: 1.网站更换新主题2.网站安装或升级插件3.升级了Wordpress版本 其实问题的根源在于你的主题.插 ...

  8. 黄聪:WordPress 后台发布文章时提示用户选择分类

    很多用户在后台发布文章,常常会忘记选择分类,所以很有必要添加一个提醒功能,如果没有选择分类,点击发布时,就显示一个提示信息.要实现这个功能,只要将下面的代码添加到主题的 functions.php 即 ...

  9. 黄聪:wordpress后台加载ajax.googleapis.com导致打开速度很慢的解决方案

    打开wordpress后台,发现很卡,通过开发者工具看到是因为加载http://ajax.googleapis.com/ajax/libs/jqueryui/1.10.4/themes/smoothn ...

随机推荐

  1. linux使用vi浏览python源码

    一.背景 2018/8/15,这一天要分析一个python项目,因此需要浏览代码,而我使用的是ubuntu 16.04,于是作此文 二.步骤 2.1 获取生成tags文件的脚本 http://svn. ...

  2. sqlite的时间筛选字段

    唉,需要不停的踩坑呀 commandText = commandText + string.Format("where [CollectDateTime] <'{0}' and [Co ...

  3. scrapy中的canonicalize_url【转】

    转自:http://www.leyle.com/archives/canonicalize_url.html 思考一下:对url进行规范化处理是否是必须的?因为这一步处理涉及到编码转换,对于一个网页的 ...

  4. hdu 5701 中位数计数 思路题

    中位数计数 Time Limit: 12000/6000 MS (Java/Others)    Memory Limit: 65536/65536 K (Java/Others)Total Subm ...

  5. python 返回列表中的偶数

    def is_even_num(l): enum = [] for n in l: == : enum.append(n) return enum print(is_even_num([, , , , ...

  6. Java之试题

    1.面向对象编程的三大特性是什么? 2.String 和StringBuffer的区别 3.说出ArrayList,Vector, LinkedList的存储性能和特性 4.Collection 和 ...

  7. 递推-练习1--noi1760 菲波那契数列(2)

    递推-练习1--noi1760 菲波那契数列(2) 一.心得 二.题目 1760:菲波那契数列(2) 总时间限制:  1000ms 内存限制:  65536kB 描述 菲波那契数列是指这样的数列: 数 ...

  8. hdu 5696 区间的价值

    套路题 求出来以每个数为最大值/最小值时的一个区间范围, 然后枚举每个数为最大值的情况更新即可, 但是对于重复数的话需要特判一下, 假如用map记录来特判复杂度就是$O(nlogn)$, 不过题目说了 ...

  9. HDU-5492 Find a path (枚举+DP)

    Problem Description Frog fell into a maze. This maze is a rectangle containing N rows and M columns. ...

  10. 基于Oracle的SQL优化(崔华著)-整理笔记-第5章“Oracle里的统计信息”

    第5章“Oracle里的统计信息” 详细介绍了Oracle数据库里与统计信息相关的各个方面的内容,包括 Oracle数据库中各种统计信息的分类.含义.收集和查看方法,以及如何在Oracle数据库里正确 ...