Conectar WordPress con aplicación Phonegap

Hay disponible una versión más reciente esta ya no es compatible con el nuevo plugin, que encontrarás en el repositorio oficial de WordPress, si ya tienes esta versión la puedes seguir utilizando pero si actualizas mejorará el rendimiento tan solo son necesarios dos pequeños cambios

Puedes acceder al post donde explico estos cambios y como implementarlos aqui

Por fin! Por falta de tiempo y demás me fue imposible acabar antes el sistema de conexión WordPress con Phonegap, que lo tenéis disponible en Github ( Aquí ) es la forma más simple de conectar una aplicación phongap con wordpress para que muestre el contenido de nuestro blog por ejemplo.

Descargar la aplicación test con todo conectado (Versión 2.0.3)

Su uso es sencillo y a continuación voy a explicar tanto su instalación como su funcionamiento.

ATENCIÓN: Para el funcionamiento de este plugin es necesario jQuery

Instalación del Plugin

1º Descarga todo el repositorio desde Github y descomprime su contenido.

2º Comprime la carpeta phonegap_connect que está dentro de la carpeta WordPress Plugin

3º El archivo zip resultante del paso 2 súbelo con el gestor de plugin a tu WordPress

4º Entra en la configuración del plugin desde el menú lateral izquierdo de wordpress en la opción «Phonegap»

5º Añade un TOKEN y guarda los cambios.

6º Felicidades! Tu WordPress ya puede servir contenido a una aplicación Phonegap.

App Phonegap

Ahora lo más importante es hacer que nuestra aplicación pueda obtener los datos del wordpress y para ello está el archivo javascript wp_connect.js situado dentro del repositorio en la carpeta «Aplicación Phonegap«.

Este archivo lo movemos hasta los directorios de nuestra aplicación en la carpeta «js» o donde almacenamos los archivos Javascript, una vez que el archivo se encuentre en uno de los directorios de nuestra app hay que incluirlo en el archivo index.html de la siguiente forma.

< script src="js/wp_connect.js" type="text/javascript" > < /script >

Una vez hecho esto ya está preparada nuestra app para recibir contenido de WordPress.

Inicio de procesos

Abre el archivo index.js o tu archivo de javascript de inicio donde la aplicación se ponga en funcionamiento y reciba el evento de «deviceready«.

Dentro de la función que llama «deviceready» añade el siguiente código para iniciar la conexión con WordPress.

WP.ini("http://www.example.com", "TOKEN","DEBUG", ELEMENTOS_POR_LLAMADA);

Si le pasamos el parámetro «DEBUG» hará una comprobación para ver si todo está correcto y a través de la consola nos dará un mensaje «Conexión establecida correctamente NOMBRE_DE_NUESTRO_WORDPRESS» Si nos dice lo anterior a través de la consola todo estará configurado correctamente y podremos eliminar el parámetro «DEBUG» del WP.ini().

No voy a explicar todos los parámetros que devuelve el plugin para cada llamada, pero voy a ponemos un ejemplo muy simple de como funciona.

Aunque está todo explicado en el repositorio de Github de este sistema con todos los parámetros que devuelve en cada llamada.

Por ejemplo si queréis las categorías del WordPress sería de la siguiente forma.

WP.categories(function(result) {
for(i=0;i<result.length;i++) {
console.log('ID: '+result[i]['term_id']+' Nombre: '+result[i]['name']);
}
});

Esto mostraría a través de la consola el Id y nombre de cada categoría que reciba, igualmente en el repositorio está todo explicado cada una de las funciones con ejemplos.

En caso de alguna duda comenta, pero si por el contrario es un error abre un problema en Github para resolverlo.

ACTUALIZACIÓN 26-05-2016: Si queréis comprobar el sistema aquí os dejo una aplicación test con todo conectado (Versión 2.0.3), simplemente en la función de WP.ini() cambiar la URL de vuestro WordPress y el Token. Podéis probarla con la app de Phonegap Developer haciendo phonegap serve en el terminal.

ACTUALIZACIÓN 28-06-2016: Se ha añadido soporte para las imágenes destacadas de los posts y páginas de WordPress, ahora ha cambiado la estructura JSON que devuelve el plugin, está explicado en el repositorio, si tenéis cualquier problema utilizar los comentarios y si es un error del sistema reportarlo en Github.

ACTUALIZACIÓN 30-06-2016: Se ha añadido soporte para campos personalizados de wordpress, cambiando así la estructura de home, posts y posts de categoria añdiendo «custom_field» como tercer parámetro.

ACTUALIZACIÓN 03-07-2016: Soporte para paginación de elementos, véase el repositorio en GitHub.

Un Saludo y Happy Code!