Ya hemos superado la primera parte, creando nuestro entorno de desarrollo (WordPress – La instalación para desarrollo, Ahora es cuestión de empezar a trabajar, y para eso, vamos a determinar lo que vamos a hacer:
-
- Crear una estructura de plugin
- Desarrollar la parte del servidor del plugin, como una API con PHP, trabajando con clases
- Desarrollar la parte del cliente del plugin, trabajando con React
Creación de la estructura del plugin
Supongo que la mayoría sabe perfectamente como realizar un plugin para wordpress; no es nada complicado, pero me gustaría hacer hincapié en la estructura de directorios que he utilizado, para que la programación sea mas fácil.
Ante todo, os comento que en esta primera parte, he estado trabajando con Eclipse, ya que para desarrollo PHP se adapta muy bien… y muchos estáis habituados a trabajar con él, posteriormente, pasaré a utilizar Visual Code, eso si, compartiendo todo el código, para que solo exista un ejemplar del mismo en nuestra máquina.
En el articulo anterior, os explicaba como crear la entrada en Eclipse, y como hacer que la carpeta de fuentes, ya este físicamente en su sitio, esto es, bajo el directorio «./wordpress/wp-content/plugins»
Eso significa que, en cuanto creéis el fichero rf_plugin_menu_r.php, ya podréis activar vuestro menú e ir haciendo pruebas con él, a medida que vayáis avanzando. Recordad que necesitáis tener instalado un servidor web y una base de datos, com XAMP, WAMP y cualquier otro paquete que estiméis oportuno, y que he de levantar wordpress en local, como lo explicaba en el articulo anterior
Nuestro fichero de plugin.
Para detectar la existencia de un plugin, wordpress busca las carpetas o fichero existentes dentro del directorio de plugins. Por motivos organizativos, voy a a defender siempre que creéis una carpeta, y dentro de ella, toda la estructura que necesitéis. En mi caso, he creado la carpeta «rf_plugin_menu_r», y dentro, he creado un fichero con ese mismo nombre, en donde está la definición del plugin.
Solo una aclaración
Solo respecto al nombre utilizado. Ya que el plugin lo desarrollo como «Recursos Formacion», las dos primeras letras lo identifican así, intentando evitar nombres duplicados. Luego, indico lo que estoy haciendo «Plugin para desarrollo de un menú para establecimientos de restauración»
Respecto a nuestra pagina; debemos escribir entre comentarios, las palabras reservadas que wordpress nos ofrece para definir nuestro plugin. En mi caso, esta es la estructura que he definido
Solo con esta información, podemos guardar la pagina, que si todo lo hemos hecho bien estará en la carpeta de plugins
Y por lo tanto, si vamos a nuestra pagina de plugins de WordPress y lo veremos en la lista, pendiente de Activar
Realmente, ya lo podemos activar, aunque no nos va a hacer nada, y deberemos volverlo a desactivar cuando tengamos lista la definición de tablas
De momento, vamos a continuar; si os habéis fijado anteriormente en la lista de carpetas que aparecían en mi directorio, ya tenéis la estructura completa del proyecto, y ahora las vamos a revisar
- .vscode – Este directorio lo crea internamente VisualCode, y, no nos vamos a preocupar de el, en absoluto
- clases – En este directorio van a encontrarse todos los ficheros que desarrollemos para el lado servidor, y que constituirán una pequeña API. Dado que vamos a utilizar clases en PHP, bajo esta carpeta, estará toda nuestra estructura de carpetas y ficheros
- widget – Debajo de esta carpeta, se va a encontrar nuestra aplicación REACT cliente. Hubiéramos podido buscar otra forma para separar el código fuente, pero a estas alturas, creo que es mas sencillo manejarlo así
El resto de ficheros los iremos comentando cuando necesitemos crearlos, aunque ya os avanzo que en index.css se encontrara todo el css necesario, el config.php se puede emplear si tenemos alguna constante que guardar, y el uninstall.php, se deberá encargar de realizar la desinstalación de nuestro plugin
La pagina entera, se ve así
<?php use rf\mrw\rf_plugin_menu_r\clases\RfPluginMenuR; /* Plugin Name: Creacion menus restauracion Plugin URI: https://recursosformacion.com/wordpress Description: Edicion de menus dentro de un entorno wordpress Version:1.0 Date: 2021-05-26 Author:Miguel Garcia Author URI:https://recursosformacion.com/ License:GPLv2 Text Domain: rf_plugin_menu_r */ defined('ABSPATH') or die("Nop"); //Controlamos que nos llama wordpress define ('DEBUG',false); define ('RFM_RUTA',plugin_dir_path(__FILE__)); //Direccion absoluta de la raiz del plugin define ('RFM_DIR_URL', plugin_dir_url(__FILE__) ); //URL de acceso a la zona de plugin define ('RFM_WIDGET_PATH', RFM_RUTA . 'widget' ); //Ruta a la aplicacion react define ('RFM_ASSET_MANIFEST', RFM_WIDGET_PATH . '/build/index.asset.php' ); //Ruta y fichero de manifiesto de react define ('RFM_INCLUDES', plugin_dir_path( __FILE__ ) . '/includes' ); //Ruta ficheros include define ('CLASES_FOLDER', RFM_RUTA . '/clases/'); //Ruta absoluta a la carpeta de clases define ('CONTROLLER_FOLDER', CLASES_FOLDER . 'controllers/'); //Ruta absoluta a la carpeta de los controladores define ('MODELOS_FOLDER', CLASES_FOLDER . 'modelos/'); //Ruta absoluta a la carpeta de los modelos define ('SERVICE_FOLDER', CLASES_FOLDER . 'service/'); //Ruta absoluta a la carpeta de los modulos de servicio define ('RFM_NOMBRE','Gestion menus bar/restaurant'); //Titulo del plugin define ('RFM_NOMBRE_CORTO','G.M.restauracion'); //Nombre de la entrada para el menu de administracion if ( is_admin() || ( defined( 'WP_CLI' ) && WP_CLI ) ) { //Comprobar que se tienen los permisos correctos require_once( CLASES_FOLDER .'RfPluginMenuR.php' ); //Cargamos la clase de arranque $rfmO = new RfPluginMenuR(); //la instanciamos $rfmO->init(); //Inicializamos el menu // activaci�n de plugin register_activation_hook( __FILE__, [ $rfmO, 'activacion' ] ); //establecemos, aqui mismo las funciones para activacion y register_deactivation_hook( __FILE__, [ $rfmO, 'desactivacion' ] ); // desactivacion }
Antes de que podáis probarla, deberéis preparar la clase que se dedica a organizar la instalación y desinstalación (RfPluginMenuR.php) y que vemos en el siguiente articulo