QNimate

  • CoursesVideos
  • WP PremiumPlugins
  • DemosLab
  • Home
  • QIdea
  • QTrack
Home Carbon Ads Change Position of WordPress Dashboard Widget

Change Position of WordPress Dashboard Widget

This post is a part 4 of Creating a WordPress Admin Theme post series.

In this tutorial I will show you how to display a widget in various position of WordPress dashboard page.

WordPress doesn’t provide any API to change position of widget. Therefore we need to modify WordPress core $wp_meta_boxes variable to change position of widget.

Displaying Widget on Top

Here is sample code to display widget on top

function example_add_dashboard_widgets()
{
    wp_add_dashboard_widget( 'example_dashboard_widget', 'Example Dashboard Widget', 'example_dashboard_widget_function' );
   

    global $wp_meta_boxes;
    $normal_dashboard = $wp_meta_boxes['dashboard']['normal']['core'];
    $example_widget_backup = array( 'example_dashboard_widget' => $normal_dashboard['example_dashboard_widget'] );
    unset( $normal_dashboard['example_dashboard_widget'] );
    $sorted_dashboard = array_merge( $example_widget_backup, $normal_dashboard );
    $wp_meta_boxes['dashboard']['normal']['core'] = $sorted_dashboard;
}
 
function example_dashboard_widget_function(){}
 
add_action("wp_dashboard_setup", "example_add_dashboard_widgets");

Displaying Widget on Right Side

By default new widgets are displayed in left bottom but you can force a widget to be displayed on right bottom

function example_add_dashboard_widgets()
{
    wp_add_dashboard_widget( 'example_dashboard_widget', 'Example Dashboard Widget', 'example_dashboard_widget_function' );
   

    global $wp_meta_boxes;

    $my_widget = $wp_meta_boxes['dashboard']['normal']['core']['example_dashboard_widget'];
    unset($wp_meta_boxes['dashboard']['normal']['core']['example_dashboard_widget']);
    $wp_meta_boxes['dashboard']['side']['core']['example_dashboard_widget'] = $my_widget;
}
 
function example_dashboard_widget_function(){echo "s";}
 
add_action("wp_dashboard_setup", "example_add_dashboard_widgets");

Similarly you can position the widget almost anywhere by altering $wp_meta_boxes variable.

Feb 22, 2015Narayan Prusty
JavaScript Promise vs CallbackJavaScript Change Console Log Color
Comments: 1
  1. Offshelfdeals.Com
    5 years ago

    Thanks , I have just been looking for information about
    this subject for ages and yours is the best I have came upon so far.
    However, what concerning the bottom line? Are you sure about
    the source?

    ReplyCancel

Leave a Reply to Offshelfdeals.Com Cancel reply

To create code blocks or other preformatted text, indent by four spaces:

    This will be displayed in a monospaced font. The first four
    spaces will be stripped off, but all other whitespace
    will be preserved.
    
    Markdown is turned off in code blocks:
     [This is not a link](http://example.com)

To create not a block, but an inline code span, use backticks:

Here is some inline `code`.

For more help see http://daringfireball.net/projects/markdown/syntax

Narayan Prusty

I am a software engineer specialising in Blockchain, DevOps and Go/JavaScript. This is my personal blog where I write about things that I learn and feel interesting to share.

7 years ago 1 Comment WordPress
Share this
0
GooglePlus
0
Facebook
0
Twitter
0
Linkedin
  • Displaying Widget on Top
  • Displaying Widget on Right Side
Related Articles
  • Login User into WordPress without Password
  • Add and Remove Widgets in WordPress Dashboard
  • Overview of WordPress Admin Menu API
  • WordPress Freelance Plugin Widget
  • Underscores.me Tutorial
Our Sponsor
My Books

2014 - 2015 © QNimate
All tutorials MIT license