web-dev-qa-db-fra.com

Ajouter à la volée des onglets aux options du plugin

Salut, je construis une page d'options de plugin. Ce que j'aimerais vraiment faire, c'est implémenter des onglets répétables (ce que je sais, c'est possible avec l'API Settings), mais avec une modification que je n'ai vue dans aucun panneau d'options jusqu'à présent. J'aimerais créer de nouveaux onglets à la volée, exactement comme la section "Menus" de l'interface utilisateur d'administration.

Y at-il un moyen standard de le faire?

optionsadmin-ui
6
urok93

Les onglets WordPress sont des balises HTML statiques non standard. Vous pouvez uniquement ajouter le balisage dans votre fichier de thème functions.php ou dans votre plug-in.

<h2 class="nav-tab-wrapper">
    <a href="#" class="nav-tab">Tab #1</a>
    <a href="#" class="nav-tab nav-tab-active">Tab #2</a>
    <a href="#" class="nav-tab">Tab #2</a>
</h2>

WP Tabs

Dans ce plugin d'aide (WordPress Admin Style) vous trouverez les références de classe pour le balisage par défaut de la zone d'administration.
Instantané complet du plugin. L’instantané précédent est un détail situé au bas de celui-ci.
Cliquez pour agrandir:
 full plugin snapshot wordpress-admin-style 

17
bueltge

Créez un tableau d'onglets que vous souhaitez créer sur votre page d'administration. Cela contiendrait très probablement vos pages de menu ajoutées par votre plugin. Les clés de tableau seraient le slug de page et les valeurs de tableau seraient le texte de tabulation.

Écho la fonction où vous voulez que les onglets soient affichés dans votre plugin.

<?php
// Create WP Admin Tabs on-the-fly.
function admin_tabs($tabs, $current=NULL){
    if(is_null($current)){
        if(isset($_GET['page'])){
            $current = $_GET['page'];
        }
    }
    $content = '';
    $content .= '<h2 class="nav-tab-wrapper">';
    foreach($tabs as $location => $tabname){
        if($current == $location){
            $class = ' nav-tab-active';
        } else{
            $class = '';    
        }
        $content .= '<a class="nav-tab'.$class.'" href="?page='.$location.'">'.$tabname.'</a>';
    }
    $content .= '</h2>';
        return $content;
}

$my_plugin_tabs = array(
    'my-plugin-overview' => 'Overview',
    'my-plugin-settings' => 'Settings',
    'my-plugin-uninstall' => 'Uninstall'
);

echo admin_tabs($my_plugin_tabs);
?>
3
Michael Ecklund

J'ai mis à jour la solution de Michael afin qu'elle puisse être utilisée comme onglet dans une seule page. En appelant main_function(), vous produirez les onglets qui relieront les fichiers décrits dans la section $my_plugin_tabs.

Par exemple, en cliquant sur Paramètres, vous aurez l’onglet charge settings.php et les onglets visibles. J'ai pensé qu'il pourrait être utile de télécharger également ce fichier:

<?php
// Create WP Admin Tabs on-the-fly
function admin_tabs( $page, $tabs, $current=NULL ) {
    if ( is_null( $current ) ) {
        if ( isset( $_GET['tab'] ) ) {
            $current = $_GET['tab'];
        }
    }
    $content = '';
    $content .= '<h2 class="nav-tab-wrapper">';
    foreach( $tabs as $tab => $tabname ) {
        if ( $current == $tab ) {
            $class = ' nav-tab-active';
        } else {
            $class = '';    
        }
        $content .= '<a class="nav-tab' . $class . '" href="?page=' . 
            $page . '&tab=' . $tab . '">' . $tabname . '</a>';
    }
    $content .= '</h2>';                 
    echo $content;
    if ( ! $current ) 
        $current = key( $tabs );
    require_once( $current . '.php' );
    return;
}

function main_function() {
    $my_plugin_tabs = array(
        'bundles'  => 'Bundles',
        'settings' => 'Settings',
    );
    $my_plugin_page = 'bundles';
    echo admin_tabs( $my_plugin_page, $my_plugin_tabs );
}
1
raison