Timber by EMSIEN-3 LTD
Tags Posts tagged with "pluginscomplementos"

pluginscomplementos

0 360

Seguimos con nuestro tutorial para la creación de complementos en WordPress. En la anterior entrada te expliqué cual es el esqueleto básico de un complemento y viste cómo crear tu primer complemento. Para refrescarte un poco la memoria, esto es lo más importante que debes tener en mente:

  • Los complementos se meten en el directorio wp-content/plugins. Cada complemento que crees va a estar adecuadamente organizado en su propio directorio: wp-content/plugins/mi-complemento-de-ejemplo.
  • Todo complemento debe tener como mínimo un archivo (mi-complemento-de-ejemplo/mi-complemento-de-ejemplo.php) con una cabecera estándar que señalará el nombre del complemento, el creador, la versión, etc. Esta información es la que luego aparece en el Escritorio de WordPress » Plugins.
  • WordPress ofrece diferentes API para implementar nuevas funcionalidades por medio de nuestro plugin. Una API no es más que un conjunto de funciones con una meta concreto. De esta manera, tenemos una API para widgets, otra para opciones, otra para plugins…

En la entrada de hoy vamos a ver una forma de vertebrar y organizar el código para facilitar su mantenimiento y entendimiento, y te explicaré 5 trucos para escribir mejor código.

Nuestro código de ejemplo

¿Recuerdas el ejemplo que creamos hace un par de semanas? Nuestro primer plugin extendía la información de una entrada cualquiera por medio de lo que llamamos una Extensión del título”, un pequeño campo de texto que, en caso de tener algún valor, debería añadirse al título de la entrada. Asimismo vimos de qué manera agregar al editor de entradas una meta box que nos permitiera modificar la Extensión del título” de esa entrada.

Si proseguiste los pasos que te di, deberías tener algo parecido a esto:

Problemas

El código anterior, si bien funcional, deja bastante que desear:

  1. Estamos mezclando un montón de conceptos en un mismo fichero. Por servirnos de un ejemplo, lo mismo tenemos código para mudar el título de una entrada en el front-end, como código que agrega elementos gráficos a la página de edición de entradas, como una función que controla qué se guarda en la base de datos.
  2. No solo estamos haciendo un estruendo de funcionalidades, también estamos mezclando los datos y la lógica de nuestro plugin (agregar una meta box o bien acceder a la base de datos) con la interfaz de usuario (el código HTML que pinta la meta box).
  3. Las diferentes funcionalidades están siempre y en todo momento activas, si bien no se precisen. El fichero incluye funciones que solo tienen sentido cuando estamos en el Escritorio de WordPress y otras que solo tienen sentido si estamos viendo el front-end. No obstante, cada vez que se carga el complemento, se interpreta y ejecuta todo el contenido del fichero, de tal forma que se establecen hooks que pueden no ser precisos en un momento determinado.

Cuando el código que manejamos es pequeño (como el del ejemplo), estos problemillas no pasan de ser eso, problemillas”. En verdad, sencillamente con agregar algún comentario con gracia en nuestro fichero logramos un código fácil de comprender y continuar, y el coste de 4 funciones no es elevado.

Pero ahora imagina un complemento que va creciendo, en el que añadimos archivos JavaScript, hojas de estilo, más funcionalidades, páginas de configuración… No hay duda de que en un caso así precisamos orden, necesitamos una forma de organizar nuestro código tal que cada cosa tenga su lugar y un motivo para estar allí y no en otro lado.

Organizando mejor el código

Hace ya unos meses encontré un proyecto en GitHub llamado The Plugin Boilerplate. Este proyecto fue creado originalmente por Tom McFarlin (un desarrollador WordPress cuya forma de trabajar me gusta especialmente; si no le conocías y se te da bien el inglés, te recomiendo que le prosigas) y que actualmente está mantenido por Devin Vinson y otros desarrolladores. Tal y como puedes leer en la propia página de GitHub:

WordPress Plugin Boilerplate es una base estandarizada, bien organizada y orientada a objetos pensada para la creación de complementos.

Este esqueleto” cumple con las guías de estilo de WordPress, está muy bien documentado y propone una estructura de organización de archivos rígida y funcional. Así que si quieres aprender a crear buenos plugins, partir de esta base es un fabuloso ejercicio de aprendizaje y mejora.

Como puedes imaginarte, el Complemento Boilerplate es excelente para crear plugins de gran extensión partiendo de una base sólida y bien pensada. Sin embargo, puede resultar complicado de entender para un desarrollador WPrincipiante, conque hoy solo nos vamos a fijar en la organización de archivos que plantea y vamos a ver cómo aplicarla a nuestro ejemplo. ¡Mas deja de preocuparte! Prometo que pronto hablaremos de él con más detalle :-)

Nueva Estructura de Directorios

Volvamos a nuestro plugin. Recuerda que partimos de la siguiente situación: dentro del directorio wp-content/plugins/wprincipiante-ejemplo/ tenemos un único archivo wprincipiante-ejemplo.php, el que contiene todo el código de nuestro complemento. Como acabamos de ver, esto produce una serie de inconvenientes que podemos resumir en estamos mezclando demasiadas cosas”. ¿De qué forma lo resolvemos? ¡Muy fácil! Vamos a separarlas para que cada cosa esté en su lugar. Para esto, vamos a crear la próxima estructura de directorios:

  • wprincipiante-ejemplo/admin/. Todo el código que esté alterando el Escritorio de WordPress (es decir, la zona de administración” de nuestro WordPress) va a ir en este subdirectorio.
  • wprincipiante-ejemplo/public/. Semejante al caso precedente, cualquier código que manipule el front-end de WordPress va a deber situarse en public.
  • wprincipiante-ejemplo/includes/. Todo lo que no pueda ponerse en alguno de los 2 directorios precedentes deberá ir acá. Por poner un ejemplo, un componente que se utiliza tanto en el front-end como en el Escritorio de WordPress deberá ser parte de includes.

Como ya te puedes imaginar, cada uno de ellos de esto tres directorios puede contener, a su vez, múltiples directorios que ayuden a organizar aún mejor el código. Si echamos una ojeada al Complemento Boilerplate, vamos a ver 3 directorios que me parecen muy interesantes para adminpublic:

  • admin/css/public/css/. Contiene las hojas de estilo que se utilizan en el Escritorio o en el front-end.
  • admin/js/ y public/js/. Equivalente a los directorios precedentes, mas para ficheros JavaScript.
  • admin/partials/public/partials/. Sirve para guardar el código que es parte integrante de la interfaz de usuario (plantillas y demás).

Distribuir el código en la nueva estructura

¿Has creado ya la nueva jerarquía de directorios? Si es de esta forma, lo único que tienes que hacer es romper el código en componentes más pequeños y meterlos en el directorio conveniente. Veremos, paso a paso, de qué forma hacerlo.

Empezaremos con la vista del meta box. Ya hemos dicho que cualquier cosa que forme parte de la interfaz de usuario va a ir en un directorio partials y, como en este caso se trata de un componente que forma parte del Escritorio de WordPress, va a deber ir en admin/partials/. Este es el fichero que debes meter allí:

Fíjate que la plantilla que terminamos de crear utiliza una variable llamada $ val que no está iniciada. Aunque pueda parecer un fallo, no se trata de ningún inconveniente, en tanto que nos encargaremos de darle un valor cuando vayamos a emplear la plantilla. De todas y cada una maneras, para facilitarnos el trabajo futuro, agregamos un comentario al comienzo del fichero que nos recuerda que esta plantilla precisa esa variable, el tipo que debe tener y qué valor” se supone que contiene.

Una vez hemos creado la plantilla para enseñar la meta box, ahora necesitamos tener en algún lado el código que administra la meta box en sí. Aunque hay varias formas de hacerlo (las veremos en futuras entradas), hoy optaremos por una solución sencilla y conceptualmente adecuada. Concretamente, crearemos un fichero con una única función: administrar la meta box. ¿Qué quiere decir eso? Puesto que, esencialmente, que este fichero se ocupará de registrar la meta box en WordPress (para que pueda mostrarse en el editor de entradas) y de guardar los valores que introduzca el usuario:

Con esta decisión, conseguimos un archivo que cumple un único acometido y que tiene perfecto sentido de forma aislada. Además, como hemos separado el código HTML de la meta box de su administración, ahora tenemos un código mucho más comprensible (¡imagina que follón si la plantilla HTML hubiera sido un tanto más grande!).

A continuación, debemos añadir el código que se hace cargo de alterar el título que nuestros usuarios ven en el front-end. Como ya puedes imaginar, este fragmento de código va a ir en public:

¡Perfecto! Ya tenemos todo el código perfectamente distribuido. Si ahora echas una ojeada al fichero primordial de nuestro complemento (wprincipiante-ejemplo.php) vas a ver que está vacío. Lógico, ¿no? Sólo hay un problema: si intentas usar el plugin en este estado verás que nada marcha. Esto es debido a que WordPress sólo lee el fichero primordial y también ignora el resto. Te corresponde a ti, pues, incluir los demás ficheros conforme se necesiten:

Los 5 trucos para escribir buen código

Como puedes ver, crear plugins es un trabajo muy entretenido, especialmente si quieres hacerlo bien”. Para completar la lección de el día de hoy me agradaría compartir contigo cinco consejos que esperemos alguien me hubiese dado cuando comencé Si logras hacerlos tuyos y aplicarlos en tu día a día, tendrás una base considerablemente más sólida y el resultado de tus proyectos va a ser infinitamente mejor de lo que imaginas.

Truco #1. Prosigue las guías de estilo de WordPress

¿Qué prefieres? ¿Esto?

¿O esto?

Detalles tan sencillos como un espaciado e indentación correctos o usar nombres de variables y funciones que sean auto-explicativos puede tener un enorme impacto en la calidad final de tu trabajo. Si vas a dedicarte a programar para WordPress, te invito a que eches un vistazo a los estándares de programación que tienen para PHP, HTML, JavaScript y CSS. Familiarizarse con ellos te asistirá a escribir mejor código y, por si fuera poco, conseguirás que se integre mucho mejor con el estilo de WordPress, facilitando el trabajo a otros desarrolladores WordPress que, seguramente, también estén siguiendo las mismas guías.

Relacionado con esto, te recomiendo que escribas tu código en inglés. Creo que la mayor parte de programadores de alrededor del mundo son más o menos diestros con el idioma de Shakespeare, por lo que redactar y compartir tu trabajo en inglés hace que este pueda llegar a más gente. De hecho, es bastante probable que tarde o temprano trabajes con gente de otros países, conque merece la pena tener cierta soltura escribiendo tu código y tus comentarios en ese idioma.

Truco #2. Sé ordenado con el código fuente

La entrada de hoy trataba precisamente de esto y el Complemento Boilerplate que he presentado es un buen ejemplo de ello. Simplemente recuerda las próximas reglas y todo va a ser más fácil:

  1. Utiliza la estructura de directorios que hemos visto: las funcionalidades del front-end van al directorio public/, todas y cada una de las de administración (esto es, Escritorio de WordPress) a admin/ y todo lo demás en includes/.
  2. Utiliza subdirectorios para clasificar mejor tu código. Hoy hemos visto, por servirnos de un ejemplo, los de vistas (views/ y views/partials/), mas también puedes crear directorios para los archivos JavaScript (js/) o CSS (css/). Todo esto, obviamente, respetando la estructura del punto 1.
  3. Aunque en nuestros ejemplos no lo hemos visto, es posible programar los complementos usando clases. Siempre que crees una clase PHP, hazlo en su propio fichero (el que, a propósito, no debe tener nada más).
  4. Cada fichero/clase debería representar una única funcionalidad (por poner un ejemplo, en nuestro ejemplo hemos creado uno para la administración de la meta box).
  5. Jamás mezcles la capa de presentación (el código HTML) con la lógica de tu plugin (esto es, el código PHP que recobra, procesa y guarda datos).
  6. Carga las cosas cuando sea preciso. Por poner un ejemplo, si estás en el front-end, no cargues cosas del Escritorio (utiliza la función is_admin()).

Truco #3. Tómate la seguridad en serio

Un consejo que todo el planeta conoce y que, desgraciadamente, casi siempre y en toda circunstancia olvidamos. Es normal, cuando te pones a trabajar en un proyecto nuevo deseas que las cosas funcionen lo ya antes posible… para luego ya, si eso, preocuparte de la seguridad y la eficacia.

¡Fallo! Tienes que tomarte la seguridad de verdad. Si sigues estas reglas, podrás garantizar un mínimo de seguridad y solidez en tu plugin:

  1. Siempre que vayas a pintar algo por pantalla, cerciórate de que está adecuadamente escapado. Para esto, familiarízate con funciones como esc_url, esc_attr or esc_html.
  2. Siempre limpia” (sanitize, en inglés) las entradas del usuario. Si estás esperando que el usuario te introduzca un número, asegúrate de transformar su entrada en un número; si esperas un texto sin código HTML, suprime las posibles etiquetas con strip_tags.
  3. Utiliza nonces para contrastar formularios y URLs. Siempre y cuando recojas información de un formulario, debes revisar que esa información realmente viene del formulario y que no es algo que ha generado un agente externo malicioso. Esto se consigue mediante los nonces, un número de seguridad que sólo puede emplearse una vez. Te invito a que leas más sobre ellos en el Codex.

Truco #4. Comenta el código

Los proyectos funcionan merced al código, no a los comentarios, ¿no? Por este motivo, puede parecer que es mucho mejor centrarse en escribir código que sea comprensible y pasar de perder el tiempo en comentarios que, en resumen, no sirven de nada”. ¿Para qué exactamente redactar código? Si partimos de la base que nuestro código es limpio y comprensible, ¿qué aportan?

En mi opinión, los comentarios atrapan las pretensiones del desarrollador (es decir, nuestras intenciones). Cuando escribes un fragmento de código se supone que estás procurando resolver un inconveniente. Describir cuál es ese inconveniente y cómo piensas resolverlo es la función de los códigos. Los comentarios no tienen por qué decir qué hace el código; tienen que explicar qué intentabas solucionar y cómo pensabas que podías solventarlo. Con esta idea en la cabeza verás que, de súbito, tu código (y el del resto) es mucho más simple de entender, porque podrás recuperarlo en cualquier momento y entender por qué las cosas son como son… recobrarás el contexto. Y eso siempre mola, ¿no?

Cuando escribas comentarios, pues, procura expresar tus pretensiones y objetivos. No te quedes en lo superficial:

e intenta ir un tanto más allá:

Truco #5. Haz que tu plugin defina sus filtros y acciones

Una de las cosas que hemos aprendido durante estas 2 entradas es de qué forma usar los filtros y acciones de WordPress. Pero ¿sabías que puedes crear tus filtros y acciones? O sea, que puedes preparar el código de tu plugin (o bien tema) para que otras personas lo extiendan.

Para ello, lo único que tienes que hacer es definir exactamente en qué instante un complemento puede ser extendido (por poner un ejemplo, cuando se activa, o cuando vas a modificar algo del front-end) y incorporar allí el código de extensión con las funciones do_action o bien apply_filters de WordPress. Usando este mecanismo, serás capaz de añadir tú mismo nuevas funcionalidades en tu plugin, enganchándote a esos puntos de extensión desde el propio complemento o creando plugins completamente nuevos que extienden y complementan al original.

Conclusión

Hoy hemos dado una pequeña vuelta de tuerca al ejemplo que hicimos en la primera parte de este tutorial. En concreto, hemos visto la importancia que tiene la estructura del código y de qué forma puede ayudarnos a mantener el código limpio, ordenado y comprensible. Además, hemos visto cinco trucos que debemos aplicar a la hora de escribir código. Te invito a que los interiorices y apliques a tus creaciones; tu yo del futuro te lo agradecerá

¡Espero que hayas disfrutado! En la próxima entrada te presentaré con más detalle el Complemento Boilerplate y otro esqueleto en el que estoy trabajando.

Imagen destacada de James j8246.

0 407

Hará más o menos dos años que 3 compañeros (y amigos) míos decidimos probar suerte y tirar adelante una idea de negocio chulísima. Por cierto motivo, decidimos que la montaríamos encima de WordPress, aunque por aquel entonces no teníamos clarísimo de qué manera funcionaba WordPress y de qué manera podíamos extenderlo… Todavía de esta manera, fuimos bastante audaces y nos tiramos a la piscina Como puedes imaginar, los primeros meses fueron moviditos”; tuvimos que adquirir un montón de conocimientos en escaso tiempo para poder iniciar cuanto antes con el desarrollo. ¿Qué hicimos? Lo mismo que tú ahora: buscar y leer recursos y tutoriales en internet y escribir mucho, muchísimo código de prueba

Después de dos años trabajando únicamente en el ecosistema de WordPress y de haber desarrollado múltiples plugins, he pensado que sería una buena idea compartir mi experiencia contigo y enseñarte cómo crear complementos en WordPress. Durante esta y próximas entradas, te explicaré todo lo que necesitas saber para redactar buenos plugins, es decir, plugins que sean funcionales, extensibles y mantenibles. En cierto modo, pues, intentaré crear el tutorial que me hubiese agradado tener cuando comencé. Como verás, habrá poca teoría y mucha práctica… de tal modo que los conocimientos que vas a deber adquirir irán apareciendo a medida que los precisemos. ¡Espero que te guste!

En la entrada de hoy vas a aprender cómo:

  1. crear el esqueleto básico de un plugin,
  2. cambiar el título de todas las entradas haciendo que muestren un texto fijo y
  3. hacer el cambio del paso 2 de forma selectiva (según lo que tú, como autor de una entrada, decidas).

Crear tu primer plugin

Crear un plugin para WordPress es extremadamente sencillo. Lo único que tienes que hacer es crear una nueva carpetita en el directorio wp-content/plugins/ y incorporar un archivo con el código fuente. Por servirnos de un ejemplo, crearemos un plugin que se llame wprincipiante-ejemplo. Para ello, crea la carpetita wp-content/plugins/wprincipiante-ejemplo/ y añade un nuevo archivo dentro llamado wprincipiante-ejemplo.php con el próximo contenido:

Si ahora vamos al Escritorio de WordPress » Plugins, veremos que nuestro nuevo plugin Ejemplo de WPrincipiante aparece adecuadamente listado, con su versión, su autor, su descripción, enlaces a nuestra web… Vamos, que WordPress está utilizando toda la información que hemos añadido en el comentario inicial de wprincipiante-ejemplo.php.

Cómo añadir alguna funcionalidad al plugin

¡Felicidades! Acabas de crear tu primer plugin, aunque por desgracia no hace completamente nada útil. WordPress ofrece diferentes APIs para incorporar nuevas funcionalidades. Algunos ejemplos de estas APIs son:

  • Plugins API. Es la API más básica que debemos dominar para poder extender WordPress con nuestros plugins.
  • Settings API. Ofrece un conjunto de operaciones para crear páginas de configuración de nuestro complemento.
  • Options API. Deja guardar (y recuperar) las opciones de configuración de nuestro plugin.
  • Widgets API. Deja crear nuevos widgets que van a poder añadirse a una instalación de WordPress y ser visibles desde el front-end.
  • y muchas, muchas más otras…

Hace un par de días, mi compañero Antonio te explicaba con mucho detalle la API de Plugins. Esencialmente, acá hallamos el concepto de hook. Como nos contaba Toni, los hooks son mecanismos que ofrece WordPress para permitir enganchar” las acciones de tu plugin a diferentes partes de WordPress.

Tu primer hook

Vamos a incorporar un poco de funcionalidad al complemento. Añade el próximo fragmento de código al final del fichero wprincipiante.php (no vuelvas a incluir la etiqueta <>; únicamente la agrego para que el código tenga destacado de sintaxis):

Si has activado el complemento y vas a tu blog, vas a ver que todos los títulos de todas tus páginas y entradas incluyen el texto [Exclusiva]. De esta manera, por ejemplo, la entrada ¡Hola planeta! ahora es [Exclusiva] ¡Hola planeta!.

Vamos a examinar paso a paso lo que acabamos de escribir:

  • Función add_filter. Es, como te afirmaba, el primer hook que usaremos. Acá, lo que básicamente le estamos diciendo a WordPress es que cuando se produzca el acontecimiento the_title (o sea, cuando WordPress esté a punto de redactar el título de una entrada o página), ejecute la función wprincipiante_cambiar_titulo.
  • Creamos una nueva función. Con la instrucción anterior le hemos dicho a WordPress que cuando se produzca el evento the_title tendrá que llamar a una cierta función. Esta función, sin embargo, no existe por defecto, conque habrá que crearla. Por si fuera poco, le hemos dicho (pues así está documentado) que la función deberá admitir 2 parámetros ( dólares americanos title y también $ id). Vamos, pues, a crear esta función.
  • El cuerpo de la función. Finalmente, solo nos queda ver y comprender el cuerpo de la función wprincipiante_cambiar_titulo, el cual no tiene ningún misterio: simplemente le agrega al título la cadena [Exclusiva].

Tipos de hooks: filtros y acciones

Recordemos que existen 2 géneros de hooks:

Extender la información de las entradas

De instante, todo lo que te he explicado ya estaba más o menos cubierto en la anterior entrada de WPrincipiante. Con esto ya tienes las nociones básicas para hacer prácticamente cualquier cosa en WordPress. Vamos a ver cómo ir un paso más allá y descubramos de qué manera emplear ciertos recursos más de los que nos ofrece WordPress para hacer un complemento más potente. Específicamente, vamos a:

  1. Modificar el editor de entradas. Añadiremos una nueva caja de edición en las entradas de WordPress donde vamos a poder precisar un texto cualquiera. Este texto va a ser concreto de cada entrada (como lo son el título o bien el contenido) y será una Extensión del título”.
  2. Guardar el nuevo campo. Modificaremos la información que WordPress almacena de una entrada y le añadiremos un campo adicional que nos dejará guardar y recuperar esa extensión del título”.
  3. Modificar el título con ese campo. Haremos que los títulos de cada entrada incluyan la extensión guardada en dos.

Por ejemplo, pongamos que tenemos 2 entradas en WordPress:

  • ¡Hola Planeta!
  • Bienvenidos a mi blog

Nuestro objetivo es que el creador de una entrada pueda añadir el texto que desee al título (por servirnos de un ejemplo, WordPress mola” en la primera entrada) a fin de que, en el momento en que un visitante acceda al weblog, vea lo siguiente:

  • ¡Hola mundo! WordPress mola
  • Bienvenidos a mi blog

¿Comenzamos?

Añadir la caja de edición (meta box) en el editor de entradas

Por defecto, esta es la apariencia que tiene el editor de entradas de WordPress:

Captura de pantalla del editor de entradas por defecto de WordPress.
Captura de pantalla del editor de entradas por defecto de WordPress.

Lo mínimo que cualquier entrada nos demanda es un título y un contenido, y eso son las 2 primeros campos de texto grandes que vemos. En torno a esos 2 elementos tenemos un montón de cajitas: Publicar, Imagen Destacada, Etiquetas, Extracto, Categorías Estas cajas se llaman meta boxes y nos permiten agregar información auxiliar a nuestra entrada (por poner un ejemplo, una imagen destacada, una lista de etiquetas o las categorías a las que pertenece).

Veamos de qué manera puedes crear tu propia meta box. Para ello, va a bastar con realizar una búsqueda rápida en el Codex de WordPress para hallar una función llamada add_meta_box, la cual tiene todos los números de ser la que necesitamos:

Vamos a invocar esta operación para crear nuestra nueva meta box. Para ello, sencillamente hay que añadir el próximo código:

Permíteme que te explique qué acabamos de hacer :-)

Para comenzar, fíjate que estamos llamando a la función add_meta_box desde una función (wprincipiante_add_meta_boxes) vinculada a una acción (add_meta_boxes). ¿Por qué todo este follón? Bueno, básicamente pues la documentación nos dice que la función add_meta_box debe llamarse desde la acción add_meta_boxes, conque (a) detallamos un nuevo hook y (b) creamos la función socia (wprincipiante_add_meta_boxes).

La documentación también nos afirma que para crear una meta box hay que invocar la función add_meta_box con tres parámetros: dólares americanos id, dólares americanos title y dólares americanos callback. Si miras la documentación vas a saber qué es cada factor. El interesante ahora es el tercero, el cual indica el nombre de la función que dibuja el contenido de la cajita. En nuestro ejemplo, la función es wprincipiante_print_extension_titulo_meta_box, y como la hemos dejado vacía, la meta box aparece asimismo vacía. Ve a la página de edición de entradas y lo verás:

Nueva meta box
Nueva meta box Extensión del Título” vacía.

Si deseas incorporarle contenido, simplemente define el cuerpo de la función wprincipiante_print_extension_titulo_meta_box y escribe:

para lograr esto:

Nueva meta box
Nueva meta box Extensión del Título” con un campo de texto que el usuario puede rellenar.

Guardar el nuevo valor

Usando la meta box que acabamos de crear podemos especificar qué texto va a haber que agregar en el título de una entrada cualquiera. Sin embargo, ya antes vamos a deber guardar este campo en la base de datos y hacerlo permanente.

WordPress nos permite añadir cualquier género de información adicional a una entrada dada por medio de lo que se conoce como campos personalizados. Lo que debemos hacer, puesto que, es emplear las funciones que nos permiten manipular estos campos personalizados en el instante en el que la entrada se va a guardar:

Como puedes ver, estamos siguiendo el mismo patrón una y otra vez durante todo el tutorial de hoy. De esta forma, empleamos las acciones y filtros que nos ofrece WordPress para lograr manipular lo que deseamos cuando deseamos. En este caso, hemos creado una nueva función (wprincipiante_save_extension_titulo) que se ejecuta en el momento en que WordPress guardará una entrada en la base de datos (acción save_post). El código de esta función no tiene ningún secreto:

Añadimos algunas comprobaciones de rigor. Esencialmente, miramos que no estemos guardando una copia automática y, puesto que la función que creamos sirve para guardar el texto de la extensión de título, verificamos que efectivamente ese texto está definido.

A continuación, cogemos el valor en cuestión y lo pasamos por una función sanitize. Esto es algo importante: siempre y cuando recojamos valores de los usuarios, habrá que pasarlos por una función de estas. Por poner un ejemplo, si aguardamos un número entero, hay que revisar que ciertamente nos ha pasado un entero.

  • Para recobrar el valor, accedemos a un array de PHP llamado $ _REQUEST. Este array contiene los valores que se hayan enviado al guardar la entrada y, concretamente, el del campo que hemos añadido en nuestra meta box. Para acceder a ese valor, basta con usar el nombre del campo (wprincipiante-extension-titulo) como índice del array.
  • Finalmente, guardamos el valor en un campo personalizado que hemos decidido llamar _wprincipiante_ejemplo_extension_titulo usando la función update_post_meta.
  • Ahora, toda vez que editemos y guardemos una entrada, el valor que hayamos introducido en el campo de nuestra meta box se guardará en el campo personalizado _wprincipiante_ejemplo_extension_titulo de la entrada en cuestión.

Ahora bien, si editas una entrada, le agregas un texto a ese campo y la guardas, verás que el campo aparecerá vacío, tal y como si no se hubiese guardado apropiadamente. ¿Por qué ocurre eso, si te acabo de decir que sí lo hemos guardado? Sigue leyendo y lo comprenderás

Usar el nuevo campo en el front-end y en el back-end

Fijémonos un segundo en la función encargada de pintar el campo de texto, la que hemos definido antes:

Cada vez que pintamos el campo de texto input, éste está vacío. Si queremos que muestre el valor del campo personalizado _wprincipiante_ejemplo_extension_titulo, tendremos que recuperar ese valor de la base de datos. Es de esta forma como deberíamos haberlo hecho:

Para recuperar el valor del campo personalizado, simplemente utilizamos la función get_post_meta con el identificador de la entrada y el nombre del campo en cuestión. Entonces, va a bastar con redactar el valor donde toque (en un caso así, dentro del atributo value value de la etiqueta input).

Fíjate que el echo no es de manera directa del valor  dólares americanos val, sino que lo pasamos por una función llamada esc_attr. Esta función se encarga de escapar los caracteres que podrían romper el HTML resultante. Por servirnos de un ejemplo, si el valor del campo personalizado fuera:

  • Este es mi texto” favorito

y lo escribiéramos por pantalla directamente, nos quedaría el siguiente value:

que, como puedes ver, se rompe por el hecho de que hay demasiadas comillas dobles (parece que el valor del atributo value sólo es Este es mi” y lo que viene después es… quién sabe, algo mal formateado).

En cambio, si utilizamos la función esc_attr, este es el resultado:

el cual marcha con perfección (porque las comillas dobles se han sustituido por ").

Finalmente, sólo nos queda usar esta cadena de texto en el front-end. Ya habíamos definido una función (wprincipiante_cambiar_titulo) que alteraba el título de nuestras entradas. Mejoraremos esa función para que use el nuevo valor:

Como ves, volvemos a recobrar el valor utilizando la llamada que ya conocemos, verificamos que ese valor verdaderamente exista para la entrada en cuestión y, si existe, lo añadimos al título.

¡Y eso es todo! Ya hemos hecho un complemento bastante completito en muy poco tiempo. Interesante, ¿verdad?

Resumiendo

Crear plugins no es excesivamente complicado. Hay que controlar el conjunto de filtros y acciones que nos ofrece WordPress y emplearlos según los necesitemos. De todas y cada una formas, el código que hemos escrito hoy se puede prosperar muchísimo: estamos mezclando funcionalidades del complemento (código PHP) con la interfaz de usuario (contenido HTML), el código del front-end y del back-end está todo en el mismo archivo, todas las funciones son públicas… En la próxima entrada te voy a explicar de qué manera debes organizar el código y compartiré mis 5 trucos para redactar buen código.

¡Nos vemos la semana que viene!

Imagen destacada de mi portátil

0 673

plugins-adsense-wp.jpg

Una buena integración, colocación y visualización de anuncios son factores que influyen de forma directa en el desempeño de los programas promocionales como es Adsense. Para facilitarte esta labor te mostramos una colección con diecinueve complementos de WordPress para el manejo de adsense en tu weblog.

Adsense Deluxe – Este es quizá el complemento más popular sobre Adsense, con el que puedes tener el control total de tus anuncios para modificarlos, moverlos o activarlos. Puedes localizar una guía de su empleo en blog de ujimpe.

AdSense Widget for WordPress Sidebar – Añade bloques de anuncios en tu sidebar para manejarlo como un widget.

Shylock AdSense – Es otro complemento para una simple integración de los anuncios en tu blog, tiene la particularidad de que puedes agregar a anuncios solo artículos que cumplan cierta cantidad de días tras su publicación.

Adsense Injection – Te permite enseñar anuncios con estilos diferentes de forma aleatoria.

AdMan – Integra anuncios en tus artículos.

AdSense Manager – Otro plugin para controlar totalmente los anuncios en tu página.

AdRotator – Te deja hacer una rotación de tus anuncios en su ubicación.

AdSense Attachment -Te deja mostrar anuncios en contenido extra, por servirnos de un ejemplo, en la vista completa de una imagen, puedes rodear a está con anuncios adsense.

MightyAdsense – Otra herramienta para añadir el código adsense sin tocar los ficheros de la plantilla, incluye un visualizador para ir viendo el previo de cada anuncio.

Google Ad Wrap – Se encarga de limitar el contenido que spider de adsense analizará, de forma que solo considere el contenido de los artículo y sus comentarios.

Adsense Inline – Otro plugin que te permite insertar publicidad dentro de los artículo de forma rápida.

Adsense Beautifier – Coloca imágenes a lado de los anuncios para acrecentar el número de clic, hay que decir que últimamente Google Adsense prohibió esta clase de ‘mañas’ y su uso es poco recomendado.

Author Adsense – En blogs multiusuarios, deja mostrar de forma diferenciada los anuncios conforme al autor del artículo.

Author Adsense MU complemento – También permite mostrar anuncios de forma diferencia de acuerdo al autor pero destinado a WordPress MU.

AdSense Sharing Revenue and Earnings System – Muestra el desempeño de los anuncios de tu blog en exactamente el mismo panel de control.

Adsense Earnings WordPress Complemento – Otro complemento para observar las ganancias desde el panel de WordPress.

WP-AdsenseProfit – Un complemento más para mostrar tus ganancias.

CG-Inbetween – Te deja colocar boques de publicidad entre artículo y en dentro de las entradas. Puedes encontrar una completa guía para su uso en infectedfx.

MoreMoney – Te permite enseñar los anuncios sólo a visitantes provenientes de buscadores web.

Como puedes ver, existen complemento para cumplir con muchas necesidades, en lo personal recomiendo el uso de alguno de ellos sólo si no sabes poner el código manualmente en tu plantilla, puesto que cargan más a WordPress y pueden ser una entrada a ataques en tu weblog.

Vía: Mashable

ARTÍCULOS ALEATORIOS

0 924
WordPress es conocido por su facilidad de instalación. Sin embargo, siempre va bien recordar los pasos a seguir a fin de evitar posibles inconvenientes....