Skip to:
Content
Pages
Categories
Search
Top
Bottom

Adminbar in the footer.


  • MJ
    Participant

    @jimcale

    Hello everyone.

    I would appreciate if anyone can help me with how i can move the Adminbar from top to the bottom. thanks.

Viewing 6 replies - 1 through 6 (of 6 total)

  • r-a-y
    Keymaster

    @r-a-y

    Requires some CSS knowledge.

    You can probably override this setting in your child theme’s stylesheet (I’m assuming you already use a child theme!).

    Don’t know what a child theme is?

    https://codex.buddypress.org/how-to-guides/building-a-buddypress-child-theme/

    When you’ve created a child theme, add this to your child theme’s stylesheet:

    #wp-admin-bar {bottom:0 !important;}
    #wp-admin-bar ul li ul {bottom:23px !important;}


    MJ
    Participant

    @jimcale

    thanks Ray, i am using default theme. my css knowledge is very limited. i tried pasting that code into defualt.css and adminbar just disappeared.


    r-a-y
    Keymaster

    @r-a-y

    Create a child theme (instruction link is above), then paste that CSS snippet in your child theme’s stylesheet.


    MJ
    Participant

    @jimcale

    Ok thanks alot.


    Dominik Matus
    Participant

    @dominikmatus

    You must have this :

    body {
    padding-top: 25px;
    }

    #wp-admin-bar {
    bottom: 0 !important;
    position: fixed !important;
    top: auto !important;
    }
    #wp-admin-bar ul { /* all lists */
    bottom: 24px;
    }

    #wp-admin-bar ul li:hover ul ul, #wp-admin-bar li.sfhover ul li ul {
    left: -999em;
    bottom: auto;
    }

    This is my style of admin bar:

    #wp-admin-bar {
    left: 0;
    z-index: 99;
    height: 25px;
    font-size: 11px;
    width: 100%;
    z-index: 1000;
    bottom: 0 !important;
    position: fixed !important;
    top: auto !important;
    }
    #wp-admin-bar .padder {
    position: relative;
    padding: 0;
    width: 100%;
    margin: 0 auto;
    background: url( images/red.png );
    height: 25px;
    }
    body#bp-default #wp-admin-bar .padder {
    min-width: 960px;
    max-width: 1250px;
    }

    body#bp-default.activity-permalink #wp-admin-bar .padder {
    min-width: 960px;
    max-width: 960px;
    }

    #wp-admin-bar * { z-index: 999; }

    #wp-admin-bar div#admin-bar-logo {
    position: absolute;
    top: 5px;
    left: 10px;
    }

    #wp-admin-bar a img {
    border: none;
    }

    #wp-admin-bar li {
    list-style: none;
    margin: 0;
    padding: 0;
    line-height: 100%;
    text-align: left;
    }

    #wp-admin-bar li a {
    padding: 7px 15px 7px 15px;
    color: #CFB8A8;
    text-decoration: none;
    font-size: 11px;
    }
    #wp-admin-bar li.alt { border: none; }

    #wp-admin-bar li.no-arrow a {
    padding-right: 15px;
    }

    /*#wp-admin-bar ul li ul li a span {
    display: none;
    }*/

    #wp-admin-bar li:hover, #wp-admin-bar li.hover {
    position: static;
    }

    #admin-bar-logo {
    float: left;
    font-weight: bold;
    font-size: 11px;
    padding: 5px 8px;
    margin: 0;
    text-decoration: none;
    color: #CFB8A8;
    }
    body#bp-default #admin-bar-logo { padding: 2px 8px; }

    /*******************/

    #wp-admin-bar ul { /* all lists */
    margin: 0;
    list-style: none;
    line-height: 1;
    cursor: pointer;
    height: auto;
    padding: 0;
    bottom: 24px;
    }

    #wp-admin-bar ul li { /* all list items */
    padding: 0;
    float: left;
    position: relative;
    background: url( images/admin-menu-arrow.gif ) 88% 53% no-repeat;
    padding-right: 11px;
    }
    #wp-admin-bar ul li.no-arrow {
    background: none;
    padding-right: 0;
    }

    #wp-admin-bar ul li ul li {
    background-image: none;
    }

    #wp-admin-bar ul li.align-right {
    position: absolute;
    right: 0;
    }

    #wp-admin-bar ul li a {
    display: block;
    }

    #wp-admin-bar ul.main-nav li:hover, #wp-admin-bar ul.main-nav li.sfhover, #wp-admin-bar ul.main-nav li ul li.sfhover {
    background-color: #333;
    }

    /* second-level lists */

    #wp-admin-bar ul li ul {
    position: absolute;
    width: 185px;
    left: -999em;
    margin-left: 0;
    background: #333;
    border: 1px solid #222;
    -moz-box-shadow: 0 4px 8px rgba(0, 0, 0, 0.1);
    -webkit-box-shadow:0 4px 8px rgba(0, 0, 0, 0.1);
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    -moz-border-radius-topleft: 0;
    -webkit-border-top-left-radius: 0;
    -moz-border-radius-topright: 0;
    -webkit-border-top-right-radius: 0;
    }
    #wp-admin-bar ul li > ul {
    border-top: none;
    }

    #wp-admin-bar ul li ul a {
    color: #eee;
    }

    #wp-admin-bar ul li ul li {
    float: left;
    width: 174px;
    margin: 0;
    }
    #wp-admin-bar ul li ul li:hover a {
    color: #fff;
    }

    #wp-admin-bar ul li div.admin-bar-clear {
    clear: both;
    }

    #wp-admin-bar ul.main-nav li ul li:hover, #wp-admin-bar ul.main-nav li ul li.sfhover, #wp-admin-bar ul.main-nav li ul li.sfhover {
    background-color: #222;
    }

    /* third-and-above-level lists */

    #wp-admin-bar ul li ul ul {
    margin: -25px 0 0 184px;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    }
    #wp-admin-bar ul li ul li:hover ul li a {
    color: #eee;
    }
    #wp-admin-bar ul li ul li ul li:hover a {
    color: #fff;
    }

    #wp-admin-bar ul li:hover ul, #wp-admin-bar ul li ul li:hover ul, #wp-admin-bar ul li.sfhover ul, #wp-admin-bar ul li ul li.sfhover ul {
    left: auto;
    }

    #wp-admin-bar ul li.align-right:hover ul {
    right: 0;
    }

    #wp-admin-bar ul li:hover ul ul, #wp-admin-bar li.sfhover ul li ul {
    left: -999em;
    bottom: auto;
    }

    /* Menu item css */

    #wp-admin-bar img.avatar {
    float: left;
    margin-right: 8px;
    }

    #wp-admin-bar span.activity {
    display: block;
    margin-left: 34px;
    padding: 0;
    }

    #wp-admin-bar ul.author-list li a { height: 17px; }

    #wp-admin-bar ul li#bp-adminbar-notifications-menu a span {
    padding: 0 6px;
    margin-left: 2px;
    background: #fff;
    color: #000;
    -moz-border-radius: 3px;
    -webkit-border-radius: 3px;
    border-radius: 3px;
    }


    JordashTalon
    Member

    @jordashtalon

    @dominikmatus Thanks, that works pretty good.

Viewing 6 replies - 1 through 6 (of 6 total)
  • The topic ‘Adminbar in the footer.’ is closed to new replies.
Skip to toolbar