Cómo crear un Plugin de Google Calendar para WordPress
Spanish (Español) translation by Steven (you can also view the original English article)
Independientemente del nicho, agregar un plugin o complemento de un calendario a tu sitio de WordPress es una excelente manera de mejorar la participación y retención del usuario. Crear un complemento de este tipo no requiere mucho esfuerzo porque hoy en día hay muchos paquetes de calendario basados en la nube. Google Calendar es el más popular de todos y ofrece una API de uso gratuito.
En este tutorial, te mostraré cómo usar la API de Google Calendar para crear rápidamente un complemento de un calendario de WordPress que pueda mostrar eventos desde cualquier calendario de Google de acceso público.
Requisitos previos
Para poder aprovechar al máximo este tutorial, necesitarás:
- PHP 7.0.32 o superior
- WordPress 4.4.2 o superior
- Composer 1.8.0 o superior
- una cuenta de Google
1. Crear un proyecto de Google
Puedes usar la API de Google Calendar solo después de haber creado un proyecto configurado adecuadamente en la consola de Google Cloud Platform. Inicia sesión en la consola y, en el tablero, presiona el botón Crear.



En el formulario que se muestra a continuación, asigna un nombre a tu proyecto, cambia tu ID si lo deseas y presiona el botón Crear.



Una vez que el proyecto esté listo, abre la biblioteca de la API, selecciona la tarjeta API de Google Calendar y presiona el botón Habilitar para activar la API.



2. Crear una cuenta de servicio
A diferencia de la mayoría de las otras API de Google, la API de Google Calendar no te permite autenticar tus solicitudes con una clave API. En cambio, espera un token de autorización OAuth 2.0.
Para poder generar tal token desde el servidor en el que estás ejecutando WordPress, necesitarás una cuenta de servicio de Google. Ve a la sección Credenciales, presiona el botón Crear credenciales y selecciona la opción Clave de cuenta de servicio.



En la siguiente pantalla, elige la opción Nueva cuenta de servicio y escribe un nombre para la cuenta de servicio. En el campo Rol, selecciona la opción Visor de roles. Esto le dará a la cuenta de servicio acceso de solo lectura a todos tus calendarios de Google.



Una vez que presiones el botón Crear, recibirás un archivo JSON que contiene una clave privada y un ID de cliente. Guarda el archivo porque lo necesitarás más tarde.
3. Crear un Plugin de WordPress
Para comenzar a crear el plugin o complemento de WordPress, crea un nuevo directorio llamado my-gcal-plugin dentro del directorio wp-content/plugins/ de tu instalación de WordPress. Eres libre de usar cualquier otro nombre para el directorio. Sin embargo, si planeas compartir el complemento en el futuro, asegúrate de que el nombre sea único para evitar conflictos con otros complementos.
Dentro del directorio, crea un archivo PHP llamado my-gcal-plugin.php y ábrelo usando un editor de texto.
Para que WordPress reconozca tu complemento, este archivo debe tener un comentario de encabezado válido. Como mínimo, el comentario debe especificar el nombre de tu complemento. Sin embargo, sugiero incluir una breve descripción y un número de versión también. Entonces agrega el siguiente código dentro del archivo:
1 |
<?php
|
2 |
/**
|
3 |
* Plugin Name: My GCal Plugin
|
4 |
* Description: Displays upcoming events from public calendars
|
5 |
* Version: 1.0.0
|
6 |
*/
|
Si guardas el archivo ahora y abres la pantalla Plugins de tu panel de administración de WordPress, deberías poder ver tu nuevo complemento enumerado allí. Haz clic en el enlace Activar debajo de él antes de continuar.



4. Crear un widget
Para poder mostrar la salida de tu complemento en tu sitio de WordPress, necesitarás un widget personalizado. Entonces, dentro del archivo PHP, crea una nueva clase que extienda la clase WP_Widget. Puedes llamarlo My_GCal_Widget.
1 |
class My_GCal_Widget extends WP_Widget { |
2 |
|
3 |
}
|
Usando el constructor de su clase padre, puedes especificar el nombre de tu widget y la clase CSS que debe usar y, opcionalmente, darle una descripción.
1 |
public function __construct() { |
2 |
parent::__construct('my_gcal_widget', 'My GCal Widget', |
3 |
array( |
4 |
'classname' => 'my_gcal_widget', |
5 |
'description' => 'Shows events from a calendar' |
6 |
)
|
7 |
);
|
8 |
}
|
Al anular el método widget(), puedes especificar lo que muestra el widget. Deja este método vacío por ahora.
1 |
public function widget($args, $instance) { |
2 |
// More code here later
|
3 |
}
|
Por último, no olvides registrar el widget llamando a la función register_widget(). El mejor lugar para hacerlo es dentro de una devolución de llamada de enlace widgets_init. Entonces agrega el siguiente código al final del archivo PHP:
1 |
add_action('widgets_init', function(){ |
2 |
register_widget('My_GCal_Widget'); |
3 |
});
|
Si guardas el archivo y abres la pantalla Apariencia > Widgets del panel de administración, ahora deberías poder ver el nuevo widget enumerado allí.



Arrastra y suelta el widget en cualquier lugar dentro de la sección Barra lateral. De esta forma, cuando el widget esté listo, podrás mostrar los datos del calendario en la barra lateral de tu blog.
5. Instalando el cliente API de Google
Ahora que tienes un widget listo para agregar contenido a tu sitio de WordPress, es hora de comenzar a integrarlo con la plataforma Google Cloud. Hay una biblioteca de cliente API oficial disponible para aplicaciones PHP, y ofrece muchos métodos útiles que te permiten interactuar con la API de Google Calendar.
Debido a que la biblioteca está disponible en el repositorio de Packagist, la forma más fácil de instalarla es usando Composer.
Ejecuta el siguiente comando dentro de tu directorio de complementos para instalar la última versión del cliente API de Google:
1 |
composer require google/apiclient |
La biblioteca necesitará el archivo JSON que descargaste en un paso anterior. Por lo tanto, copia el archivo al directorio de complementos ya mismo.
Una vez que la biblioteca y todas sus dependencias estén instaladas, regresa a tu archivo PHP y cárgalo agregando el siguiente código justo debajo del comentario del encabezado:
1 |
require __DIR__ . '/vendor/autoload.php'; |
6. Inicializando el cliente de Google
Antes de intentar usar el cliente, debes configurarlo usando el archivo JSON. Comienza creando una variable miembro llamada $client dentro de la clase My_GCal_Widget.
1 |
private $client; |
Dentro del constructor de la clase, inicialízalo como un objeto Google_Client. Luego llama al método setAuthConfig() y pasa la ubicación del archivo JSON. El siguiente código muestra cómo:
1 |
$this->client = new Google_Client(); |
2 |
$this->client->setAuthConfig(__DIR__ . '/MyCalendarApp.json'); |
Además, debes solicitar un alcance específico de OAuth 2.0. Por ahora, debido a que solo estamos interesados en leer el contenido de un calendario, solicita un alcance de solo lectura o de tipo readonly.
1 |
$this->client->setScopes( |
2 |
"https://www.googleapis.com/auth/calendar.events.readonly"
|
3 |
);
|
7. Leyendo los datos del calendario
Con el cliente genérico API de Google, debes crear un cliente dedicado para el servicio Google Calendar. Por lo tanto, agrega el siguiente código dentro del método widget() de tu clase.
1 |
$calendarService = new Google_Service_Calendar($this->client); |
En este punto, debes especificar qué calendario público de Google deseas usar. Por ahora, usemos el calendario de días festivos de Estados Unidos. Entonces crea una variable para mantener su ID.
1 |
$myCalendarID = "en.usa#holiday@group.v.calendar.google.com"; |
No dudes en visitar Google Calendar para encontrar otros calendarios públicos interesantes. Puedes obtener el ID de cualquier calendario abriendo su página de configuración.
Para obtener una lista de eventos del calendario que has elegido, simplemente puedes llamar al método listEvents() ofrecido por el cliente del servicio de calendario. El método espera que pases el ID del calendario como primer argumento.
Por defecto, el método devuelve todos los eventos presentes en el calendario. Para asegurarte de que solo devuelve eventos próximos, puedes usar la opción timeMin y pasarle la fecha actual, formateada como una marca de tiempo RFC3339. Opcionalmente, puedes usar la opción maxResults para limitar el número de resultados devueltos.
El siguiente código te muestra cómo obtener cuatro eventos próximos:
1 |
$events = $calendarService->events |
2 |
->listEvents($myCalendarID, array( |
3 |
'timeMin' => date(DATE_RFC3339), |
4 |
'maxResults' => 4) |
5 |
)->getItems(); |
Cada evento tiene un resumen, que no es más que el título del evento, una descripción, una fecha y hora de inicio, una fecha y hora de finalización, una ubicación y varias otras propiedades útiles. Para simplificar las cosas, en este tutorial, trabajaremos solo con el resumen y la fecha de inicio de cada evento.
Todo lo que retornes mediante 'echo' desde el método widget() será procesado automáticamente por el widget. Entonces, todo lo que necesitas hacer ahora es retornar las dos propiedades para cada evento. El siguiente código te muestra:
1 |
foreach ($events as $e) { |
2 |
echo
|
3 |
"<p>" . |
4 |
$e->start->date . |
5 |
"<br/>" . |
6 |
$e->getSummary() . |
7 |
"</p>"; |
8 |
}
|
Si actualizas tu blog de WordPress ahora, deberías poder ver los eventos del calendario en la barra lateral.



Conclusión
Ahora sabes cómo usar la API de Google Calendar para crear un complemento de un calendario para WordPress. Siéntete libre de usar el complemento para compartir tu horario comercial o personal con tus usuarios, informarles sobre las próximas ofertas y descuentos, e incluso atraerlos a las reuniones locales que organices.
Para obtener más información sobre la API de Google Calendar, consulta la documentación oficial.



