Tables de base de données personnalisées dans WordPress : Partie 2

Publié: 2022-08-01

Dans la première partie de notre série sur les tables de base de données personnalisées dans WordPress, nous avons examiné comment vous pouvez créer une table de base de données personnalisée à partir de votre propre plugin personnalisé. Dans la partie 2, nous vous expliquerons comment modifier une table personnalisée WordPress, y compris comment supprimer la table de base de données personnalisée lors de la suppression du plug-in. De plus, nous expliquerons comment vous pouvez ajouter des éléments de menu pour le plugin dans la zone d'administration, avec des options pour afficher ou ajouter des entrées dans votre tableau de données personnalisé.

Comment supprimer votre tableau personnalisé lors de la suppression du plugin

Afin de supprimer la table lorsque le plugin lui-même est supprimé, nous devons utiliser la fonction register_uninstall_hook() fournie par WordPress pour définir le crochet de désinstallation d'un plugin.

 function uninstall_students_plugin(){ global $wpdb; $table_name = $wpdb->prefix . 'students'; $wpdb->query("DROP TABLE IF EXISTS $table_name"); } register_uninstall_hook(__FILE__,'uninstall_students_plugin');

Si vous désactivez et supprimez le plugin maintenant, vous devriez maintenant voir que la table « étudiants » dans la base de données a été supprimée avec succès.

Éléments et page du menu d'administration du tableau personnalisé

Dans cette section, nous allons vous montrer comment ajouter une page d'administration, ainsi que ses éléments de menu, pour le tableau personnalisé "étudiants".

Éléments du menu administrateur

Voici le morceau de code que vous pouvez essayer - ajoutez-le au fichier PHP actuel du plugin :

 function students_custom_table_admin_menu() { add_menu_page(__('Students', 'students_custom_table'), __('Students', 'students_custom_table'), 'activate_plugins', 'students', 'students_custom_table_page_handler', 'dashicons-welcome-learn-more', '5'); add_submenu_page('students', __('Students', 'students_custom_table'), __('Students', 'students_custom_table'), 'activate_plugins', 'students', 'students_custom_table_page_handler'); add_submenu_page('students', __('Add new', 'students_custom_table'), __('Add new', 'students_custom_table'), 'activate_plugins', 'students_form', 'students_custom_table_page_handler_add_form'); } add_action('admin_menu', 'students_custom_table_admin_menu');

Maintenant, dans la zone d'administration, vous devriez voir quelque chose comme ça.

Comme prévu, vous verrez que rien ne s'affiche lorsque vous cliquez sur l'une des icônes. Nous définirons le contenu de la page dans la section suivante, mais examinons d'abord les lignes de code ci-dessus pour comprendre leur fonctionnement.

Parce que nous voulons créer un élément de menu de niveau supérieur et deux sous-éléments, nous avons utilisé à la fois la fonction add_menu_page() et la fonction add_submenu_page() que WordPress fournit. Ces fonctions acceptent les arguments suivants :

 add_menu_page( $page_title, $menu_title, $capability, $menu_slug, $function, $icon_url, $position )

Le $page_title doit être défini et il s'agit essentiellement de la première partie des balises de titre de la page vers laquelle vous êtes redirigé lors de la sélection de cet élément de menu. Dans notre cas, students_custom_table .
Le $menu_title est le texte à utiliser pour le menu. Nous avons choisi « Étudiants » comme texte.
$capability est la capacité requise pour que ce menu soit affiché par l'utilisateur. Dans notre cas, nous avons choisi la permission activate_plugins . Par défaut, il n'est attribué qu'aux super utilisateurs et aux administrateurs. Si vous souhaitez comprendre quel rôle ou quelle capacité correspond à vos besoins, vous pouvez consulter la documentation officielle associée.
Le $menu_slug est notre chaîne d' students qui vient juste après la permission. Il est également obligatoire et doit être unique. Il utilise uniquement des caractères alphanumériques minuscules, des tirets et des traits de soulignement compatibles avec sanitize_key().
Le $icon_url est un argument facultatif et est l'URL qui renvoie au fichier d'icône qui sera utilisé pour l'élément de menu. Nous en avons choisi un dans la bibliothèque WordPress dashicons.
$position est l'endroit où vous définissez éventuellement la position dans l'ordre du menu où cet élément doit apparaître.

 add_submenu_page( $parent_slug, $page_title, $menu_title, $capability, $menu_slug, $function, $icon_url, $position )

Outre les paramètres qu'il a en commun avec le add_menu_page , nous voyons également

Le paramètre $parent_slug est la chaîne requise pour le menu parent, dans notre cas, students .
L'argument $function est l'endroit où vous définissez la fonction de rappel qui créera le contenu de la page des paramètres. Dans notre cas, il s'agit de students_custom_table_page_handler() , pour le tableau d'affichage des étudiants, et de students_custom_table_page_handler_add_form() , pour le formulaire que nous utiliserons pour ajouter des étudiants.
Nous n'avons pas encore déclaré ces fonctions, mais nous le ferons dans un moment.

Affichage des enregistrements de table personnalisés

Commençons par ajouter le code qui affichera le tableau des étudiants sous l'élément de menu "Étudiants".

Afin d'afficher les données des tables d'administration, WordPress étend la classe intégrée WP_List_Table . La classe WP_List_Table est introduite en tant que classe privée dans le fichier wp-admin/includes/class-wp-list-table.php. Les classes privées sont nommées privées car elles sont uniquement destinées à être utilisées par d'autres classes et fonctions principales et non par les développeurs.

Cependant, WordPress vous offre la possibilité de redéfinir cette classe en l'étendant. Donc, ce que nous allons faire est de créer une classe personnalisée, où nous allons redéfinir les propriétés et les méthodes de la classe WP_List_Table , afin de remplir la table admin avec les données que nous voulons. Nous avons nommé la classe "Students_Custom_Table_List_Table" et les lignes de code dont nous avons besoin sont les suivantes.

 if (!class_exists('WP_List_Table')) { require_once(ABSPATH . 'wp-admin/includes/class-wp-list-table.php'); } class Students_Custom_Table_List_Table extends WP_List_Table { function __construct() { global $status, $page; parent::__construct(array( 'singular' => 'person', 'plural' => 'persons', )); } function column_default($item, $column_name) { return $item[$column_name]; } function column_age($item) { return '<em>' . $item['age'] . '</em>'; } function column_ip($item) { return '<em>' . $item['ip_address'] . '</em>'; } function column_name($item) { $actions = array( 'edit' => sprintf('<a href="?page=students_form&id=%s">%s</a>', $item['id'], __('Edit', 'students_custom_table')), 'delete' => sprintf('<a href="?page=%s&action=delete&id=%s">%s</a>', $_REQUEST['page'], $item['id'], __('Delete', 'students_custom_table')), ); return sprintf('%s %s', $item['name'], $this->row_actions($actions) ); } function column_cb($item) { return sprintf( '<input type="checkbox" name="id[]" value="%s" />', $item['id'] ); } function get_columns() { $columns = array( 'cb' => '<input type="checkbox" />', //Render a checkbox instead of text 'name' => __('Name', 'students_custom_table'), 'email' => __('E-Mail', 'students_custom_table'), 'age' => __('Age', 'students_custom_table'), 'ip_address' => __('IP address', 'students_custom_table'), ); return $columns; } function get_sortable_columns() { $sortable_columns = array( 'name' => array('name', true), 'email' => array('email', false), 'age' => array('age', false), 'ip_address' => array('ip_address', false), ); return $sortable_columns; } function get_bulk_actions() { $actions = array( 'delete' => 'Delete' ); return $actions; } function process_bulk_action() { global $wpdb; $table_name = $wpdb->prefix . 'students'; // do not forget about tables prefix if ('delete' === $this->current_action()) { $ids = isset($_REQUEST['id']) ? $_REQUEST['id'] : array(); if (is_array($ids)) $ids = implode(',', $ids); if (!empty($ids)) { $wpdb->query("DELETE FROM $table_name WHERE id IN($ids)"); } } } function prepare_items() { global $wpdb; $table_name = $wpdb->prefix . 'students'; $per_page = 5; $columns = $this->get_columns(); $hidden = array(); $sortable = $this->get_sortable_columns(); $this->_column_headers = array($columns, $hidden, $sortable); $this->process_bulk_action(); $total_items = $wpdb->get_var("SELECT COUNT(id) FROM $table_name"); $paged = isset($_REQUEST['paged']) ? ($per_page * max(0, intval($_REQUEST['paged']) - 1)) : 0; $orderby = (isset($_REQUEST['orderby']) && in_array($_REQUEST['orderby'], array_keys($this->get_sortable_columns()))) ? $_REQUEST['orderby'] : 'name'; $order = (isset($_REQUEST['order']) && in_array($_REQUEST['order'], array('asc', 'desc'))) ? $_REQUEST['order'] : 'asc'; $this->items = $wpdb->get_results($wpdb->prepare("SELECT * FROM $table_name ORDER BY $orderby $order LIMIT %d OFFSET %d", $per_page, $paged), ARRAY_A); $this->set_pagination_args(array( 'total_items' => $total_items, 'per_page' => $per_page, 'total_pages' => ceil($total_items / $per_page) )); } }

Si vous examinez attentivement le code, vous remarquerez comment les colonnes 'age' et 'ip_address' sont définies. Nous pouvons maintenant continuer et définir également la fonction qui nous donnera enfin le contenu de l'écran d'administration «Étudiants».

 function students_custom_table_page_handler() { global $wpdb; $table = new Students_Custom_Table_List_Table(); $table->prepare_items(); $message = ''; if ('delete' === $table->current_action()) { $message = '<div class="updated below-h2"><p>' . sprintf(__('Items deleted: %d', 'students_custom_table'), count($_REQUEST['id'])) . '</p></div>'; } ?> <div class="wrap"> <div class="icon32 icon32-posts-post"><br></div> <h2><?php _e('Students', 'students_custom_table')?> <a class="add-new-h2" href="<?php echo get_admin_url(get_current_blog_id(), 'admin.php?page=students_form');?>"><?php _e('Add new', 'students_custom_table')?></a> </h2> <?php echo $message; ?> <form method="GET"> <input type="hidden" name="page" value="<?php echo $_REQUEST['page'] ?>"/> <?php $table->display() ?> </form> </div> <?php }

En bref, nous avons d'abord créé une instance de la classe personnalisée Students_Custom_Table_List_Table , puis les éléments html qui incluront les données du tableau des étudiants. Vous devriez pouvoir voir le tableau affiché maintenant, mais notez qu'il sera vide.

Maintenant que nous avons fait cela, ajoutons quelques étudiants. !

Création du formulaire pour ajouter nos données personnalisées

Comme nous l'avons mentionné précédemment, la fonction responsable de l'ajout des étudiants sera students_custom_table_page_handler_add_form() .

 function students_custom_table_page_handler_add_form() { global $wpdb; $table_name = $wpdb->prefix . 'students'; $message = ''; $notice = ''; $default = array( 'id' => 0, 'name' => '', 'email' => '', 'age' => null, 'ip_address' => null, ); if (wp_verify_nonce($_REQUEST['nonce'], basename(__FILE__))) { $item = shortcode_atts($default, $_REQUEST); $result = $wpdb->insert($table_name, $item); $item['id'] = $wpdb->insert_id; if ($result) { $message = __('Item was successfully saved', 'students_custom_table'); } else { $notice = __('There was an error while saving item', 'students_custom_table'); } } add_meta_box('students_form_meta_box', 'Student data', 'students_custom_table_students_form_meta_box_handler', 'student', 'normal', 'default'); ?> <div class="wrap"> <div class="icon32 icon32-posts-post"><br></div> <h2><?php _e('Student', 'students_custom_table')?> <a class="add-new-h2" href="<?php echo get_admin_url(get_current_blog_id(), 'admin.php?page=students');?>"><?php _e('back to list', 'students_custom_table')?></a> </h2> <?php if (!empty($notice)): ?> <div class="error"><p><?php echo $notice ?></p></div> <?php endif;?> <?php if (!empty($message)): ?> <div class="updated"><p><?php echo $message ?></p></div> <?php endif;?> <form method="POST"> <input type="hidden" name="nonce" value="<?php echo wp_create_nonce(basename(__FILE__))?>"/> <input type="hidden" name="id" value="<?php echo $item['id'] ?>"/> <div class="metabox-holder"> <div> <div> <?php do_meta_boxes('student', 'normal', $item); ?> <input type="submit" value="<?php _e('Save', 'students_custom_table')?>" class="button-primary" name="submit"> </div> </div> </div> </form> </div> <?php }

Comme vous pouvez le voir dans le code, nous définissons d'abord un tableau $default qui sera utilisé pour nos nouveaux enregistrements.

Ensuite, après avoir vérifié que la demande est publiée et que nous avons le bon nonce, nous utilisons le shortcode_atts(). Il s'agit d'une fonction WordPress intégrée très utile qui combine les paramètres donnés et remplit les valeurs par défaut si nécessaire.

Et enfin, nous ajoutons notre méta-boîte personnalisée et insérons les données dans la table personnalisée, recevant un message qui nous informe que le processus a réussi.

Pour les besoins de ce didacticiel, nous avons ignoré quelques éléments que, s'ils sont utilisés dans le monde réel, vous voudriez ajouter. Celles-ci incluent la validation des informations ajoutées à la base de données en faisant des choses comme définir ce qui se passe si un nom ou un e-mail en double est ajouté.

Enfin, nous devrions ajouter un gestionnaire pour notre méta-boîte personnalisée :

 function students_custom_table_students_form_meta_box_handler($item) { ?> <table cellspacing="2" cellpadding="5" class="form-table"> <tbody> <tr class="form-field"> <th valign="top" scope="row"> <label for="name"><?php _e('Name', 'students_custom_table')?></label> </th> <td> <input name="name" type="text" value="<?php echo esc_attr($item['name'])?>" size="50" class="code" placeholder="<?php _e('Your name', 'students_custom_table')?>" required> </td> </tr> <tr class="form-field"> <th valign="top" scope="row"> <label for="email"><?php _e('E-Mail', 'students_custom_table')?></label> </th> <td> <input name="email" type="email" value="<?php echo esc_attr($item['email'])?>" size="50" class="code" placeholder="<?php _e('Your E-Mail', 'students_custom_table')?>" required> </td> </tr> <tr class="form-field"> <th valign="top" scope="row"> <label for="age"><?php _e('Age', 'students_custom_table')?></label> </th> <td> <input name="age" type="number" value="<?php echo esc_attr($item['age'])?>" size="50" class="code" placeholder="<?php _e('Your age', 'students_custom_table')?>" required> </td> </tr> <tr class="form-field"> <th valign="top" scope="row"> <label for="ip_address"><?php _e('IP', 'students_custom_table')?></label> </th> <td> <input name="ip_address" type="number" value="<?php echo esc_attr($item['ip_address'])?>" size="50" class="code" placeholder="<?php _e('Your IP address', 'students_custom_table')?>" required> </td> </tr> </tbody> </table> <?php }

Et c'est tout. Nous avons maintenant un plugin personnalisé qui nous permet d'ajouter des étudiants, d'afficher la liste des étudiants ou de supprimer un étudiant, et de stocker les données dans une table de base de données personnalisée !