How to Add Dismissible WordPress Admin Notices

Note: As of WordPress 4.2, dismissible WordPress admin notices should be a part of WordPress core. More information can be found here.

I find that in my blogging workflow, I tend to save drafts often so that I don’t lose my work.

While this may add a second or two here and there, the peace of mind that I get from knowing that I won’t lose all of my work is definitely worth it.

But, there is one little thing that bothers me about saving drafts, and that is the pesky WordPress admin notices that stay at the top of the view.

So, today I set out to find a way to hide or remove the WordPress admin notices.

Initially, I tried a solution that automatically hid the “Post Draft Updated” WordPress admin notice after 5 seconds, but I wasn’t very fond of the UX.

After a bit of thought, I decided that the user should be able to actually dismiss these notices and decided upon this:

The Magic Behind Dismissible WordPress Admin Notices

<?php
/*
Plugin Name: Dismissible WordPress Admin Notices
Plugin URI: https://eric.blog
Description: Adds the ability to dismiss WordPress admin notices.
Author: ebinnion
Version: 0.1
Author URI: https://eric.blog
*/
class Dismissable_Admin_Messages {
    
    public function __construct() {
        add_action('current_screen', array(
            $this,
            'admin_init'
        ));
    }
    
    public function admin_init() {
        $screen = get_current_screen();
        $showOn = array(
            'post',
            'page'
        );
        
        if (in_array($screen->id, $showOn)) {
            if (isset($_GET['message'])) {
                add_action('admin_head', array(
                    $this,
                    'admin_head'
                ));
                add_action('admin_footer', array(
                    $this,
                    'admin_footer'
                ));
            }
        }
    }
    
    public function admin_head() {
        ?>
        <style>
        #message {
        position: relative;
        }

        #message .dashicons-no {
        cursor: pointer;
        margin-top: -.5em;
        position: absolute;
        right: 10px;
        top: 50%;
        }
        </style>
        <!--?<span class="hiddenSpellError" pre="" data-mce-bogus="1"-->
        <?php
    }
    
    public function admin_footer() {
        ?>
        <script>
        (function( $ ) {
        var message = $( '.wrap > #message' );
        message.append( 'dashicons-no">' );
        message.find( '.dashicons-no' ).on( 'click', function() {
        message.slideUp();
        } );
        })( jQuery );
        </script>
        <!--?<span class="hiddenSpellError" pre="" data-mce-bogus="1"--
        <?php
    }
}

new Dismissable_Admin_Messages();

How to Install

As of now, this plugin isn’t on the official WordPress repository. But, if you would like to use this functionality, you can save the code above into a file and put it in either:

• wp-content/plugins
• wp-content/mu-plugins

If you have any questions, please don’t hesitate to ask.