WordPress.org

Ready to get started?Download WordPress

Forums

[resolved] Add a div to the admin bar (3 posts)

  1. truheart
    Member
    Posted 5 months ago #

    Hey guys, I searched the forums and could not find an exact answer that I was looking for. I have a customized admin theme that adds an addition image below the admin bar using jQuery. To visualize it, basically it is adding a shadow between the admin-bar and admin-menu so it looks like the menu is nestled underneath the header even when scrolling down. Now I do this using this code in my custom.js file:

    //Add shadow to admin bar
    jQuery('<img src="../wp-content/plugins/retina-press/images/admin-shadow.png" alt="" class="admin-shadow"/></div>').appendTo('#wpadminbar');

    The thing is since this is jQuery, it doesn't load as fast or smooth as I would like. I would really like to do this using a php function, but was wondering how exactly it would be done. I'm not really sure what hook to use for this or how to add this html. Hopefully someone can help, and sorry if this is pretty basic.

  2. bcworkz
    Member
    Posted 5 months ago #

    Use the 'wp_after_admin_bar_render' action. FYI, there's also a 'wp_before_admin_bar_render' action.

    I would think a similar effect could be achieved with the CSS background property for #wpadminbar, but fussing with CSS can be aggravating, simply hooking an action certainly has appeal.

  3. truheart
    Member
    Posted 5 months ago #

    Hey BC, thanks. I think I was trying that before but didn't know how to insert a div instead of a node. I took your advice and got it to work using a simple echo. I don't know why I was making it harder than it had to be. If anyone stumbles on here and wants the code, here it is:

    /** Add Shadow to Admin Bar **/
    function admin_shadow() {
       global $wp_admin_bar;
       echo '<img src="../wp-content/plugins/myCMS/images/admin-shadow.png" alt="" class="admin-shadow"/>' ;
    }
    add_action( 'wp_before_admin_bar_render', 'admin_shadow' );

    Thanks again BC.

Reply

You must log in to post.

About this Topic

Tags

No tags yet.