25th Aug
0
Tab-Bar im WordPress Theme oder Plugin
Insbesondere im Bereich von Plugins kann man mittels Registerkarten Informationen zugänglich gestalten. Bei meinen Themes greife ich heirfür meistens auf Bibliotheken und Frameworks zurück, jQuery und Yaml als Beispiel.
Das nutzen eben dieser ist bei Plugins schwierig, vorallem sollte man diese irgendwann auch mit anderen Leuten teilen wollen oder weiß noch nicht auf welchen Systemen diese zum Einsatz kommen werden.
Das Beispiel hier ist ein kleines dashboard-motd, dass ein Dashboard Widget setzt in dem sich Registrierkarten befinden. Wir nutzen das um eine kleine Übersicht aller CSS Klassen zu haben, welche in unseren Artikeln genutzt werden sollen.
<?php /* Plugin Name: Dashboard MOTD Plugin URI: http://dailycode.de Description: Message of the day for Dashboard Version: 1.0 Author: Tobias Schmersow Author URI: http://dailycode.de */ function dashboard_motd_function() { //if $_GET['tab'] is not set, the page is called for the first time //we set the first tab manually in the else clause if ( isset ( $_GET['tab'] ) ) $tab = $_GET['tab']; else $tab = 'first'; //fill an array with tab titles $tabs = array( 'first' => 'Tab 1', 'second' => 'Tab 2', 'third' => 'Tab 3'); //print out the tabs: nav-tab containss the css descriptions for inactive tab, the active tab has to use the nav-tab-active class, too echo '<div id="icon-edit" class="icon32"><br></div>'; echo '<h2 class="nav-tab-wrapper">'; foreach( $tabs as $t => $name ) { $class = ( $t == $tab ) ? ' nav-tab-active' : ''; //this link can also point to other pages, for the dashboard we stay with index.php echo "<a class='nav-tab$class' href='?tab=$t'>$name</a>"; } echo '</h2><table class="form-table"></br>'; //print out tab content switch ( $tab ) { //the content of Tab 1 goes here case 'first' : ?> <p> <strong>Tab1</strong> </p> <!--don't forget to set the _GET['tab'] value with the hidden field, if you use a form in one of the tabs--> <form id="departments" method="get"> <input type="hidden" name="tab" value="<?php echo $tab ?>" /> </form> <?php break; case 'second': break; case 'third': break; } echo '</table>'; } //register dashboard widget function add_dashboard_widget_motd() { wp_add_dashboard_widget('dashboard_motd', 'Dashboard Widget Title', 'dashboard_motd_function'); } add_action('wp_dashboard_setup', 'add_dashboard_widget_motd'); ?>
About the Author
Computer sollen uns in Beruf und Alltag unterstützen. Damit das funktioniert müssen wir einen einfachen und intuitiven Zugang zu unseren Programmen, Daten und Systemen haben.