hooks - How to change the location of admin notice in html without using Javascript?

admin2025-01-07  4

I am adding an admin notice via the conventional admin_notice hook in my plugin:

function my_admin_notice() { ?>
    <div class="notice notice-info is-dismissible">
        <p><?php _e( 'some message', 'my-text-domain' ); ?></p>
    </div>
    <?php
}

if ( my_plugin_show_admin_notice() )
  add_action( 'admin_notices', 'my_admin_notice' );

How can I control where wordpress places the admin notice, in the html on the current screen, without using Javascript?

I am adding an admin notice via the conventional admin_notice hook in my plugin:

function my_admin_notice() { ?>
    <div class="notice notice-info is-dismissible">
        <p><?php _e( 'some message', 'my-text-domain' ); ?></p>
    </div>
    <?php
}

if ( my_plugin_show_admin_notice() )
  add_action( 'admin_notices', 'my_admin_notice' );

How can I control where wordpress places the admin notice, in the html on the current screen, without using Javascript?

Share Improve this question edited Mar 15, 2016 at 10:29 hitautodestruct asked Mar 14, 2016 at 13:03 hitautodestructhitautodestruct 5652 gold badges7 silver badges19 bronze badges 5
  • 2 Can you elaborate where do you want to put the admin notice ? – Sumit Commented Mar 14, 2016 at 13:26
  • @sumit Sorry, I meant location as in the html on the page itself in a custom page. – hitautodestruct Commented Mar 15, 2016 at 4:51
  • You wrote this if ( /* some condition */ ) leads to confusions! – Sumit Commented Mar 15, 2016 at 5:05
  • @hitautodestruct i updated my answer to your new question. – iantsch Commented Mar 15, 2016 at 7:29
  • @Sumit I updated my answer. I just didn't want the focus to go away from the fact that I am asking about admin notices. – hitautodestruct Commented Mar 15, 2016 at 10:30
Add a comment  | 

7 Answers 7

Reset to default 14

I found out by accident recently that all the notices will be moved to after the first <h2> tag on the page inside a <div class="wrap">. This gives you some slight control in that, for example, on a plugin settings page you can put an empty <h2></h2> at the very top if you want to use <h2>Plugin Title</h2> without it messing up the display formatting there.

Update: As some have noted, at some point this was changed so that it is now after either the h1 OR h2 tag inside the div with class wrap where the notices are inserted, in that order (ie. with first preference for h1 if it exists.) For reference, anyone looking for the actual javascript doing this can find it in /wp-admin/js/common.js:

    /*
     * The `.below-h2` class is here just for backward compatibility with plugins
     * that are (incorrectly) using it. Do not use. Use `.inline` instead. See #34570.
     * If '.wp-header-end' is found, append the notices after it otherwise
     * after the first h1 or h2 heading found within the main content.
     */
    if ( ! $headerEnd.length ) {
        $headerEnd = $( '.wrap h1, .wrap h2' ).first();
    }
    $( 'div.updated, div.error, div.notice' ).not( '.inline, .below-h2' ).insertAfter( $headerEnd );

Also as you can see there if you don't want your own notice to be moved just give it a class of inline and it will be excluded.

According to the Codex admin_notice does the following:

Notices displayed near the top of admin pages. The hook function should echo a message to be displayed.

That means you cannot place them at the bottom or middle of your screen, if you use the hook. Furthermore if you place a div with the class notice anywhere in your admin pages, WP admin JS scripts will put them just where all the other notices would be; and they will behave like notices too.

FYI: I tested this already with a fresh install. ;)

But

If you want to show a admin_notice at a particular page, you can add the action within a current_screen action:

function my_admin_notice() { ?>
    <div class="notice notice-info is-dismissible">
        <p><?php _e( 'some message', 'my_textdomain' ); ?></p>
    </div>
    <?php
}

function my_current_screen_example( $current_screen ) {
    // All your conditions go here, e.g. show notice @ post (not page) edit/new
    if ( 'post' == $current_screen->post_type && 'post' == $current_screen->base ) {
        add_action( 'admin_notices', 'my_admin_notice' );
    }
}

add_action( 'current_screen', 'my_current_screen_example' );

More Information:

  • Action Hook: admin_notices
  • Action Hook: current_screen

I recently came across this issue and tried using the empty <h2></h2> method and it didn't work for me. Eventually I discovered that using <hr class="wp-header-end"> seems to work and the admin notice will always appear directly below it.

Hopefully it helps someone!

I had the same problem and I resolved it by ensuring all the heading tags above where I want to place the notice there is no <h2>.

In this case, I wanted to display an error log notice below the input field as shown below :

I solved it by introducing an empty <h2> tag just below the email input field and also change the tabs tag to <h3> instead of <h2>

The action admin_notices is called or applied only once in the file, admin-header.php on line number 238, just at the beginning of the wpbody-content div, which makes up the body of a dashboard page. Hence, there is no way you can change the position of the admin notice, without using JavaScript. However, you can definitely make your own notice divs at the positions or locations you want, and manipulate their visibility.

Just create the mark up for the notice as:

<div class="notice notice-info is-dismissible">
    <p>This is a notice.</p>
</div>

You can now control it's visibility using PHP. Meaning when you redirect a user to this page, or submit a form on this page, just set the message in the div, and using a simple if else, echo the div.

It appears that settings_errors() will display all notices that I've tested with a settings form so far. Despite the name it also outputs success messages. Place it anwhere in your template and that's where the notices will appear.

I found the <h2> solution mentioned to not do anything.

WordPress Reference settings_errors()

Just add inline class to your div, e.g.

<div class="notice notice-success is-dismissible inline">
    Test notice
</div>
转载请注明原文地址:http://conceptsofalgorithm.com/Algorithm/1736254668a224.html

最新回复(0)