WordPress

Tutorial de WordPress Plugins: Cómo crear un plugin de WordPress

Introducción

En este tutorial de WordPress sobre plugins aprenderás a cómo crear un plugin completo de WordPress con su propia página de administración. La razón más importante para crear un plugin es que te permite separar su código del código del de WordPress. Si algo sale mal con tu plugin, el resto del sitio generalmente continuará funcionando.

Alterar el código principal de WP puede ser catastrófico. Con las funciones avanzadas para crear plugins que te da WordPress puedes crear plugins que cambien la forma en que se manejan las funciones básicas sin alterar tu código.

¿Qué necesitas?

Para completar los pasos de este tutorial de plugins de WordPress, necesitarás un editor de texto como Notepad ++ o NetBeans. También necesitarás acceso FTP a tu cuenta de hosting y una instalación de WordPress en funcionamiento.

Puedes aprender a conectar Notepad ++ a su servidor FTP leyendo cómo conectarse a FTP con el tutorial Notepad ++. También puedes usar el software FTP como FileZilla para cargar tus archivos, y y ver el tutorial sobre cómo configurar el cliente FileZilla.

Este tutorial de WordPress plugin está destinado a personas que ya tienen conocimientos básicos de PHP. Escribirás una nueva función, llamarás a funciones existentes de WordPress usando parámetros y escribirá comentarios de PHP.

También se recomienda encarecidamente crear una copia de seguridad de su sitio web antes de seguir adelante.

¿Qué son los plugings de WordPress?

Un plugin de WordPress es un conjunto independiente de código que mejoran y amplían la funcionalidad de WordPress. Mediante el uso de cualquier combinación de PHP, HTML, CSS, JavaScript / jQuery, o cualquier otro lenguaje de programación web, un plugin puede dar nuevas características a cualquier parte de tu sitio web, incluyendo el Panel de control de administración. Puedes modificar el comportamiento predeterminado de WordPress o eliminar completamente el comportamiento no deseado. Los plugins te permiten modificar y personalizar fácilmente WordPress para satisfacer tus necesidades.

Debido a que los plugins de WordPress son independientes, no alteran físicamente ningún código básico de WordPress. Se pueden copiar e instalar en cualquier instalación de WordPress. Una manera alternativa (y fuertemente desalentada) de hacer cambios a WordPress es escribir nuevas funciones en el archivo functions.php de WordPress, que se almacena en la carpeta /wp-includes/, o en el archivo functions.php que forma parte de un tema . Esto viene con una serie de problemas potenciales.

WordPress y sus temas reciben actualizaciones periódicas. Y a menos que estés usando el tema hijo de WordPress, cuando el archivo functions.php sea sobrescrito por una actualización, tu nuevo código será borrado y tendrás que escribirlo de nuevo. Si escribe muchas funciones y una de ellas tiene un error que no puede depurar, puede que debas reemplazar todo el archivo por el original, eliminando todos los cambios realizados. Si sus funciones se eliminan del archivo, tu sitio web puede estar cubierto en errores de PHP donde intenta llamar a las funciones que faltan.

Los plugins nunca se sobrescriben o eliminan automáticamente al instalar actualizaciones de WordPress. Si su plugin tiene errores de codificación, por lo general sólo puedes desactivarlo en el Panel de control de administración mientras lo arreglas. Si su plugin tiene un error grave, WordPress usualmente los desactivará automáticamente. permitiendo así que tu sitio continúe funcionando.

¿Qué son los ganchos (hooks)?

Los Plugins de WordPress interactúan con código de núcleo utilizando ganchos. Hay dos tipos diferentes de ganchos.

  1. Ganchos de acción (para agregar / quitar funciones)
  2. Ganchos de filtro (Para modificar datos producidos por funciones)

Acciones y Ganchos de Acción

Al visitar cualquier página de un sitio web de WordPress, una serie de funciones de PHP (denominadas acciones) se llaman en varios puntos, y se adjuntan a los ganchos de acción. Utilizando los ganchos de acción proporcionados por WordPress, puedes agregar tus propias funciones a la lista de acciones que se ejecutan cuando se llama a cualquier gancho de acción, y también puede eliminar funciones preexistentes de cualquier gancho de acción. Los ganchos de acción dictan cuando se llaman las acciones. Antes de la etiqueta </ head> de cierre de cualquier página, se llama al gancho de acción wp_head() y se ejecutan las acciones enganchadas a wp_head().

Los ganchos de acción son contextuales: algunos se llaman en cada página de tu sitio web, otros sólo se llaman cuando se visualiza el Panel de control de administración, etc. Se puede encontrar una lista completa de los ganchos de acciones y el contexto en el que se llaman en la página WordPress Plugin API / Action Reference.

Adición de funciones a un gancho de acción Uso de add_action()

Para agregar una función a cualquier gancho de acción, tu complemento debe llamar a la función de WordPress llamada add_action() con al menos dos parámetros.

  • El primer parámetro requerido es el nombre del gancho de acción al que desea adjuntar
  • El segundo parámetro requerido es el nombre de la función que desea ejecutar
  • El tercer parámetro (opcional) es la prioridad de la función que desea ejecutar. Puedes conectar cualquier número de funciones diferentes al mismo gancho de acción, y ordenarlas de la forma que desees. La prioridad predeterminada es 10, poniendo su función personalizada después de cualquiera de las funciones integradas de WordPress. Una función con una prioridad de 11 corre a continuación, y así sucesivamente.
  • El cuarto parámetro (opcional) es el número de argumentos, lo que significa cuántos parámetros su función personalizada puede tomar. El valor predeterminado es 1.

Ejemplo de código de complemento para mostrar texto después del pie de cada página

Este complemento engancha el gancho de acción wp_footer(), que se llama justo antes de la etiqueta </ body> de cierre de cada página, y añade una nueva función llamada mfp_Add_Text(). Puesto que esto es parte de un complemento y no de un tema, continuará funcionando si se activa un tema totalmente diferente. Puede guardar este ejemplo como un archivo PHP, cargarlo en la carpeta wp-content/plugins/ y activarlo en el Panel de control de administración para ver el cambio.

Resultado final:

NOTA: puedes llamar a add_action() antes de definir su propia función porque PHP evalúa todo el script antes de ejecutarlo. Escribir las llamadas add_action() en la parte superior del archivo en el orden en que se ejecutan, a continuación, definir sus funciones en el mismo orden a continuación, hace que el archivo sea más fácil de leer.

Eliminación de funciones de un gancho de acción Uso de remove_action()

Para eliminar una acción de un gancho de acción, debe escribir una nueva función que llame a remove_action() y, a continuación, llame a la función que ha escrito utilizando add_action(). El siguiente ejemplo lo hará más claro.

Debes darle a remove_action() al menos dos partes de información como parámetros.

  • El primer parámetro requerido es el nombre del gancho de acción al que está conectada la función
  • El segundo parámetro requerido es el nombre de la función que desea eliminar
  • El tercer parámetro (opcional) es la prioridad de la función original. Este parámetro debe ser idéntico a la prioridad que se definió originalmente al agregar la acción al gancho de acción. Si no definió una prioridad en su función personalizada, no incluya el parámetro.

Ejemplo: imagina que no deseas que el texto agregado al pie del ejemplo anterior aparezca el lunes. Una forma de hacerlo es utilizando la función de fecha PHP para obtener el día actual, seguido de una instrucción condicional if… then… para probar si el día actual es lunes, y luego llamar a remove_action () si es un lunes. Llamar a la función utilizando add_action (), enganchar cualquier gancho de acción que se produce antes de que el gancho de acción que desea afectar. Si intenta conectar un gancho de acción que se produce después de wp_footer en este ejemplo, la acción no se eliminará del gancho ya que ya se ha ejecutado.

 footer is loaded, my text is added

Filtros y ganchos de filtro

Una función de filtr te permite modificar los datos resultantes que son devueltos por funciones ya existentes y deben estar enganchados a uno de los ganchos de filtro. Los ganchos de filtro disponibles son diferentes a los ganchos de acción. Se comportan de forma similar a los ganchos de acción en que se llaman en varios puntos del guión y son contextuales. Una lista completa de los ganchos de filtro y el contexto en el que se llaman se pueden encontrar en la página de WordPress Plugin API / Filter Reference.

Adición de filtros mediante add_filter()

Para agregar una función de filtro a cualquier gancho de filtro, tu complemento debe llamar a la función de WordPress llamada add_filter(), con al menos dos parámetros.

  • El primer parámetro requerido es el nombre del gancho del filtro que quieres conectar
  • El segundo parámetro requerido es el nombre de la función de filtro que deseas ejecutar
  • El tercer parámetro (opcional) es la prioridad de la función que deseas ejecutar. Puedes conectar cualquier número de funciones de filtro diferentes a un gancho de filtro. La prioridad predeterminada es 10, poniendo su función personalizada después de cualquier función incorporada. Una función con una prioridad de 11 corre a continuación, y así sucesivamente.
  • El cuarto parámetro (opcional) es el número de argumentos, lo que significa cuántos parámetros su función de filtro personalizado es capaz de tomar. El valor predeterminado es 1.

Ejemplo de complemento para modificar el extracto de una publicación

WordPress tiene una función que recupera el extracto de una entrada denominada get_the_excerpt(), que también es un gancho de filtro. La función para mostrar realmente las llamadas de extracto get_the_excerpt() para recuperarla, ahí es donde se aplica el filtro y el fragmento se altera antes de ser mostrado. Este complemento define una función de filtro que toma el extracto como su único parámetro de entrada, añade un texto antes de él y devuelve el nuevo valor cada vez que se llama a get_the_excerpt(). Como el valor devuelto de la función get_the_excerpt() es el texto del extracto real, se introduce automáticamente como el parámetro $old_Excerpt de las funciones cuando se llama usando add_filter(). La función que defina debe devolver el nuevo valor.

Resultado final:

 

Eliminación de filtros mediante remove_filter ()

Eliminar un filtro es mucho más sencillo que eliminar una acción porque puedes llamar a la función remove_filter() sin definir una nueva función. Para este ejemplo, vamos a añadir de nuevo una situación condicional muy simple y eliminar el texto si el día actual es un jueves.

Ahora que tiene una comprensión básica de los ganchos y los filtros, vamos a crear un simple plugin de WordPress que añade un nuevo enlace y una página al Panel de control de administración.

Paso 1 – Almacenamiento de tu plugisn

El primer paso para crear tu plugin de WordPress es crear una carpeta para almacenar todos tus archivos. Los complementos se guardan en la siguiente carpeta: /wp-content/plugins/. La carpeta que crees, debe tener un nombre único y descriptivo para garantizar que no choque con ningún otro complemento. Conéctate a tu cuenta de alojamiento con un cliente FTP. Desde el directorio principal de WordPress, navega a wp-content, luego a plugins. Dentro de la carpeta de plugins, crea una nueva carpeta llamada my-first-plugin.

crear plugin wordpress

Para hacer las cosas mucho más fáciles para ti en el futuro, lo mejor es separar los distintos archivos que componen su plugin de WordPress y darles sus propias subcarpetas, en lugar de tener todos los archivos de tu plugin en la carpeta principal. Cuando un plugin crece y se vuelve complejo, es mucho más fácil encontrar un archivo específico cuando todo tiene su propio lugar. Si el plugin utiliza CSS personalizado, crea una carpeta CSS y guarda todos los archivos CSS. Si tu plugin utiliza JavaScript personalizado, crea una carpeta JavaScript.

Paso 2 – Creación del primer archivo

El primer archivo en tu plugin es importante. Contiene toda la información que WordPress necesita para mostrar tu complemento en la lista de complementos, lo que te permite activar el plugin.

En su carpeta my-first-plugin, crea un nuevo archivo PHP llamado my-first-plugin.php.
Es una buena práctica darle a este primer archivo un nombre similar al que le dio a su carpeta, pero puede tener cualquier nombre que le guste. Agrega la etiqueta PHP de apertura <?php a la primera línea. No es necesario agregar una etiqueta de cierre al final del archivo (para entender por qué, lee la nota en esta página del manual de PHP). Este archivo tendrá principalmente “comentarios de encabezado” con varias piezas de información que serán leídas / visualizadas por WordPress. Los comentarios de encabezado van en un comentario de PHP de varias líneas, uno por línea y cada línea comienza con un texto específico para definir a qué se refiere la línea. Éstos deben ir solamente en este primer archivo y no necesitan estar en ningún otro archivo.

El primer comentario que debes añadir a my-first-plugin.php es el nombre de tu plugin. Comience por escribir el abridor de comentarios de varias líneas de PHP / * en la segunda línea del archivo, justo debajo de la etiqueta PHP de apertura. En la tercera línea, escriba Plugin Name: My First Plugin. En la cuarta línea, cierre la sección de comentarios con */. Su archivo se verá así:

Guarda el archivo y cargarlo en la carpeta my-first-plugin. Navega a la página de plugins del Panel de control de administración de WordPress. Ahora verás un plugin en la lista denominada My First Plugin con enlaces para activar, editar y eliminar el complemento. Hay diferenctes piezas de información que puedes agregar desde ahora, tales como una descripción del plugin, el nombre, un enlace al sitio web, la versión actual de tu plugin, etc Por ahora, sólo agrega una descripción y tu nombre.

Editar my-first-plugin.php como se ve en el siguiente ejemplo, subelo y sobrescribe el archivo antiguo cuando se te pregunte:

Una vez que este cargado, actualiza la página Plugins en el área de administración de WordPress y ahora debes ver tu plugin con tu nueva descripción.

Paso 3 – Escribir las funciones de tu plugin

Como se mencionó anteriormente, la mejor práctica al desarrollar un plugin es separar cuidadosamente su código en archivos y carpetas apropiados. Dado que el trabajo primario del primer archivo es mantener los encabezados de los comentarios, tiene sentido colocar el resto del código del complemento en archivos separados en su propia subcarpeta, utilizando las funciones de “incluir” de PHP para acceder a ellos. Cualquier archivo almacenado en subcarpetas se llama directamente por nuestro código y sólo por nuestro código, por lo que los nombres de subcarpeta no necesitan un prefijo. Sin embargo, es muy recomendable que dé a todos tus archivos, funciones y variables un prefijo único en su nombre para evitar conflictos con otros plugins. En este caso, usamos mfp como un prefijo, la cual es la abreviatura de ‘My First Plugin’.

En la carpeta principal de tu pkugin, crea una nueva carpeta llamada includes. Cualquier archivo que sea “incluido” por otro archivo irá en esta carpeta. Cree un nuevo archivo PHP en la carpeta includes y guárdalo como mfp-functions.php. Debes darle la apertura <?php etiqueta en la primera línea. Este nuevo archivo es donde se almacenarán todas las funciones de tu plugin.

Ahora regresa a my-first-plugin.php en la carpeta principal de tu plugin. Necesitamos hacer que incluya el archivo mfp-functions.php para que podamos usar las nuevas funciones. Ahora este es el archivo principal del plugin, incluyendo mfp-functions.php aquí hace que las funciones estén disponibles para cualquier otro archivo en su plugin. Utiliza require_once para asegurarte de que el plugin sólo funcione si el archivo de funciones está disponible. La forma más fácil de incluir archivos de su carpeta de complementos es mediante la función WordPress plugin_dir_path (__ FILE__), que da la ruta completa al directorio donde se encuentra nuestro complemento, luego use a . (punto) para añadir el nombre de la subcarpeta que creamos anteriormente (includes), seguido del nombre del archivo que creamos (mfp-functions.php).

Editar my-first-plugin.php como se muestra a continuación, a continuación, guardar y cargar una vez más, sobrescribiendo la versión anterior cuando se te pregunte.

Vuelve a mfp-functions.php en la subcarpeta includes.

Es una gran idea agrupar funciones similares y escribir un comentario de varias líneas sobre cada grupo que describe el grupo, seguido de un breve comentario de una sola línea sobre cada función describiéndolo brevemente. De esa manera no tienes que leer todo el código para encontrar una función y averiguar lo que hace. Nombraremos la función mfp_Add_My_Admin_Link(). La función agregará un nuevo enlace de nivel superior al menú de navegación del Panel de control del administrador.

Para recapitular – escribir una nueva función implica los siguientes pasos:

  • Escribe un comentario describiendo la función
  • Nombra la función
  • Escribe la función

En mfp-functions.php, escribe lo siguiente:

Dentro de nuestra función, necesitamos usar la función incorporada de WordPress add_menu_page () para dar a nuestro menú un nombre, un título y dictar quién está autorizado a verlo. Entonces le decimos qué mostrar cuando ves lla página. También puedes asignar al icono de menú un icono y establecer su posición en el menú de navegación del panel de control de administración. Estos son opcionales, por lo que los dejaremos fuera de este tutorial.
El ícono predeterminado de cog aparecerá en el enlace a nuestra página. Nuestro enlace aparecerá en la parte inferior del menú de navegación del panel de control de administración.
Toda esta información se introduce como parámetros de add_menu_page ().

Los cuatro parámetros requeridos de add_menu_page() todos aparecen en su propia línea para mejorar la legibilidad, en este orden:

  1. El título de la página que ves después de hacer clic en el enlace (que se muestra en la pestaña del navegador)
  2. Texto para mostrar como el enlace de menú (que se muestra en la lista de navegación del panel de control de administración), este debe ser el nombre de tu plugin
  3. Requisito de capacidad del usuario para ver el menú, en este ejemplo sólo los usuarios con la capacidad ‘manage_options’ pueden acceder a la página (no te preocupes por eso por ahora)
  4. El archivo que se usará al mostrar la página real (lo crearemos a continuación), que se almacenará en la subcarpeta includes y se llamará mfp-first-acp-page.php. La URL introducida aquí se conoce como “slug”.

Antes de continuar, es importante tener en cuenta que hay una forma alternativa de utilizar esta función. El cuarto parámetro puede ser simplemente una cadena de texto que se muestra en la url después de ‘wp-admin/admin.php?Page=‘. Si ingresas ‘mi-página de plugin’, la URL se convertirá en ‘wp-admin / admin.php? Page = my-plugin-page’. El quinto parámetro debe ser el nombre de una función que genera algo. Puedes escribir una función que sólo hace eco de ‘Bienvenido a la página 1’ por ejemplo. Es significativamente más fácil crear un archivo PHP para sostener tu página.

Editar mfp-functions.php, remove // Mi código va aquí, sustituirlo por add_menu_page() y darle los parámetros como se muestra a continuación:

Para que esta función se ejecute realmente, necesitamos usar la función de WordPress llamada add_action() con dos parámetros, como se describe en la sección “Añadir Funciones a una Gancho de Acción” de este tutorial. Es posible que desee volver a leer esa sección antes de continuar.

  • El primer parámetro es el gancho de acción que desea segmentar. En nuestro caso, el gancho de acción es admin_menu – esto significa que nuestra función se ejecuta cuando se genera el menú Admin.
  • El segundo parámetro es sólo el nombre de la función a ejecutar. La función que escribimos se llama mfp_Add_My_Admin_Link. Ten en cuenta que los paréntesis NO se utilizan aquí. Recuerd que el PHP evalúa todo el script antes de ejecutarlo, lo que le permite usar add_action () antes de definir la función nombrada en el parámetro 2.

Nuestro archivo final tiene este aspecto:

Carga mfp-functions.php en la carpeta includes y sobrescribe la antigua.

Paso 4 – Creación de la nueva página de administración

Ahora podemos crear la página que se mostrará cuando hagas clic en el enlace del panel de control de administración. Vuelve a la subcarpeta includes y crea un nuevo archivo PHP llamado mfp-first-acp-page.php. Las etiquetas de apertura de PHP no son necesarias en este archivo, ya que sólo estamos usando HTML. Escriba el HTML a continuación y cargue el archivo.

Al crear las páginas de administración, WordPress recomienda adjuntar tu propio HTML con una div y darle la clase “wrap”, como se muestra arriba. Esto garantiza que todo tu contenido aparezca en el lugar correcto, al igual que cualquier otra página de administración. Si no lo envuelves así, la página puede volverse muy desordenada.

Regresa a tu lista de plugins en el Panel de control de WordPress Admin y activa el plugin. Una vez que se cargue la página, busca en la parte inferior del menú de navegación del panel de control de administración. Hay el nuevo enlace llamado ‘My First Plugin’. Haga clic en él, y ya tienes tu propia página del panel de control de administración!

Conclusión

¡Enhorabuena, acabas de crear tu primer plugin de WordPress, agregaste vínculo nuevo al menú de administración y mostró una página completamente nueva en el Panel de control de administración! No hace muchas funciones todavía, pero este es el primer paso después de todo. Desde aquí, puedes aprovechar lo que has aprendido y ampliar WordPress de la manera que desees. Para más tutoriales, date un vistazo a nuestra sección de tutoriales de WordPress.

Agregar un Comentario

Darle clic aqui para dejar un comentario

Únete a cientos de suscriptores en todo el mundo

y consigue increíbles tutoriales y descuentos en tu email

Please wait...

¡Gracias por registrarte!