WordPress.org

Ready to get started?Download WordPress

Forums

Ozh' Admin Drop Down Menu
Feature Request: Tiled Background Image! (2 posts)

  1. jonmike
    Member
    Posted 1 year ago #

    Ozh,

    Thanks for the best admin menu plugin available!

    Thought I would drop by and "feature request" an idea-

    ...would you consider adding a simple image tile option for the admin menu bar?

    http://wordpress.org/extend/plugins/ozh-admin-drop-down-menu/

  2. ianarmstrong
    Member
    Posted 1 year ago #

    This can be done from the theme, though Ozh should probably do it himself as well. The solution is to use a CSS gradient with a fallback to flat gray and completely eliminate the outdated graphic approach.

    First, declare an admin stylesheet:

    function customAdmin() {
        $url = get_settings('siteurl');
        $url = $url . '/wp-admin.css';
        echo '<!-- custom admin css -->
              <link rel="stylesheet" type="text/css" href="' . $url . '" />
              <!-- /end custom adming css -->';
    }
    add_action('admin_head', 'customAdmin');

    Then add the following CSS definitions:

    #ozhmenu {
    background: rgb(81,81,81);
    background-image: none;
    background: url(data:image/svg+xml;base64,PD94bWwgdmVyc2lvbj0iMS4wIiA/Pgo8c3ZnIHhtbG5zPSJod…EiIGhlaWdodD0iMSIgZmlsbD0idXJsKCNncmFkLXVjZ2ctZ2VuZXJhdGVkKSIgLz4KPC9zdmc+);
    background: -moz-linear-gradient(top, rgba(81,81,81,1) 0%, rgba(14,14,14,1) 100%);
    background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,rgba(81,81,81,1)), color-stop(100%,rgba(14,14,14,1)));
    background: -webkit-linear-gradient(top, rgba(81,81,81,1) 0%,rgba(14,14,14,1) 100%);
    background: -o-linear-gradient(top, rgba(81,81,81,1) 0%,rgba(14,14,14,1) 100%);
    background: -ms-linear-gradient(top, rgba(81,81,81,1) 0%,rgba(14,14,14,1) 100%);
    background: linear-gradient(to bottom, rgba(81,81,81,1) 0%,rgba(14,14,14,1) 100%);
    filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#515151', endColorstr='#0e0e0e',GradientType=0 );
    border-bottom: 2px solid black;
    
    #ozhmenu img.wp-menu-image {
    height: 18px;
    }

    Ozh may fire its own background second, in which case you will have to use specificity or the !important tag to override it.

Topic Closed

This topic has been closed to new replies.

About this Plugin

About this Topic

Tags

No tags yet.