Heute habe ich mich mit Widgets für das Dashboard von Wordpress beschäftigt und musste feststellen, dass die Doku dazu mehr als dürftig ist mittlerweile einigermaßen gut ist: Codex Dashboard API . Damit nicht noch mehr Leute unwissend sterben, habe ich mich entschlossen ein kurzes Tutorial zu schreiben…

Ein wenig Hilfe findet sich im SourcePHP  des Dashboards von Wordpress. Leider ist dieser aber eher rudimentär.

Es beginnt mit dem Header des Widgets, welcher wie jeder andere PluginHeader aussieht:

1
2
3
4
5
6
7
8
9

<!--?php
/*
Plugin Name: Your Dashboard Widget
Plugin URI: http://yourDashboardWidgetUrl
Description: This is a cool Dashboard-Widget
Version: 0.0
Author: Your Name
Author URI: http://yourBlogUrl
*/

Anschließend geht es los mit der Installation des Widgets:

 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

/*
 * Install the Widget.
 */
add_action('wp_dashboard_setup', 'YOURDASHBOARDWIDGET_register_dashboard_widget');
function YOURDASHBOARDWIDGET_register_dashboard_widget ()
{
    //Add a empty option
    add_option('YOURDASHBOARDWIDGET_widget_var1', '');
    //Add a predefinied
    add_option('YOURDASHBOARDWIDGET_widget_var2', 'ThisCouldBeAValue');
    wp_register_sidebar_widget('dashboard_YOURDASHBOARDWIDGET', 'THETITLEOFYOURWIDGET', 'dashboard_YOURDASHBOARDWIDGET_func', array('all_link' =--> $allLink , 'width' =&gt; 'half' , 'height' =&gt; 'single'));
    wp_register_widget_control('dashboard_YOURDASHBOARDWIDGET', 'THETITELOFYOURCONFIGURATIONMENU', 'dashboard_YOURDASHBOARDWIDGET_control');
}

/*
 * Add the Widget to the Dashboard
 */
add_filter('wp_dashboard_widgets', 'YOURDASHBOARDWIDGET_add_dashboard_widget');
function YOURDASHBOARDWIDGET_add_dashboard_widget ($widgets)
{
    global $wp_registered_widgets;
    if (! isset($wp_registered_widgets['dashboard_YOURDASHBOARDWIDGET'])) {
        return $widgets;
    }
    array_splice($widgets, sizeof($widgets) - 1, 0, 'YOURDASHBOARDWIDGET');
    return $widgets;
}

Erklärung:

  • dashboard_YOURDASHBOARDWIDGET ist der Name des Widgets
  • dashboard_YOURDASHBOARDWIDGET_func ist der Name der Methode, die für die Ausgabe des Widgets im Dashboard zuständig ist
  • THETITLEOFYOURWIDGET ist ein beliebig wählbarer Titel (für die Anzeige des Widgets im Dashboard)
  • dashboard_YOURDASHBOARDWIDGET_control ist der Name der Methode, die für die Konfiguration des Widgets zuständig ist.
  • THETITELOFYOURCONFIGURATIONMENU ist ein beliebig wählbarer Titel für das Konfigurationsmenü

Weiter gehts mit der Methode für die Ausgabe des Widgets im Dashboard, man sollte nur “Your Content goes here” austauschen, der Rest sollte stehen bleiben.

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15


/*
 * Print Dashboard Widget
 */
function dashboard_YOURDASHBOARDWIDGET ($sidebar_args)
{
    global $wpdb;
    extract($sidebar_args, EXTR_SKIP);
    echo $before_widget;
    echo $before_title;
    echo $widget_name;
    echo $after_title;
    echo 'Your Content goes here';
    echo $after_widget;
}

Nun noch das Menü, welches für die Konfiguration des Widgets zuständig ist. Der <form>-Tag und der Speichern-Button werden automatisch generiert!

 1
 2
 3
 4
 5
 6
 7
 8
 9
10
11
12
13
14
15
16
17
18
19
20
21


/*
 * Edit Dashboard Widget
 */
function dashboard_YOURDASHBOARDWIDGET_control ()
{
    if ('POST' == $_SERVER['REQUEST_METHOD'] &amp;&amp; isset($_POST['YOURDASHBOARDWIDGET-widget-formvar1']) &amp;&amp; isset($_POST['YOURDASHBOARDWIDGET-widget-formvar2'])) {
        update_option('YOURDASHBOARDWIDGET_widget_var1', "ThisCouldBeAnotherValue");
    } else {
        echo '<p><label for=YOURDASHBOARDWIDGET-widget-var1>Example Text:';
        echo '<input class=widefat id=layeradsde name=YOURDASHBOARDWIDGET-widget-formvar1 type=text value="' . get_option('YOURDASHBOARDWIDGET_widget_var1') . '" maxlength=35 />';
        echo '</label></p>';
        echo '<p><label for=YOURDASHBOARDWIDGET-widget-var2>Example Text 2';
        $formvar2 = get_option('YOURDASHBOARDWIDGET_widget_var2');
        echo '<select id=layeradsde name=YOURDASHBOARDWIDGET_widget_formvar2>';
        for ($i = 0; $i &lt;= 10; ++ $i)
            echo "<option value=$i "="" .="" ($formvar2="=" $i="" ?="" "selected=selected :="" '')="">$i</option>";
        echo '</select></label></p>';
    }
    }
}

Hier gehts zum Download des kompletten Beispielsplugins.