如何从前台更改管理栏的悬停(焦点)颜色？

时间：2016-11-17 作者：Fotogênicas Brasil

我正在从前端设置adminbar的样式，我按照一些教程完成了这项工作。我唯一没有做到的就是将管理栏的默认蓝色文本悬停颜色和灰色背景悬停颜色从Wordpress更改为我的自定义颜色。

当我将鼠标光标放在管理栏的某个项目中时，它会继续显示默认的蓝色和灰色文本以及背景颜色。

这是我在函数中的代码。我的主题的php

add_action(\'wp_head\', \'change_bar_color1\');

function change_bar_color1() {

?>

<style>
#wpadminbar .ab-empty-item, 
#wpadminbar a.ab-item, 
#wpadminbar > #wp-toolbar span.ab-label, 
#wpadminbar > #wp-toolbar span.noticon {
    color: #FFFFFF;
}
#wpadminbar{
    background:#ff6000;
    border-top:2px solid #000000;
    border-bottom:2px solid #000000;
    border-left:2px solid #ff6000;
    border-right:2px solid #ff6000
}
#wpadminbar .quicklinks ul li a:hover {background:#ffffff}
#wpadminbar .ab-top-menu > li.hover > .ab-item,
#wpadminbar .ab-top-menu > li.menupop.hover > .ab-item,
#wpadminbar .ab-top-menu > li:hover > .ab-item,
#wpadminbar .ab-top-menu > li >.ab-item:focus,
#wpadminbar-nojs .ab-top-menu > li.menupop:hover > .ab-item,
#wpadminbar.nojq .quicklinks .ab-top-menu > li > .ab-item:focus { 
    color:#fff;background:#ffa948
}
#wpadminbar .menupop .ab-sub-wrapper {
    background:#fc8805;
    border-bottom:2px solid #ff6000;
    border-left:2px solid #000000;
    border-right:2px solid #000000
}
#wpadminbar .ab-submenu .ab-item,
#wpadminbar .quicklinks .menupop ul li a,
#wpadminbar .quicklinks .menupop.hover ul li a,
#wpadminbar-nojs .quicklinks .menupop:hover ul li a {
    color:#000000
}
#wpadminbar .menupop .menupop > .ab-item:hover:before,
#wpadminbar .quicklinks .menupop ul li a:focus,
#wpadminbar .quicklinks .menupop ul li a:focus strong,
#wpadminbar .quicklinks .menupop ul li a:hover,
#wpadminbar .quicklinks .menupop ul li a:hover strong,
#wpadminbar .quicklinks .menupop.hover ul li a:focus,
#wpadminbar .quicklinks .menupop.hover ul li a:hover,
#wpadminbar .quicklinks li a:hover .blavatar,
#wpadminbar li .ab-item:focus:before,
#wpadminbar li a:focus .ab-icon:before,
#wpadminbar li.hover .ab-icon:before,
#wpadminbar li.hover .ab-item:after,
#wpadminbar li.hover .ab-item:before,
#wpadminbar li:hover #adminbarsearch:before,
#wpadminbar li:hover .ab-icon:before,
#wpadminbar li:hover .ab-item:after,
#wpadminbar li:hover .ab-item:before,
#wpadminbar.nojs .quicklinks .menupop:hover ul li a:focus,
#wpadminbar.nojs .quicklinks .menupop:hover ul li a:hover {
    color:#ff0000
}
#wpadminbar .quicklinks .menupop ul.ab-sub-secondary,
#wpadminbar .quicklinks .menupop ul.ab-sub-secondary .ab-submenu {
     background:#ffb45f
}

</style>
<?php

 }

1 个回复
最合适的回答,由SO网友:jgraup 整理而成

将挂钩切换到[\'admin_bar_menu\'] 制造东西!important.

<小时>

add_action( \'admin_bar_menu\', \'change_bar_color1\' );

function change_bar_color1() {

    ?>

    <style>
        #wpadminbar .ab-empty-item, #wpadminbar a.ab-item, #wpadminbar > #wp-toolbar span.ab-label, #wpadminbar > #wp-toolbar span.noticon {
            color: #FFFFFF !important;
        }

        #wpadminbar {
            background: #ff6000 !important;
            border-top: 2px solid #000000;
            border-bottom: 2px solid #000000;
            border-left: 2px solid #ff6000;
            border-right: 2px solid #ff6000
        }

        #wpadminbar .quicklinks ul li a:hover {
            background: #ffffff
        }

        #wpadminbar .ab-top-menu > li.hover > .ab-item, #wpadminbar .ab-top-menu > li.menupop.hover > .ab-item, #wpadminbar .ab-top-menu > li:hover > .ab-item, #wpadminbar .ab-top-menu > li > .ab-item:focus, #wpadminbar-nojs .ab-top-menu > li.menupop:hover > .ab-item, #wpadminbar.nojq .quicklinks .ab-top-menu > li > .ab-item:focus {
            color: #fff !important;
            background: #ffa948 !important;
        }

        #wpadminbar .menupop .ab-sub-wrapper {
            background: #fc8805;
            border-bottom: 2px solid #ff6000;
            border-left: 2px solid #000000;
            border-right: 2px solid #000000
        }

        #wpadminbar .ab-submenu .ab-item, #wpadminbar .quicklinks .menupop ul li a, #wpadminbar .quicklinks .menupop.hover ul li a, #wpadminbar-nojs .quicklinks .menupop:hover ul li a {
            color: #000000 !important;
        }

        #wpadminbar .menupop .menupop > .ab-item:hover:before, #wpadminbar .quicklinks .menupop ul li a:focus, #wpadminbar .quicklinks .menupop ul li a:focus strong, #wpadminbar .quicklinks .menupop ul li a:hover, #wpadminbar .quicklinks .menupop ul li a:hover strong, #wpadminbar .quicklinks .menupop.hover ul li a:focus, #wpadminbar .quicklinks .menupop.hover ul li a:hover, #wpadminbar .quicklinks li a:hover .blavatar, #wpadminbar li .ab-item:focus:before, #wpadminbar li a:focus .ab-icon:before, #wpadminbar li.hover .ab-icon:before, #wpadminbar li.hover .ab-item:after, #wpadminbar li.hover .ab-item:before, #wpadminbar li:hover #adminbarsearch:before, #wpadminbar li:hover .ab-icon:before, #wpadminbar li:hover .ab-item:after, #wpadminbar li:hover .ab-item:before, #wpadminbar.nojs .quicklinks .menupop:hover ul li a:focus, #wpadminbar.nojs .quicklinks .menupop:hover ul li a:hover {
            color: #ff0000 !important;
        }

        #wpadminbar .quicklinks .menupop ul.ab-sub-secondary, #wpadminbar .quicklinks .menupop ul.ab-sub-secondary .ab-submenu {
            background: #ffb45f !important;
        }

    </style>

    <?php
}

标签： wp-admin   admin-bar   小码农  

相关推荐

在将代码添加到函数后无法登录WordPress wp-admin。php

我在函数末尾添加以下代码。php文件，用于根据自定义帖子的帖子标题填充分类法。问题是，当我添加代码时，尝试登录wp admin时会出现以下错误。非常感谢您能帮助我们弄清楚为什么会发生这种情况。Error:错误：由于意外输出，Cookie被阻止。有关帮助，请参阅此文档或尝试支持论坛。Code: <?php function update_custom_terms($post_id) { // only update terms if