Desarrollo de plugins para WordPress: Desde los principios hasta la maestría: Te guiamos paso a paso para crear tu primer plugin personalizado

¿Por qué aprender el desarrollo de plugins para WordPress?

La razón por la que WordPress se ha convertido en el sistema de gestión de contenidos más popular a nivel mundial se debe en gran medida a su gran capacidad de expansión. El elemento central de esta capacidad de expansión son los plugins. Al desarrollar plugins personalizados, puedes agregar a tu sitio web cualquier función que imagines, sin necesidad de modificar el código central de WordPress. Esto no solo garantiza la seguridad de las actualizaciones del sistema, sino que también hace que tus funciones sean modulares, lo que facilita su gestión y migración.

Aprender a desarrollar plugins te permitirá pasar de ser un “utilizador” de WordPress a un “creador”. Ya sea que se trate de personalizar funciones únicas para clientes, resolver necesidades comerciales específicas o de transformar tus ideas en productos para vender en el mercado, dominar esta habilidad te abre un abanico de posibilidades. Lo más importante es que comprender el proceso de desarrollo de plugins te ayudará a mejorar tus capacidades de depuración y desarrollo adicional al utilizar otros plugins.

Un plugin estándar de WordPress es, en términos de estructura, una carpeta que contiene el archivo PHP principal. Este archivo principal anuncia su presencia al sistema de WordPress a través de ciertas notas o comentarios en su cabecera. Toda la lógica de negocio, ya sea agregar una nueva herramienta, crear un tipo de artículo personalizado o procesar datos de formularios, se monta y se ejecuta mediante los diferentes “ganchos” (hooks) proporcionados por WordPress.

Lecturas recomendadas WordPress plugin de desarrollo de principiante a maestro: la mano para enseñar a construir sus propias características exclusivas。

Construye tu primer proyecto de plugin.

Antes de comenzar el desarrollo, necesitarás un entorno de desarrollo local. Recomendamos utilizar herramientas como XAMPP, MAMP, Local by Flywheel o Docker para configurar un servidor local que incluya PHP, MySQL y Apache/Nginx. Desarrollar en la instalación local de WordPress te permitirá evitar afectar el sitio web en línea.

Servidor de WordPress de UltaHost

Garantía de reembolso en 30 días, ancho de banda ilimitado y bases de datos, protección gratuita contra ataques DDoS; descuento del 50% al comprar por 3 años (versiones de 4 TB y 5 TB).

página de acceso

Estructura básica de archivos para crear un plugin

El plugin más simple puede constar de un solo archivo. En el directorio de instalación de tu WordPress, entra en… wp-content/plugins Carpeta: Cree una nueva carpeta, por ejemplo… my-first-pluginLuego, dentro de esta carpeta, cree un archivo PHP principal. El nombre del archivo suele ser el mismo que el nombre de la carpeta. my-first-plugin.php。

Escribir la cabecera de metadatos del plugin

En el archivo principal del plugin, el bloque de comentarios situado al principio del mismo es de vital importancia. Este bloque informa a WordPress sobre el nombre del plugin, su descripción, versión, autor y otros detalles relevantes. Un ejemplo de cabecera estándar se muestra a continuación:

<?php
/**
 * Plugin Name:       我的第一个插件
 * Plugin URI:        https://example.com/my-first-plugin
 * Description:       这是一个用于学习 WordPress 插件开发的自定义插件。
 * Version:           1.0.0
 * Author:            你的名字
 * License:           GPL v2 or later
 * License URI:       https://www.gnu.org/licenses/gpl-2.0.html
 * Text Domain:       my-first-plugin
 * Domain Path:       /languages
 */

Después de guardar el archivo, inicie sesión en la consola de administración de WordPress y vaya a la página de “Plugins”. Debería ver que “Mi primer plugin” aparece en la lista de plugins y poder activarlo. Con esto, se ha creado un plugin que, aunque no tiene ninguna función en este momento, tiene la estructura correcta.

Explorando los mecanismos centrales de WordPress: Ganchos (Hooks) y Filtros (Filters)

El núcleo del desarrollo de plugins para WordPress radica en comprender y utilizar su sistema de “ganchos” (hooks). Existen dos tipos de ganchos: los ganchos de acción (action hooks) y los ganchos de filtro (filter hooks). Estos son los mecanismos que permiten a WordPress que usted inserte código personalizado o modifique datos en momentos específicos.

Lecturas recomendadas Guía de introducción al desarrollo de complementos de WordPress: construye tu primera extensión de funcionalidad desde cero.。

Comprender el funcionamiento de los ganchos de acción (action hooks).

Los ganchos de acción (action hooks) te permiten ejecutar tus funciones en momentos específicos del flujo de ejecución de WordPress. Por ejemplo, cuando la página se ha cargado completamente o cuando se publica un artículo. add_action() Las funciones pueden permitir que tus funciones personalizadas se conecten (o “se monten”) a un determinado “gancho” (hook). Su sintaxis básica es la siguiente:add_action( ‘hook_name’， ‘your_function_name’ );。

Vamos a implementar una función para mostrar un mensaje personalizado en la parte inferior de las páginas de la interfaz frontal del sitio web. Para ello, utilizaremos… wp_footer Este es un ganchito de acción.

function my_custom_footer_message() {
    echo '<p style="text-align: center; color: #666;">¡Gracias por visitar nuestro sitio web! Este texto de pie de página ha sido añadido mediante un plugin personalizado.</p>';
}
add_action( 'wp_footer’, 'my_custom_footer_message’ );

Añada el código a su archivo principal del plugin. my-first-plugin.php Al guardar los cambios y actualizar la página principal del sitio web, verás este texto en el pie de página.

hosting.com Alojamiento compartido

Alto rendimiento con CPU AMD EPYC, almacenamiento SSD NVMe y LiteSpeed, asistencia interna de expertos 24 horas al día, 7 días a la semana, medidas de seguridad avanzadas como SSL, fuerza bruta, protección contra malware y DDoS, ahorro de hasta 73%.

página de acceso

Utilizar filtros para modificar el contenido predeterminado.

Los ganchos de filtro se utilizan para modificar los datos que genera WordPress durante su proceso de procesamiento. A diferencia de los ganchos de acción, las funciones de filtro deben devolver un valor. add_filter() Se utiliza una función para montar (o aplicar) filtros. Por ejemplo, para modificar el contenido predeterminado del título de un artículo:

function modify_post_title( $title ) {
    if ( is_single() ) {
        return '【精选】’ . $title;
    }
    return $title;
}
add_filter( ‘the_title’, 'modify_post_title’ );

Esta función añade el prefijo “【Selección】” delante del título de las páginas individuales de los artículos, mientras que los títulos de otras páginas (como la página principal o las páginas de listas) se mantienen sin cambios. Al combinar acciones y filtros, puedes controlar casi cada aspecto de WordPress.

Construir una página de administración de backend práctica.

Para que los usuarios de los plugins puedan configurar las opciones, generalmente es necesario crear una página de administración en el backend para ellos. Esto implica el uso de la API del menú de administración de WordPress.

Lecturas recomendadas Desarrollo de plugins para WordPress: Desde los principios hasta la maestría: Una guía completa para crear módulos con funciones altamente personalizables。

Añadir un nuevo elemento de menú de administración.

utilizar add_menu_page() o add_options_page() Funciones como estas permiten agregar una nueva página al menú de la izquierda en la interfaz administrativa de WordPress. Tomemos como ejemplo el proceso de agregar una página dentro del submenú “Ajustes”.

Primero, crea una función para renderizar el contenido HTML de la página de administración.

Alojamiento compartido InterServer

Alojamiento compartido $2.50 USD al mes , primer mes $0.1 USD código promocional tryinterserver, 461 scripts de aplicaciones en la nube, instalación en un clic.

página de acceso

function my_plugin_settings_page_html() {
    // 检查用户权限
    if ( ! current_user_can( ‘manage_options’ ) ) {
        return;
    }
    ?>
    <div class="wrap">
        <h1>¿¿¿¿php echo esc_html( get_admin_page_title() ); ?&gt;</h1>
        <form action="/es/options.php/" method="post" data-trp-original-action="options.php">
            <?php
            // 输出设置字段和安全字段
            settings_fields( ‘my_plugin_settings’ );
            do_settings_sections( ‘my_plugin_settings’ );
            submit_button( ‘保存设置’ );
            ?>
        <input type="hidden" name="trp-form-language" value="es"/></form>
    </div>
    ¿php?  
}

Configuraciones de registro, bloques y campos

WordPress ofrece… register_setting(), add_settings_section() Y add_settings_field() Este conjunto de API permite gestionar las configuraciones de manera estandarizada. Puede manejar automáticamente la verificación de seguridad (Nonce) así como el almacenamiento y la lectura de las opciones.

A continuación, necesitamos una función para inicializar estos ajustes. Esta función debe ser montada (es decir, debe ser incorporada al sistema de manera que esté disponible para su uso). admin_init En el gancho.

function my_plugin_settings_init() {
    // 注册一个新的设置选项组
    register_setting( ‘my_plugin_settings’, ‘my_plugin_options’ );

// 在页面中添加一个新的区块
    add_settings_section(
        ‘my_plugin_section_1’,
        ‘基础设置’,
        null, // 回调函数，用于输出区块描述，可为空
        ‘my_plugin_settings’
    );

// 在区块内添加一个字段
    add_settings_field(
        ‘my_plugin_field_text’,
        ‘欢迎语’,
        ‘my_plugin_field_text_cb’,
        ‘my_plugin_settings’,
        ‘my_plugin_section_1’,
        [
            ‘label_for’ => ‘my_plugin_field_text’,
            ‘class’ => ‘my_plugin_row’,
        ]
    );
}
add_action( ‘admin_init’, ‘my_plugin_settings_init’ );

// 字段的回调函数，用于输出字段的 HTML
function my_plugin_field_text_cb( $args ) {
    $options = get_option( ‘my_plugin_options’ );
    ?>
    <input type="text" id="<?php echo esc_attr( $args[‘label_for’] ); ?>"
           name="my_plugin_options[<?php echo esc_attr( $args[‘label_for’] ); ?>]"
           value="<?php echo esc_attr( $options[ $args[‘label_for’] ] ?? ‘’ ); ?>">
    <p class="“description”">Este texto se mostrará en la página principal del sitio web.</p>
    ¿php?  
}

Añadir los enlaces de las páginas al menú

Finalmente, utilice… add_options_page() Añada la página que hemos creado al menú “Ajustes”.

function my_plugin_add_settings_page() {
    add_options_page(
        ‘我的插件设置’, // 页面标题
        ‘我的插件’, // 菜单标题
        ‘manage_options’, // 所需能力
        ‘my-plugin-settings’, // 菜单别名
        ‘my_plugin_settings_page_html’ // 渲染页面的回调函数
    );
}
add_action( ‘admin_menu’, ‘my_plugin_add_settings_page’ );

Ahora, después de activar el plugin, podrás encontrar la opción “Mis plugins” en el menú “Ajustes” del panel de administración de WordPress. Al hacer clic en ella, verás una página de configuración que contiene un campo de texto donde podrás ingresar y guardar un mensaje de bienvenida. Posteriormente, podrás utilizar este mensaje según sea necesario. get_option( ‘my_plugin_options’ ) Obtenga y utilice este valor en la interfaz frontal (frontend).

Implementación de las funciones frontales del plugin y consideraciones de seguridad

Al implementar funciones frontales en un plugin, la seguridad es el factor más importante a considerar. Nunca confíes en los datos ingresados por los usuarios; es necesario verificarlos, limpiarlos y escaparlos adecuadamente.

Supongamos que queremos utilizar el “saludo de bienvenida” que se ha guardado en los ajustes del backend y mostrarlo en la parte superior de la página principal del sitio web. Primero, necesitamos obtener esta información de la base de datos y luego mostrarla de manera segura.

function display_frontend_greeting() {
    // 1. 获取数据
    $options = get_option( ‘my_plugin_options’ );
    $greeting = $options[‘my_plugin_field_text’] ?? ‘’;

// 2. 如果内容为空，则不输出任何东西
    if ( empty( $greeting ) ) {
        return;
    }

// 3. 在输出前进行清理和转义
    $safe_greeting = esc_html( $greeting );

// 4. 输出到前端（这里假设只在首页显示）
    if ( is_front_page() ) {
        echo ‘<div class="“my-plugin-greeting”"><p>’. $safe_greeting . ‘</p></div>’;
    }
}
add_action( ‘wp_body_open’, ‘display_frontend_greeting’ );

Aquí hemos utilizado… esc_html() Se utiliza una función para escapar los caracteres HTML con el fin de prevenir ataques de tipo Cross-Site Scripting (XSS). También comprobamos si los datos están vacíos y utilizamos etiquetas condicionales. is_front_page() Se utiliza para controlar la posición de la salida. Se procede al montar (o asociar) la función en el lugar adecuado. wp_body_open Los ganchos pueden garantizar que el contenido se muestre inmediatamente después del inicio de la etiqueta de la página.

Además, en el desarrollo de plugins, la internacionalización también es una práctica importante. Esto se logra mediante el uso de… __() Y _e() Al utilizar funciones de traducción y configurar correctamente el dominio de texto (Text Domain) del plugin, podrás hacer que tu plugin se traduzca a cualquier idioma. En la información metadatos del encabezado del plugin que se mostró anteriormente, ya hemos definido los parámetros necesarios para la traducción. Text Domain: my-first-pluginEn el código, se debe utilizar de la siguiente manera:

echo esc_html__( ‘Hello, World!’, ‘my-first-plugin’ );

resúmenes

A través de las prácticas descritas en este artículo, hemos completado un proceso de desarrollo de plugins para WordPress que, aunque sencillo, es completo en sí mismo. Comenzamos creando la estructura básica de los archivos y la información metadatos del plugin, y luego profundizamos en los mecanismos centrales de WordPress: el sistema de ganchos (hooks). Utilizamos acciones (actions) y filtros (filters) para controlar el flujo de ejecución del programa y modificar los datos. Posteriormente, desarrollamos una página de administración en el backend que incluye campos personalizados, lo que permite a los usuarios configurar las opciones del plugin; finalmente, estas opciones se muestran de manera segura en la página frontal del sitio web.

Este proceso abarca varios aspectos clave del desarrollo de plugins: la organización de archivos, el uso de “ganchos” (hooks), la creación de interfaces de backend, la gestión de opciones y el manejo seguro de datos en la parte frontal del sitio web. Recuerda que un plugin de calidad no solo debe ser funcionalmente potente, sino también seguro, eficiente y fácil de mantener. A continuación, puedes intentar agregar más funcionalidades al plugin, como tipos de artículos personalizados, códigos cortos (shortcodes), herramientas útiles o puntos de conexión (APIs) REST, para profundizar aún más tu comprensión del desarrollo de plugins para WordPress.

FAQ Preguntas más frecuentes

¿Puede un plugin contener únicamente un archivo PHP?

Sí, un plugin de WordPress muy simple puede estar compuesto por un solo archivo PHP, siempre y cuando este contenga las anotaciones de cabecera adecuadas. No obstante, para plugins con funciones más complejas, se recomienda organizar el código en varios archivos distintos: separando las funciones de administración, las funciones que se muestran en la página web y las funciones comunes. Esto mejora la legibilidad y la mantenibilidad del código.

¿Cómo depurar un plugin que has desarrollado tú mismo?

Se recomienda activar el modo de depuración de WordPress. En el directorio raíz del sitio, wp-config.php En el documento, se indicará que... WP_DEBUG Los constantes se establecen en trueDe esta manera, los errores, las advertencias y los avisos de PHP se mostrarán todos. Además, se pueden utilizar en combinación. error_log() La función escribe información de depuración en el registro de errores del servidor, o utiliza la consola de las herramientas de desarrollo del navegador para realizar el depurado de JavaScript.

¿Cuáles son las normas de seguridad que deben cumplirse al desarrollar plugins?

El principio fundamental es: nunca confíes en la información introducida por los usuarios. Para todo lo que provenga de ellos, debes adoptar una actitud de precaución y verificación. $_GET、$_POST、$_COOKIE Se deben verificar y limpiar los datos obtenidos. Al momento de mostrar los datos en HTML, se debe utilizar un proceso adecuado para garantizar que la información presentada sea precisa y coherente. esc_html()、esc_attr()、esc_url() Es necesario utilizar funciones de escape para los caracteres especiales. Al crear consultas de base de datos, asegúrese de utilizar estas funciones adecuadamente. $wpdb->prepare() Existen métodos para prevenir ataques de inyección SQL. Además, es necesario verificar los permisos del usuario actual (por ejemplo…). current_user_can()También es un paso esencial.

¿Cómo puedo enviar mi plugin al directorio oficial de plugins de WordPress?

En primer lugar, asegúrate de que tu plugin cumpla completamente con los estándares de codificación de WordPress y la licencia GPL. Debes visitar WordPress.org, crear una cuenta y luego enviar el paquete comprimido de tu plugin a la página de envío de plugins. El equipo oficial realizará una revisión manual para verificar la calidad del código, la seguridad, la documentación y el cumplimiento de las normas. Una vez aprobado, tu plugin será incluido en el catálogo oficial, recibirá soporte para actualizaciones automáticas y podrá ser buscado e instalado por usuarios de todo el mundo.