Página de Bienvenida en el Panel de Administración

1. ¿Qué es una página de administración permanente?

En la lección 5.2 creamos el Welcome Wizard: una página que aparece una sola vez cuando activás el plugin y que no se muestra en el menú lateral. Es perfecta para dar la bienvenida al usuario por primera vez.

En esta lección vamos a crear algo diferente: una página permanente que vive en el menú lateral de WordPress Admin y que el administrador puede visitar en cualquier momento. Es el panel de control del plugin.

La diferencia técnica entre los dos tipos de página:

2. Qué archivo se modifica hoy

3. Cómo funciona add_menu_page()

La función add_menu_page() le dice a WordPress: «quiero un ítem propio en el menú lateral del admin». Recibe estos parámetros:

4. El código completo

<?php
/**
 * Divi LMS Helper — Página de administración
 */
if ( ! defined( 'ABSPATH' ) ) { exit; }

class DLMS_Admin_Page {

    // Constructor: conectar el hook del menú
    public function __construct() {
        add_action( 'admin_menu', [ $this, 'register_page' ] );
    }

    // Registrar la página en el menú lateral de WP Admin
    public function register_page() {
        add_menu_page(
            'Divi LMS Helper',               // Título en la pestaña del navegador
            'Divi LMS Helper',               // Texto en el menú lateral
            'manage_options',                // Solo administradores
            'divi-lms-helper',               // Slug: admin.php?page=divi-lms-helper
            [ $this, 'render' ],             // Función que dibuja el contenido
            'dashicons-welcome-learn-more',  // Ícono de WordPress
            30                               // Posición en el menú
        );
    }

    // Renderizar el contenido de la página
    public function render() {
        if ( ! current_user_can( 'manage_options' ) ) { return; }

        // Detectar si los componentes necesarios están activos
        $has_lp   = class_exists( 'LearnPress' );
        $has_divi = defined( 'ET_BUILDER_VERSION' );
        $has_ct   = ( wp_get_theme()->get( 'Template' ) === 'Divi' );
        ?>
        <div class="dlms-admin-wrap">

            <!-- Encabezado -->
            <div class="dlms-admin-header">
                <h1>Divi LMS Helper</h1>
                <p>Panel de control del plugin companion del child theme.</p>
                <span class="dlms-version">v<?php echo esc_html( DLMS_VERSION ); ?></span>
            </div>

            <!-- Estado del sistema -->
            <div class="dlms-admin-section">
                <h2>Estado del sistema</h2>
                <ul class="dlms-status-list">
                    <li class="<?php echo $has_lp ? 'ok' : 'error'; ?>">
                        <span class="dlms-status-icon"><?php echo $has_lp ? '[OK]' : '[Falta]'; ?></span>
                        <strong>LearnPress</strong> — plugin del LMS
                    </li>
                    <li class="<?php echo $has_divi ? 'ok' : 'error'; ?>">
                        <span class="dlms-status-icon"><?php echo $has_divi ? '[OK]' : '[Falta]'; ?></span>
                        <strong>Divi</strong> — constructor de páginas
                    </li>
                    <li class="<?php echo $has_ct ? 'ok' : 'error'; ?>">
                        <span class="dlms-status-icon"><?php echo $has_ct ? '[OK]' : '[Falta]'; ?></span>
                        <strong>Child theme Divi LMS Child</strong> — tema hijo activo
                    </li>
                </ul>
            </div>

            <!-- Shortcodes y accesos directos ... -->
        </div>
        <?php
    }
}

new DLMS_Admin_Page();

5. Tres secciones del panel de control

La función render() genera una página con tres secciones. Cada una cumple una función distinta:

6. Cómo detecta el estado del sistema

La parte más interesante del código es la verificación de dependencias. Usamos tres condiciones PHP:

$has_lp   = class_exists( 'LearnPress' );
$has_divi = defined( 'ET_BUILDER_VERSION' );
$has_ct   = ( wp_get_theme()->get( 'Template' ) === 'Divi' );

7. El CSS del panel vive dentro del PHP

Si mirás el archivo class-admin-page.php vas a ver un bloque <style> dentro de la función render(). Esto es una técnica válida en WordPress para agregar estilos que solo aplican a esa página de administración.

8. Resultado visual

Después de guardar el archivo, al abrir WP Admin se ve el nuevo ítem «Divi LMS Helper» en el menú lateral con su ícono propio:

9. Verificación de la lección