Comenzar desde cero: crear tu primer complemento de WordPress.

Preparativos previos al desarrollo

Antes de empezar a escribir código, necesitamos asegurarnos de que el entorno de desarrollo esté configurado correctamente y de comprender la estructura básica de los plugins de WordPress. Un entorno de desarrollo local adecuado es la base para trabajar de manera eficiente.

Crear un entorno de desarrollo local

En primer lugar, necesitas un entorno de servidor local para ejecutar WordPress. Se recomienda utilizar herramientas integradas como XAMPP, MAMP o Local by Flywheel. Una vez que hayas instalado WordPress, podrás… wp-content/plugins Comience a desarrollar sus plugins en este directorio. Este es el lugar donde se almacenan todos los plugins, ya sean los que usted mismo ha creado o los que ha instalado desde el directorio oficial.

Comprender los archivos centrales del plugin

Cada plugin de WordPress necesita al menos un archivo principal, que funciona como el “dossier de identidad” y el “iniciador” del plugin. Este archivo suele llevar el nombre de la función que desempeña el plugin. my-first-plugin.phpEl bloque de comentarios en la parte superior de este archivo principal es de vital importancia, ya que proporciona al sistema de WordPress información básica sobre este plugin.

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

Crea tu primer archivo de plugin.

Ahora, comencemos por la parte más básica y creemos un plugin sencillo que cuente con funciones reales.

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

Escribir las notas de cabecera del complemento (plugin).

En wp-content/plugins En el directorio, cree un archivo llamado… my-first-plugin Cree una nueva carpeta. Luego, dentro de esa carpeta, genere el archivo principal. my-first-plugin.phpEn la parte superior de este archivo, es necesario agregar una nota de cabecera con información sobre el plugin que cumpla con los estándares de WordPress.

<?php
/**
 * Plugin Name:       我的第一个插件
 * Plugin URI:        https://yourwebsite.com/my-first-plugin
 * Description:       这是一个用于学习的简单插件，用于在文章末尾添加自定义文本。
 * Version:           1.0.0
 * Author:            你的名字
 * Author URI:        https://yourwebsite.com
 * License:           GPL v2 or later
 * Text Domain:       my-first-plugin
 */

Este código indica a WordPress que se trata de un plugin y define información como su nombre, descripción, versión, etc., que se mostrará en la interfaz de administración del sitio. Después de guardar el archivo, inicie sesión en la consola de administración de WordPress, vaya a la página de “Plugins” y debería ver su plugin en la lista. Ahora puede activarlo, aunque todavía no cuenta con ninguna función.

Implementar una función básica: filtrar el contenido de los artículos.

Después de activar el plugin, necesitamos que haga algo. Una función común y sencilla para comenzar es modificar el contenido de los artículos. Vamos a utilizarla. the_content Este gancho de filtro añade automáticamente un texto personalizado al final de cada artículo.

En el archivo principal my-first-plugin.php Debajo de los comentarios de cabecera, agregamos el código de funcionalidad:

Lecturas recomendadas Cómo crear un tema profesional para WordPress: Una guía completa desde cero hasta la puesta en línea。

// 在文章内容末尾添加自定义文本
function myfp_add_custom_text_to_content( $content ) {
    // 确保只在主循环的单篇文章页面添加
    if ( is_single() && in_the_loop() && is_main_query() ) {
        $custom_text = '<p><strong>¡Gracias por leer! Este artículo cuenta con el apoyo de “Mi primer plugin”.</strong></p>';
        $content .= $custom_text;
    }
    return $content;
}
// 将我们的函数挂载到 ‘the_content’ 过滤器上
add_filter( 'the_content', 'myfp_add_custom_text_to_content' );

Este código define un elemento llamado… myfp_add_custom_text_to_content Es una función que recibe el contenido de un artículo. $content Como parámetro, se utiliza una condición para asegurar que el texto solo se añada en la página de un artículo específico en la parte frontal del sitio web, evitando que también se aplique en otras páginas (como las páginas de listas). Luego, se agrega un fragmento de HTML personalizado al final del contenido original y se devuelve el contenido modificado. add_filter() La función “monta” esta función personalizada en el núcleo de WordPress. the_content Está activado en el filtro. De esta manera, cada vez que WordPress esté listo para generar el contenido de los artículos, primero se ejecutará nuestra función.

Después de guardar el archivo, visita la página principal del sitio web y consulta cualquier artículo. Notarás que el texto de agradecimiento que hemos añadido ya aparece en la parte inferior de la página.

Añadir opciones de administración para el plugin.

Un complemento (plugin) con funciones completas suele necesitar algunas opciones de configuración que permitan a los usuarios realizar ajustes en el backend. Vamos a agregar una página de configuración para la función de “texto personalizado” que acabamos de crear.

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

Crear menú de administración de plugins

Primero, necesitamos agregar un nuevo elemento de menú en el panel de administración de WordPress. Para ello, debemos utilizar las funcionalidades proporcionadas por WordPress. add_action() Las funciones y admin_menu Gancho.

// 添加管理菜单
function myfp_add_admin_menu() {
    add_options_page(
        '我的第一个插件设置', // 页面标题
        '我的插件设置',       // 菜单标题
        'manage_options',    // 权限要求
        'my-first-plugin',   // 菜单 slug
        'myfp_options_page_html' // 显示设置页面的回调函数
    );
}
add_action( ‘admin_menu’， ‘myfp_add_admin_menu’ );

add_options_page() La función creará un elemento de menú secundario dentro del menú principal “Ajustes”. Requiere varios parámetros: el título de la página, el título del menú, los permisos del usuario, un identificador único para el menú (slug), y el nombre de una función de callback que se utilizará para generar el contenido HTML de la página de configuraciones. myfp_options_page_html。

Construir una página de configuración y guardar datos.

A continuación, necesitamos definir una función de callback para renderizar la página de configuración y procesar los datos enviados por el usuario.

Lecturas recomendadas Tutorial para el desarrollo de plugins para WordPress: Crea tu primer plugin desde cero。

// 渲染设置页面的HTML
function myfp_options_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( ‘myfp_settings’ );
            // 输出设置区域
            do_settings_sections( ‘my-first-plugin’ );
            // 输出提交按钮
            submit_button( ‘保存设置’ );
            ?>
        <input type="hidden" name="trp-form-language" value="es"/></form>
    </div>
    ‘myfp_field_custom_text’ ]
    );
}
add_action( ‘admin_init’， ‘myfp_settings_init’ );

// 渲染文本框的HTML
function myfp_field_custom_text_html() {
    // 从数据库获取已保存的值
    $options = get_option( ‘myfp_options’ );
    $value = $options[‘myfp_field_custom_text’] ?? ‘’； // 使用空合并运算符，如果不存在则赋空值
    ?&gt;
    <input type="“text”"
           id="“myfp_field_custom_text”"
           name="“myfp_options[myfp_field_custom_text]”"
           value="“NO NUMERIC NOISE KEY" 1000”
 class="“regular-text”">
    ¿php?  
}

Este código se ejecuta a través de register_setting、add_settings_section Y add_settings_field Una serie de funciones fueron utilizadas para crear de manera estándar una página de configuraciones que incluye un cuadro de texto, utilizando las especificaciones de la API de Configuraciones (Settings API) de WordPress. El contenido introducido por el usuario se guarda de manera segura en el sistema. wp_options «Tabla de datos» myfp_options Registrado.

Finalmente, necesitamos modificar la función que anteriormente filtraba el contenido de los artículos para que utilice el texto obtenido de la base de datos en lugar de texto codificado de forma fija.

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 myfp_add_custom_text_to_content( $content ) {
    if ( is_single() && in_the_loop() && is_main_query() ) {
        $options = get_option( ‘myfp_options’ );
        $custom_text = $options[‘myfp_field_custom_text’] ?? ‘’；
        if ( ! empty( $custom_text ) ) {
            $content .= ‘<p><strong>’ . esc_html( $custom_text ) . ‘</strong></p>’；
        }
    }
    return $content;
}

Ahora, los usuarios pueden ingresar cualquier texto en la página “Ajustes” -> “Configuraciones de mis plugins”. Después de guardarlo, dicho texto se mostrará al final de todos los artículos del sitio web.

Prácticas avanzadas de desarrollo de plugins y preparación para su publicación

Una vez que las funciones básicas estén completas, debemos considerar la robustez y la mantenibilidad de los plugins, así como la forma en que podremos compartirlos para que otros los utilicen.

Añadir soporte de seguridad e internacionalización.

La seguridad es de suma importancia en el desarrollo de plugins. En el ejemplo anterior, ya la hemos tenido en cuenta. esc_html() Y esc_attr() Se deben utilizar funciones específicas de WordPress para escapar los datos generados, con el fin de prevenir ataques XSS. Al procesar datos proporcionados por los usuarios, ejecutar consultas a la base de datos o incorporar archivos externos, es esencial utilizar siempre las funciones de seguridad ofrecidas por WordPress. wpdb->prepare()、sanitize_text_field() Y check_admin_referer() etc.

Además, para que el plugin pueda ser utilizado por usuarios de todo el mundo, es necesario realizar la internacionalización (i18n). Debemos envolver todas las cadenas de texto dirigidas al usuario dentro del plugin utilizando las funciones de traducción de WordPress. Esto implica modificar el código que ya hemos escrito.

1. Ya se ha especificado en las notas del encabezado del plugin. Text Domain: my-first-plugin。
2. Cargar el campo de texto. Generalmente, se agrega esto al final del archivo principal:add_action( ‘plugins_loaded’， function() { load_plugin_textdomain( ‘my-first-plugin’， false， dirname( plugin_basename( FILE ) ) . ‘/languages/’ ); } );。
3. Cadenas de texto para envoltorios. Por ejemplo, cambiar el título de la zona de configuración a… ( ‘自定义文本设置’， ‘my-first-plugin’ )Cambia el título del menú a: ( ‘我的插件设置’， ‘my-first-plugin’ )De esta manera, los traductores podrán hacerlo a través de… .po/.mo El archivo proporciona versiones en otros idiomas para estos textos.

Preparando el plugin para su publicación en el directorio oficial.

Si deseas enviar un plugin al directorio oficial de plugins de WordPress.org, debes seguir una serie de normas:
1. Normas de codificación: Se deben seguir los estándares de codificación de WordPress.
2. Estructura del archivo: Además del archivo principal, generalmente se necesitan también… README.txt(Descripción del plugin, utilizado en las páginas de directorio)uninstall.php(La limpieza que se realiza al desinstalar un plugin, etc.)
3. Repositorio SVN: El directorio oficial utiliza Subversion (SVN) para la gestión de versiones. Debes enviar el código de tu plugin al repositorio SVN especificado.
4. Metadatos:README.txt Es necesario escribir el contenido siguiendo un formato específico, que incluya el nombre del plugin, una descripción de su función, los pasos para instalarlo, las preguntas frecuentes que pueden surgir, así como los registros de actualizaciones.

resúmenes

A través de este tutorial, has completado un ciclo de desarrollo completo de un plugin para WordPress: desde crear el primer archivo, escribir las notas de cabecera, utilizar los ganchos de acción (action hooks) y los ganchos de filtro (filter hooks) para implementar las funciones esenciales, hasta agregar páginas de configuración personalizables al plugin, y finalmente has aprendido sobre seguridad, internacionalización y preparación para la publicación. Aunque el plugin que añade texto personalizado al final del artículo es sencillo, cubre los conceptos y procesos más fundamentales del desarrollo de plugins. Una vez que domines estos conocimientos básicos, podrás crear plugins cada vez más potentes y complejos explorando el amplio sistema de ganchos (Hooks), los códigos cortos (Shortcodes), los tipos de artículos personalizados (Custom Post Types, CPT) y el API REST de WordPress. Recuerda que la práctica es la mejor forma de aprender; intentar modificar el código y agregar nuevas funciones es clave para consolidar tus conocimientos.

FAQ Preguntas más frecuentes

¿Cómo debe llamarse el archivo principal del plugin?

No existe una exigencia obligatoria para el nombre del archivo principal del plugin, pero debe comenzar con «plugin». .php Al final, por razones de claridad y unicidad, generalmente utilizamos nombres que coincidan con el nombre de la carpeta del plugin o que describan la función de dicho plugin. Por ejemplo… my-awesome-plugin.phpWordPress reconoce los plugins al leer un bloque de comentarios específico en la parte superior de ese archivo.

¿Por qué mi plugin no se muestra en el menú de fondo?

Esto generalmente se debe a varios motivos. En primer lugar, por favor, verifique si el plugin se ha activado con éxito. En segundo lugar, examine… add_menu_page() O asegúrate de que los parámetros de permisos de usuario (capability) en funciones similares indiquen que el usuario que está conectado cuenta con los permisos correspondientes (por ejemplo…). manage_optionsFinalmente, verifica si tu función se ha ejecutado correctamente. add_action(‘admin_menu’， …) Montar. Cualquier error de sintaxis en PHP puede provocar que la inicialización del plugin fracase por completo.

¿Cómo depurar los errores de PHP en un plugin?

Durante la fase de desarrollo, se recomienda activar el modo de depuración de WordPress. Para hacerlo, abra el archivo de configuración de WordPress (generalmente llamado `wp-config.php`) que se encuentra en la carpeta raíz del sitio web. Busque la sección llamada `debug` y active las opciones correspondientes. wp-config.php Para el archivo, asegúrese de que las siguientes configuraciones estén activadas:
define( ‘WP_DEBUG’， true );
define( ‘WP_DEBUG_LOG’， true ); // 将错误记录到 /wp-content/debug.log
define( ‘WP_DEBUG_DISPLAY’， false ); // 不建议在页面上显示，以免破坏布局
De esta manera, los mensajes de error se registrarán en el archivo de registro, lo que facilita la identificación de problemas. Antes de publicar el complemento, asegúrese de desactivar el modo de depuración.

¿Dónde se guardan los datos de las opciones de los plugins?

Utilización de complementos. add_option() o update_option() Los datos guardados por las funciones se almacenan de forma predeterminada en la base de datos de WordPress. wp_options En la tabla (el prefijo de la tabla puede ser diferente). Utilícelo. get_option() Las funciones pueden leer estos datos. Para estructuras de datos más complejas, a veces también se crean tablas de bases de datos personalizadas, pero esto requiere un manejo más cuidadoso.

¿Cómo puedo hacer que mi plugin sea compatible con múltiples idiomas (internacionalización)?

Debes utilizar las funciones de traducción de WordPress para encapsular todas las cadenas de texto dirigidas al usuario. Las más comunes son… __(‘字符串’， ‘text-domain’) Y _e(‘字符串’， ‘text-domain’)Luego, se utilizan herramientas como Poedit para extraer estas cadenas de texto y generar el resultado deseado. .pot Archivo de plantilla, y crear la versión correspondiente en el idioma deseado (por ejemplo, en español). zh_CN.po Y .moFinalmente, coloque el archivo de idioma en la carpeta del plugin. /languages/ Se encuentra dentro de la carpeta y se utiliza durante la inicialización del plugin. load_plugin_textdomain() Las funciones las cargan.