Historial de un navegante

by Angel

Tutorial para crear tu propio plugin de WordPress

leave a comment »

Leído en elwebmaster,

El Codex de WordPress explica el funcionamiento de los plugins desde una perspectiva de referencia, pero la mejor manera de aprender a desarrollarlos es ver ejemplos de código real.

Este tutorial es una introducción al desarrollo de un plugin básico que utiliza PHP para guardar y recuperar datos de la base de datos de WordPress para mostrarlos en el sitio.

Crea un archivo PHP

Primero, crea un archivo PHP en una carpeta con un nombre único, esta carpeta residirá en la misma carpeta que los otros plugins, por lo que no puede tener un nombre que se repita.

Este será el archivo dónde se guardará todo nuestro scripting para el plugin.

Funciones para usuarios y administradores

En el archivo PHP, comencemos creando dos funciones:

PLAIN TEXT

  1. function miwidget_public($args = false) {
  2. }
  3. function miwidget_admin() {
  4. }

Nuestro widget, a modo de ejemplo, se llama "Mi Widget", que se referenciará como "miwidget_" en el código.

Estas dos funciones son el esqueleto para el código PHP que se ejecutará cuando el usuario visita la parte pública de tu sitio WordPress – en cualquier página que pongas el widget (vamos a llegar a eso en breve), así como la parte de administración cuando un usuario admin arrastra el widget a un panel lateral (bajo la sección Apariencia » Widgets):

Siéntete libre de incluir cualquier código PHP en ambas funciones – lo que sea que desees ejecutar.

En la función de administrador, básicamente estarás programando la creación de un formulario HTML para que los usuarios puedan controlar los ajustes relacionados con el widget:

En la imagen de arriba, se les pide a los usuarios información pertinente para hacer una llamada API (puedes poner cualquier cosa aquí- esto es sólo un ejemplo).

Por lo que, para los principiantes, la función administradora podría lucir así:

PLAIN TEXT

  1. function miwidget_admin() {
  2. $options_site = get_option("widget_miwidget_site");
  3. ?>
  4. <p>
  5. Your Software URL:
  6. <input type="text" name="p_link" id="p_link" value="<?php echo $options_site["p_link"]; ?>" style="width:99%;" />
  7. </p>
  8. <p>
  9. Your Software Username:
  10. <input type="text" name="username" id="username" value="<?php echo $options_site["username"]; ?>" style="width:99%;" />
  11. </p>
  12. <p>
  13. Your Software Password:
  14. <input type="password" name="password" id="password" value="<?php echo $options_site["password"]; ?>" style="width:99%;" />
  15. </p>
  16. <?php
  17. }

Nota, de forma específica, los atributos value para cada elemento <input>.

Referenciamos la variable $options_site, que se declara antes de que el HTML tenga salida. $options_site llama a una función WordPress, get_option(), que devuelve valores desde la base de datos.

Si te estás preguntando cómo los valores llegan a la base de datos en primer lugar, lo hacen llamando a otra función de WordPress: update_option().

Hechémosle un vistazo a la sintaxis que guarda los valores de la base de datos:

PLAIN TEXT

  1. update_option("widget_miwidget_site", $options_site);

La función update_option() acepta dos parámetros. El primero es el nombre único que utilizarás para referenciar estos valores de base de datos en tus scripts. El segundo es la variable que estás guardando en la base de datos. Puedes pasar un array aquí también, lo que es útil para colecciones de valores relacionados.

Tus valores se guardan en la tabla de base de datos wp_options. Los valores enviados como arrays serán serializados.

Puedes crear tantas opciones distintas como desees, y todas se pueden guardar en la base de datos.

Continuando con la función administradora, cuando alguien complete los detalles y haga clic en "Guardar", deberías llamar a la función update_option y pasar los valores a esta.

Así que, para modificar un poco la función admin:

PLAIN TEXT

  1. function miwidget_admin() {
  2. $options_site = get_option("widget_miwidget_site");
  3. if ($_SERVER["REQUEST_METHOD"] == "POST") {
  4. $options_site = array(
  5. "p_link" => $_POST["p_link"],
  6. "username" => $_POST["username"],
  7. "password" => $_POST["password"],
  8. );
  9. update_option("widget_miwidget_site", $options_site);
  10. }
  11. else {
  12. ?>
  13. <p>
  14. Your Software URL:
  15. <input type="text" name="p_link" id="p_link" value="<?php echo $options_site["p_link"]; ?>" style="width:99%;" />
  16. </p>
  17. <p>
  18. Your Software Username:
  19. <input type="text" name="username" id="username" value="<?php echo $options_site["username"]; ?>" style="width:99%;" />
  20. </p>
  21. <p>
  22. Your Software Password:
  23. <input type="password" name="password" id="password" value="<?php echo $options_site["password"]; ?>" style="width:99%;" />
  24. </p>
  25. <?php
  26. }
  27. }

Aquí nos fijamos si el botón "Guardar" fue presionado (if ($_SERVER["REQUEST_METHOD"] == "POST")), y de ser así, creamos un array para los valores del formulario y actualizamos la base de datos.

En tu función public, puedes devolver los valores de la base de datos para que se muestren en el sitio:

PLAIN TEXT

  1. function miwidget_public($args = false) {
  2. $options_site = get_option("widget_miwidget_site");
  3. echo $options_site["html"];
  4. }

Es así de simple.

Dado que hay un array "html" en $options_site, esto mostrará el contenido "html" en la sidebar en la parte pública de tu sitio WordPress.

Llama al código necesario para registrar el plugin en WordPress

Hay algunas cosas más que necesitamos hacer antes de que el widget sea reconocido y funcione en el sistema de WordPress.

Al final de tu archivo PHP, incluye el siguiente código:

PLAIN TEXT

  1. function widget_miwidget_init() {
  2. register_sidebar_widget("Mi Widget", "widget_miwidget_public");
  3. register_widget_control("Mi Widget", ‘widget_miwidget_admin’);
  4. }
  5. add_action("plugins_loaded", "widget_miwidget_init");

Esto cargará el plugin en la página de administración, para que los usuarios puedan activarlo.

¡Y eso son los pasos básicos!

Lean la documentación oficial de WordPress sobre plugins para más detalles.

Enlace | Pain in the Tech | elwebmaster

Anuncios

Written by Angel Flores

7 febrero 2010 a 12:25

Publicado en General

Responder

Introduce tus datos o haz clic en un icono para iniciar sesión:

Logo de WordPress.com

Estás comentando usando tu cuenta de WordPress.com. Cerrar sesión / Cambiar )

Imagen de Twitter

Estás comentando usando tu cuenta de Twitter. Cerrar sesión / Cambiar )

Foto de Facebook

Estás comentando usando tu cuenta de Facebook. Cerrar sesión / Cambiar )

Google+ photo

Estás comentando usando tu cuenta de Google+. Cerrar sesión / Cambiar )

Conectando a %s