• Skip to content
  • Skip to primary sidebar

WebOmnizz

Header Right

Display custom message on wordpress admin

September 26, 2013 by Jogesh Sharma Leave a Comment

In some point of view when we developed a custom WordPress plugin or theme, we have to notify users for any urgent update, error or any custom message on WordPress admin section. All this done by admin_notices hook function.

Admin Notices

In this post I am going to create a simple plugin to display custom message, but if you want then you can do it with functions.php file. But displaying a message every time is irritating the user, so in this plugin i also gives the functionality to hide your custom message with the Hide this notice button. This button completely hide your notice.

[php]

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
/**
* Plugin Name: Omnizz Custom Dashboard Message
* Plugin URI: http://webomnizz.com
* Description: Small Plugin to Create Custom Dashboard Message.
* Version: 0.1
* Author: Jogesh Sharma
* Author URI: http://webomnizz.com/blog
*/
 
class OCDashboard{
 
    public function __construct() {
        add_action( 'admin_print_styles', array( $this, 'omAdminNotices' ) );
    }
 
    public function omAdminNotices() {
 
        $display = get_option( 'om_cdm_settings' );
 
        if( ! empty( $_GET['om_hide_notice'] ) ){
            update_option( 'om_cdm_settings', $_GET['om_hide_notice'] );
            return;
        }
 
        if( $display != 'true' ){
            wp_enqueue_style( 'om_notice_style', plugins_url( '/om-dashboard-message/assets/css/custom_style.css' ) );
            add_action( 'admin_notices', array( $this, 'customDashboardMessage' ) );
        }
 
    }
 
    public function customDashboardMessage(){
     ?>
        <div id="message" class="updated custom-welcome-panel-content wc-connect">
        <h3><?php _e( 'Welcome to your custom dashboard Message!' ); ?></h3>
        <div class="button_section">
        <a class="button-primary" href="<?php echo add_query_arg( 'om_hide_notice', 'true' ); ?>">Hide this notice</a>
        </div>
        </div>
        <?php
    }
 
}
 
$init = new OCDashboard();

 

As you see above plugin codes on line wp_enqueue_style( 'om_notice_style', plugins_url( '/om-dashboard-message/assets/css/custom_style.css' ) );, i have enqueue a custom style for our message. Below is the style for your message.

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
.updated.custom-welcome-panel-content{
background: #EF653B;
padding: 10px;
border: 1px solid #D1370C;
border-radius: 3px;
}
 
.custom-welcome-panel-content h3{
color: #ffffff;
font-family: "Helvetica Neue",Helvetica,Arial,"Lucida Grande",Verdana,"Bitstream Vera Sans",sans-serif;
font-size: 18px;
line-height: 22px;
margin: 10px 0 15px 0;
}
.custom-welcome-panel-content .button-primary,
.custom-welcome-panel-content .button-primary:focus{
background: #0f817a; /* Old browsers */
background: -moz-linear-gradient(top, #0f817a 0%, #0f817a 44%, #0f817a 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#0f817a), color-stop(44%,#0f817a), color-stop(100%,#0f817a)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #0f817a 0%,#0f817a 44%,#0f817a 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #0f817a 0%,#0f817a 44%,#0f817a 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #0f817a 0%,#0f817a 44%,#0f817a 100%); /* IE10+ */
background: linear-gradient(to bottom, #0f817a 0%,#0f817a 44%,#0f817a 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#0f817a', endColorstr='#0f817a',GradientType=0 ); /* IE6-9 */
font-size: 14px;
border: 1px solid #01665F;
}
.custom-welcome-panel-content .button-primary:hover,
.custom-welcome-panel-content .button-primary:active{
background: #73c4ba; /* Old browsers */
background: -moz-linear-gradient(top, #73c4ba 0%, #199e99 44%, #009187 100%); /* FF3.6+ */
background: -webkit-gradient(linear, left top, left bottom, color-stop(0%,#73c4ba), color-stop(44%,#199e99), color-stop(100%,#009187)); /* Chrome,Safari4+ */
background: -webkit-linear-gradient(top, #73c4ba 0%,#199e99 44%,#009187 100%); /* Chrome10+,Safari5.1+ */
background: -o-linear-gradient(top, #73c4ba 0%,#199e99 44%,#009187 100%); /* Opera 11.10+ */
background: -ms-linear-gradient(top, #73c4ba 0%,#199e99 44%,#009187 100%); /* IE10+ */
background: linear-gradient(to bottom, #73c4ba 0%,#199e99 44%,#009187 100%); /* W3C */
filter: progid:DXImageTransform.Microsoft.gradient( startColorstr='#73c4ba', endColorstr='#009187',GradientType=0 ); /* IE6-9 */
}

 

Related posts:

  1. Ajax uploader with progress bar in jquery
  2. How to make WordPress Plugin step by step
  3. Responsive Google Map WordPress Plugin
  4. Change Continue Reading into Read More in WordPress

Filed Under: Free Stuff Tagged With: wordpress plugin

Primary Sidebar

Recent Posts

  • Custom Image Upload in WordPress
  • Top Python Libraries for Data Science in 2017
  • Laravel 5.5 Pagination for Bootstrap 4
  • Implementing Swift Mailer with Codeigniter
  • Building Simple StopWatch with React-Native

WebOmnizz on Google+

Copyright © 2018