Conocimiento Para Potenciar Tu Sitio Web

¿Cómo crear tu primer plugin de WordPress? (Con poca codificación)

¿Cómo crear tu primer plugin de WordPress? (Con poca codificación) thumbnail

Si tuviéramos que enumerar las razones por las que amamos WordPress, los plugins estarían muy cerca al primer puesto de la lista. Estas útiles herramientas dejan agregar todo tipo de funcionalidades a tu sitio en cuestión de segundos. Sin embargo, algunas veces no encuentras el plugin que se ajusta a tus necesidades o simplemente quieres desarrollar tu mismo una solución para tu sitio. 

En ese caso, tienes suerte, es más fácil crear un plugin de WordPress de lo que esperarías. De hecho, puedes crear un plugin con tan solo unas líneas de código y necesitas muy poco conocimiento o experiencia para realizar algo sencillo. 

En este tutorial, vamos a explorar todo la información base para el desarrollo de un plugin. Vamos a explicar cómo funciona un plugin y cómo se ajusta a la comunidad de WordPress. Luego hablaremos de lo que debes saber y finalmente de una guía paso a paso de como crear tu primer plugin de WordPress. ¡Hay mucho por hablar, así que empecemos!

Lo básico de plugins para WordPress

Si ya conoces la plataforma de WordPress, posiblemente ya estés familiarizado con los plugins. Como la documentación oficial lo establece: “Los plugins son una forma de extender y agregar funcionalidades adicionales a lo existente en WordPress.”

WordPress de por sí, consiste en una cantidad pequeña de funcionalidades, que colectivamente conforman la base de la plataforma. Los plugins son adiciones descargables, que llevan archivos y código que expande o altera la funcionalidad base. En efecto, la filosofía de WordPress establece que si una funcionalidad va a ser usada por lo menos por 80% de los usuarios, debe estar incluida en la instalación base. De otra forma, debe ser mejor un plugin. 

Por esta razón, la bandeja de posibilidades ofrecidas por plugins es gigante. Puedes usarlos para adaptar formularios, deslizadores o pop-ups. Pueden ser muy sencillos como Hello Dolly, que despliega una línea aleatoria de una canción popular en la interfaz. O puede ser un plugin mucho más robusto como es el plugin de Jetpack, que añade docenas de nuevas configuraciones y funcionalidades a tu sitio.

¿Estás construyendo un plugin?

Sin complicaciones, el alojamiento WordPress de alto renimiento tepuede ayudar a crecer tu negocio. Planes desde $16.95 USD/mes

Este hecho significa que los plugins son una de las herramientas más importantes de WordPress. Hacen que agregar cualquier funcionalidad al sitio sea super fácil, sin tener que programar o conocer de códigos. Hay miles de plugins gratuitos que puedes usar sin gastar dinero, o puedes seleccionar una de las soluciones premium. Y descargar y agregar plugins a tu sitio solo toma unos pocos clics.

Los plugins son un vehículo importante para aquellos que quieren empezar desarrollando contenido. Como lo comenta nuestra Mika Epstein:

“He restaurado algunos plugins abandonados, forzado a otros a hacer acciones que los autores originales no lo habrían pensado y he desarrollado otros desde cero. La habilidad de tomar el código de otras personas, leerlo, aprender de ellos y mejorarlo, es una de las bases del código abierto. Me ha permitido volverme un poco más en una desarrolladora”

Esa última parte es importante recordarla. Ya que WordPress y los plugins son de código abierto, su código está disponible para cualquiera que quiera usarlo y experimentar. Esta es una excelente forma de relacionarte con desarrolladores para ver como funciona todo detrás del telón e involucrarte en crear plugins.

Las diferencias entre plugins y temas

Antes de que sigamos, vamos a revisar terreno importante. Primero, hablemos de las diferencias entre temas y plugins. Por encima, parece que hay una distinción obvia. ¿Claramente un tema cambia el look de tu sitio mientras que los plugins añaden funcionalidades, cierto? 

La verdad es ligeramente más confusa que eso.

Realmente, un tema también puede cambiar las funcionalidades en el sitio, mientras que un plugin puede alterar la apariencia. Todos los temas de WordPress contienen el archivo functions.php, que incluye código que añade funcionalidad al sitio. Eso funciona muy similar a la forma en que los plugins actúan. Es más, puedes agregar el mismo código al plugin o functions.php y funcionará igual en tu página. 

La diferencia es que cuando agregas código en functions.php, se enlaza a tu tema actual. Esto puede ser muy útil si quieres cambiar algo de la funcionalidad de tu tema o rápidamente agregar funcionalidades sin tener que reescribir el código de todo el plugin. También puedes usar este método si estás creando un tema y quieres incluir funciones personalizadas.  

Sin embargo, si decides cambiar temas, el código que agregues no va a estar activo. Los plugins son entidades independientes que (usualmente) no están ligadas a ningún tema, lo que significa que puedes cambiar de tema sin perder las funcionalidades de los plugins. Usando los plugins en vez del tema, también ayuda a que sea más fácil de mantener la funcionalidad que generes y compartir con otros.

¿Cómo funcionan los plugins?: Introducción a ganchos (hooks), acciones y filtros

Ahora, es hora de ponernos más técnicos. Ya mencionamos que los plugins literalmente (en inglés) se conectan a los archivos base de WordPress. Esto se hace usando ̈ hooks ̈ que ayudan a que un pedazo de código pueda interactuar con otro. Entonces estos ¨ganchos¨ determinan cuándo y en donde el plugin debe ser usado.

Nosotros sabemos que esto puede ser confuso si eres nuevo en el tema. Por eso, vamos a realizar un ejemplo. Imagina que tienes un plugin que cambia el mensaje de error que sale cuando alguien quiere ingresar a tu sitio con la contraseña incorrecta. En este escenario, el mensaje de error es el gancho. El plugin conectaría hacia el   que muestra el mensaje y cambiaría el texto mostrado.

Hay dos tipos de hooks que WordPress comprende, estos son: 

  • Acciones: Estos son usados para agregar o cambiar una funcionalidad de WordPress.
  • Filtros:Son usados para alterar la funcionalidad de acciones.

Como posiblemente adivinaste, hay mucho más con respecto a cómo funcionan los ganchos. Sin embargo, esto te dará una idea grosso modo de cómo se diferencian. Por ahora, esto es lo que debes saber, pero te recomendamos que sigas leyendo acerca de los diferentes hooks o ganchos que el Manual de Desarrollo de Plugins.

¿Qué debes saber antes de crear un plugin? 

Para este momento, posiblemente ya te está picando empezar a hacer tu plugin. Vamos para allá en un momento, pero primero, debes asegurar que estés listo.

Aunque no es un requisito que sigas los pasos a continuación, alguna experiencia programando o codificando serían muy útiles. Esto es especialmente cierto si quieres escribir tu propio plugin contrario a modificar el plugin desarrollado por alguien más. Tener una base sólida ayudará a adherirse más fácil a la codificación estándar de WordPress para el desarrollo de plugins. 

Antes de crear tu plugin, también debes considerar cómo usarás los nombres. Esto se aplica tanto al plugin en sí, como a las funciones que contiene. Deberás evitar las colisiones de nombres, que ocurren cuando varios elementos en un sitio tienen el mismo nombre.

Por ejemplo, si nombras una función en tu plugin add_media_page, chocará con la función de WordPress que ya usa esa cadena. La mejor manera de evitar esto, es elegir un prefijo único, que se aplicará a cada función.

También debes determinar cómo deseas estructurar el plugin. En la práctica, esto significa decidir si usarás un solo archivo para su código o si lo distribuirás entre varios archivos. Además, también querrás planificar cómo estructurarás las carpetas de tu plugin.

Por supuesto, hay mucho más que considerar antes de convertirte en un desarrollador de WordPress. Por ejemplo, la seguridad del plugin es esencial para asegurarse de que tu plugin no contenga ninguna vulnerabilidad. Es posible que también desees proporcionar documentación para tu plugin si planeas compartirlo.

Sabemos que esto es mucho para asimilar, pero no te preocupes. Muchas de estas consideraciones sólo se vuelven aplicables una vez que creas plugins destinados a que otros los usen, y probablemente todavía estés un poco lejos de hacerlo. Entonces devolvamos la cinta un poco y seamos prácticos. Así es, ¡es hora de desarrollar un plugin!

¿Cómo hacer plugins de WordPress?

Ya sea que necesites un tutorial de desarrollo de plugins de WordPress o un curso intensivo de CMS, ¡podemos ayudar! ¡Suscríbete a nuestro bletín mensual para que nunca te pierdas un artículo!

¿Cómo crear tu primer plugin de WordPress? (En 4 pasos)

Ha llegado el momento de crear tu primer plugin, utilizando una cantidad mínima de codificación. Como tal, nos atendemos a algo básico. A lo largo de los siguientes pasos, crearemos un plugin que cambiará el texto del enlace que se muestra cuando insertas una etiqueta para Leer más en una publicación.

Paso 1: Configurar un entorno de prueba

Cuando desarrolles algo, ya sea crear un plugin o realizar otros cambios que puedan afectar tu sitio, siempre debes usar un entorno de prueba. Esto también se conoce como ‘staging site’ o ‘entorno local’, dependiendo de si el sitio está almacenado en un servidor externo o en tu propio computador.

Independientemente de la ubicación, el entorno de prueba debe ser una copia privada de tu sitio. Esto te permite agregar, editar archivos y la funcionalidad de tu sitio, sin el riesgo de causar daños al sitio web real en vivo. Esto es especialmente importante cuando se trabaja con archivos y plugins principales, ya que los errores pueden causar un daño permanente en tu sitio.

Afortunadamente, configurar un sitio de prueba es bastante simple, gracias a la amplia variedad de herramientas disponibles para ayudarte. Para configurar un entorno local, recomendamos una herramienta como DesktopServer. Este programa facilita la instalación de una versión local de WordPress en tu computador.

También puedes crear un sitio staging en línea. Esto funcionará como una copia exacta de tu sitio real, excepto que solo tú y otros administradores pueden acceder a él. Aquí en DreamHost, es fácil crear una copia de su sitio.

Más adelante, incluso puedes copiar los cambios que has realizado en tu sitio provisional e importarlos de nuevo a la versión en vivo.

Cuando tengas listo tu entorno de prueba libre de riesgos, es hora de crear el plugin de verdad.

Paso 2: Crear un nuevo archivo de plugin

Para comenzar a armar un nuevo plugin, necesitarás acceso al directorio de tu sitio. La forma más sencilla de hacerlo es mediante SFTP, que es un método para ver y administrar los archivos de tu sitio cuando se encuentran en un servidor externo. Utilizaremos un cliente llamado FileZilla en nuestro ejemplo, ya que es gratuito y fácil de usar.

Abre FileZilla y usa las credenciales SFTP proporcionadas por tu proveedor de alojamiento web para acceder a su sitio. Una vez que ingreses, deberás navegar a la carpeta que contiene tus plugins, que se encuentra en /wp-content/plugins/.

Para agregar tu nuevo plugin, deberás crear una nueva carpeta dentro de este directorio. Hazlo ahora y dale el nombre único que quieras. Llamaremos el nuestro very-first-plugin.

Esta carpeta es donde todo lo relacionado con tu plugin “vivirá” en tu sitio. Dado que este plugin será muy simple, solo necesita contener un solo archivo que crearás ahora. Este será un archivo PHP, que contendrá el código del plugin.

Como tal, abre el nuevo directorio del primer plugin y haz clic derecho dentro de él y selecciona Crear nuevo archivo.

Se te pedirá que nombres el archivo. Esto debería ser idéntico a la carpeta, así que llámalo very-first-plugin.php (asegúrate de usar la extensión de archivo correcta). Este archivo ahora se agregará a la carpeta.

En este punto, deberás agregar información básica al archivo. WordPress utilizará esa información para mostrar el nombre, el contenido y otra información del plugin. Para hacer esto, haz clic derecho en el archivo PHP y selecciona Ver/Editar. Luego se te pedirá que abras el archivo, lo que puedes hacer en cualquier editor de texto, como TextEdit o Notepad.

El archivo está vacío ahora, así que pega el siguiente texto en él:

<?php
/**
* Plugin Name: Very First Plugin
* Plugin URI: https://www.yourwebsiteurl.com/
* Description: This is the very first plugin I ever created.
* Version: 1.0
* Author: Your Name Here
* Author URI: http://yourwebsiteurl.com/
**/

Naturalmente, siéntete libre de cambiar la información aquí para que coincida con tus detalles reales, antes de guardar el archivo. Cuando se te pregunte si deseas volver a cargar el archivo en el servidor de tu sitio, haz clic en .

Cuando termines, podrás ver el plugin en el panel de administración de tu sitio. Inicia sesión ahora y echa un vistazo a tu biblioteca de plugins.

Incluso puedes continuar y activar tu plugin ahora en el panel de administración. Por supuesto, el plugin aún no hace nada. Eso se debe a que no le hemos agregado ninguna funcionalidad.

Paso 3: Agrega código a tu plugin

Como mencionamos anteriormente, este plugin va a cambiar el texto que aparece cuando insertas una etiqueta Leer más. Para ver cómo se ve esto normalmente, crea una nueva publicación de blog y haz clic en el icono Insertar etiqueta Leer más.

Si publicas el post y lo revisas en tu sitio, verás que la etiqueta ha sido reemplazada por un enlace que dice “Continuar leyendo”:

Este es el texto que queremos cambiar. Para hacer eso, abre tu archivo first-plugin.php nuevamente. Luego, agrega una nueva línea al final del archivo y pega el siguiente código:

function dh_modify_read_more_link() {

    return '<a class="more-link" href="' . get_permalink() . '">¡Haz clic aquí para leer!</a>';

}

add_filter( 'the_content_more_link', 'dh_modify_read_more_link' );

Analicemos rápidamente lo que contiene este código. Primero, eso crea una nueva función, que llamamos ‘dh_modify_read_more_link’. Notarás que agregamos el prefijo ‘dh’ para asegurarnos de que el nombre sea único.

Lo que hace esta función, es obtener el enlace de la publicación actual y luego aplicar el texto de anclaje ‘¡Haga clic para leer!’. Este es el texto que reemplazará ‘Continuar leyendo’. Por supuesto, puedes cambiar este texto a cualquier cosa que quieras usar.

La línea final de este código usa un filtro para engancharse en una función llamada ‘the_content_more_link’, que representa el enlace ‘Leer más’. El filtro le indica a WordPress que llame a nuestra nueva función, por lo que el enlace estándar se reemplazará con nuestra nueva versión.

En este punto, puedes guardar el archivo de plugin. Como ya activaste el plugin, su funcionalidad debería andar de inmediato. Prueba esto revisando tu sitio web para ver si el texto del enlace ha cambiado.

Si funcionó, ¡felicidades! De lo contrario, deberás verificar tu código para asegurarte de haber ingresado todo correctamente. Además, verifica si el plugin está activo y si todos los nombres de las funciones son correctos.

Una vez que el plugin funcione, estarás listo para avanzar al paso final.

Paso 4: Exporta e instala tu plugin en un sitio en vivo

Tu nuevo plugin ahora está listo para ser utilizado en un sitio en vivo. Afortunadamente, este paso suele ser el más simple. Todo lo que necesitas hacer es comprimir la carpeta del primer plugin en un archivo ZIP. Si utilizaste un entorno local para crear tu plugin, solo necesitas hacer clic derecho en la carpeta y seleccionar ‘Comprimir’.

Si has estado usando SFTP, por otro lado, puedes hacer lo mismo haciendo primero clic derecho en la carpeta y seleccionando ‘Descargar’.

Una vez que la carpeta se haya descargado en tu computador, puedes comprimirla tal como mencionamos anteriormente.

Este archivo zip se puede cargar en tu sitio. Abre tu panel de administración de WordPress, navega a Plugins y luego haz clic en ‘Agregar nuevo’.

En la siguiente pantalla, puedes seleccionar ‘Cargar plugin’, que te permitirá elegir un archivo de plugin de tu computador.

Selecciona el archivo ‘very-first-plugin.zip’ que creaste y haz clic en ‘Instalar ahora’. El plugin ahora se agregará a tu sitio, y puedes activarlo como de costumbre.

¡Eso es! Has creado con éxito tu primer plugin y lo has subido a un sitio de WordPress. Si esta experiencia te ha hecho querer progresar aún más con el desarrollo de plugins, ¡genial! Existen muchos recursos excelentes para ayudar a expandir tu repertorio, pero el mejor lugar para comenzar es el Manual para desarrolladores de Plugins. Quién sabe, ¡quizás quieras alojar tus propios plugins en el Directorio de plugins de WordPress algún día!

Hora de incursionar en el mundo de los plugins

WordPress no solo es una plataforma fenomenalmente fácil de usar, sino que también ofrece una gran flexibilidad. Debido a su naturaleza de código abierto, cualquiera puede agregar nuevas funcionalidades a la plataforma. La mejor manera de comenzar es creando sus propios plugins.

¿Listo para pasar al siguiente nivel con el desarrollo de WordPress? Opta por DreamPress, nuestra solución de alojamiento administrado por WordPress. Con actualizaciones automáticas y fuertes características de seguridad. DreamPress te quita el peso de administrar el servidor para que puedas concentrarte en lo que mejor haces. Obtén más información sobre las opciones de planes disponibles hoy.

Sobre el Autor:

Ellice nos llega de la Casa DreamHost, la primera de su nombre, Guardiana del contenido de todas las cosas, protectora de la marca y gobernante de los reinos sociales. tl;dr — Ellice es la Gerente de Marketing de Contenido en DreamHost y supervisa todos los esfuerzos de contenido y redes sociales.