Cómo integrar Google Calendar en WordPress (métodos gratuitos y con plugins)
Respuesta rápida: Para insertar Google Calendar en WordPress , abre Google Calendar en un ordenador, selecciona el calendario en Ajustes , busca Integrar calendario y copia el código iframe.
En WordPress, agregue un HTML personalizado bloque, pegue el código y publique la página. Si necesita páginas de eventos de marca, filtros, reservas o venta de entradas, importe los eventos con Modern Events Calendar en lugar de mostrar el iframe de Google.
El calendario debe ser público o compartido con quienes necesiten consultarlo. El método gratuito es suficiente para un calendario público. Previsualiza la página publicada en un teléfono, ya que la cuadrícula mensual puede verse comprimida incluso después de que el iframe se ajuste al ancho de la página.
La mayoría de las personas que buscan cómo integrar Google Calendar en WordPress quieren ver el calendario hoy mismo, no una larga comparativa de plugins.
El método iframe tarda unos minutos y no requiere ningún complemento. Sus limitaciones solo cobran importancia cuando el calendario está orientado al cliente o necesita funciones más allá de la simple programación.
¿Qué método debe usar?
Utilice el iframe gratuito para un calendario público sencillo. Utilice un plugin de calendario de eventos específico como MEC cuando los eventos requieran sus propias páginas de WordPress, un mayor control del diseño, reservas, venta de entradas o importaciones programadas.
| Método | Ideal para | Costo | Compensación principal |
|---|---|---|---|
| iframe de Google Calendar | Horarios de apertura, horarios de clases, fechas de la comunidad, calendarios internos | Free | Estilo limitado y sin páginas de eventos nativas de WordPress. |
| Bloque de Google Calendar en WordPress.com | Sitios de WordPress.com que ya tienen el bloque | Incluido | El resultado sigue siendo una inserción alojada en Google. |
| Importación y exhibición de MEC | Eventos públicos, directorios, reservas, entradas y páginas de eventos de marca. | Gratuito o de pago, dependiendo de las funciones y complementos utilizados. | Requiere más configuración que copiar un iframe. |
Si necesitas algo más que un calendario, sigue nuestra guía para crear un sitio web completo para eventos en WordPress , que incluye páginas de eventos, registro, pruebas y lanzamiento.
¿Cómo se puede integrar Google Calendar en WordPress de forma gratuita?
Copia el iframe de la configuración de integración de calendario de Google Calendar y pégalo en un bloque HTML personalizado de WordPress. Google indica que el código de inserción está disponible desde un ordenador, no desde la aplicación móvil de Calendar.
Paso 1: Elija qué pueden ver los visitantes.
- En un ordenador, inicie sesión en calendario.google.com.
- En Mis calendariosHaz clic en el calendario que deseas publicar.
- Haga clic en el menú de tres puntos y luego Configuraciones y compartir.
- Comprueba los permisos de acceso al calendario.
Un sitio web público no puede mostrar un calendario privado a todos los visitantes. Si el calendario está destinado a que cualquiera lo vea, habilite la opción "Hacerlo público".
Google advierte que los calendarios públicos pueden revelar detalles de los eventos, por lo que usar un calendario aparte para los eventos del sitio web es la opción más segura. Nunca pegue la dirección iCal secreta del calendario en una página pública.
Paso 2: Copia el código de inserción de Google Calendar.
- Permanezca en la página de configuración del calendario y desplácese hasta Calendario integrado.
- En Código de inserción, haga clic Personalizar Si desea cambiar la vista predeterminada, los elementos mostrados, el color, el idioma, la zona horaria, el ancho o la altura.
- Copia el código completo del iframe.
Las instrucciones actuales de Google recomiendan establecer ambas dimensiones en al menos 500 píxeles en su personalizador. Aún así, puedes hacer que el iframe ocupe una columna de contenido más estrecha con CSS, como se muestra a continuación.
Paso 3: Pegar el iframe en WordPress
- Abre la página o entrada de WordPress donde debería aparecer el calendario.
- Haz clic en el insertador de bloques y agrega un HTML personalizado bloquear.
- Pega el código del iframe en ese bloque.
- Usar Vista previa para comprobar la página en directo y, a continuación, publicarla o actualizarla.
Si los visitantes ven el código del iframe como texto, significa que se pegó en un bloque de párrafo o código. Muévalo a un bloque HTML personalizado.
Paso 4: Ajusta el calendario al ancho de la página.
El ajuste más sencillo es cambiar el iframe. width valor para 100%Mantén una altura fija que se ajuste a la vista elegida. Una versión básica adaptable se ve así:
<div style="width:100%; overflow:hidden;">
<iframe
src="YOUR-GOOGLE-CALENDAR-EMBED-URL"
style="border:0;"
width="100%"
height="600"
frameborder="0"
scrolling="no">
</iframe>
</div>Conserva la URL de inserción del código que Google generó para tu calendario. Modifica únicamente el ancho, la altura o el contenedor. Una cuadrícula mensual completa puede verse recargada en un teléfono, incluso cuando el iframe se ajusta a su contenedor.
Para un público que utiliza principalmente dispositivos móviles, pruebe la vista de calendario o agenda, así como la vista mensual.
Un iframe estándar se publica rápidamente, pero su diseño y funciones interactivas siguen estando controlados por Google Calendar.
¿Cómo se añade Google Calendar a WordPress.com?
WordPress.com incluye un bloque de Google Calendar en los sitios compatibles. Añade ese bloque, pega el mismo código iframe de Google Calendar, haz clic en «Insertar » y previsualiza la página en una pestaña nueva.
En un sitio WordPress.org autoalojado, es posible que no veas este bloque a menos que Jetpack lo proporcione. El método de HTML personalizado funciona sin el bloque y suele ser la opción más rápida.
La guía de soporte actual de WordPress.com también señala que los temas pueden ofrecer controles de alineación de ancho completo y ancho amplio para el bloque del calendario.
¿Cuándo deberías importar los eventos de Google Calendar?
Importa eventos cuando el sitio web necesite gestionar la presentación y la experiencia del evento.
Un iframe muestra un calendario alojado en Google. Un evento importado puede convertirse en contenido de WordPress con su propia URL, imagen, organizador, ubicación, diseño y, donde sea compatible, opciones de reserva o venta de entradas.
Esta distinción es importante para las empresas que organizan eventos. Un horario escolar o un calendario de disponibilidad de oficina pueden funcionar bien como un iframe. Sin embargo, una empresa de conferencias, gimnasios, espacios para eventos o formación suele necesitar páginas con los detalles del evento que se ajusten al resto del sitio web.
Si aún estás decidiendo el nivel de control adecuado, consulta WordPress Custom Calendar Maker: 4 maneras de crear el tuyo . En él se compara la inserción de un calendario con las tablas nativas, las herramientas de programación alojadas y los plugins de eventos de WordPress.
La importación convierte una entrada del calendario en contenido que WordPress puede mostrar y gestionar como un evento.
¿Cómo se importan los eventos de Google Calendar con MEC?
MEC importa eventos a través de su pantalla de importación de Google Calendar utilizando una clave API de Google y el ID del calendario. Las opciones disponibles pueden variar según la versión de MEC y los complementos, así que compruebe la versión instalada antes de planificar un flujo de trabajo recurrente.
- Instale y active MEC Lite o MEC Pro.
- En Google Cloud, habilite la API de Google Calendar y cree una clave API para el sitio.
- En Google Calendar, copie el ID del calendario desde Configuración y uso compartido > Integrar calendario.
- En WordPress, abre Calendario ME > Importar/Exportar > Importar calendario de Google.
- Introduzca la clave API y el ID del calendario, y a continuación, seleccione el rango de fechas que desea consultar.
- Haga clic en ComenzarSeleccione los eventos que necesite e impórtelos a la lista de eventos de MEC.
- Crea o selecciona un código corto de MEC y colócalo en la página donde debe aparecer el calendario.
La documentación de MEC indica que el calendario de Google debe ser público para esta ruta de importación. También recomienda que la zona horaria de WordPress y Google Calendar coincida, especialmente cuando aparece un error 403, 404 o una hora de evento incorrecta.
También deberá asegurarse de que el calendario desde el que está importando sea público.
Tras la importación, elige un diseño de calendario que se adapte al contenido en lugar de forzar que todos los eventos se ajusten a una cuadrícula mensual. MEC es compatible con constructores de páginas como Gutenberg, Elementor y Divi.
Si tu calendario forma parte de una página de destino diseñada, revisa las formas disponibles de usar Elementor con MEC y las demás opciones de constructor compatibles antes de elegir un complemento.
¿Pueden Google Calendar y WordPress mantenerse sincronizados?
Sí, pero "sincronización" puede significar cosas diferentes.
El iframe siempre muestra una vista alojada en Google, por lo que no es necesario volver a importar nada. Un evento de WordPress importado constituye un registro independiente y requiere un proceso de importación o sincronización programado para recibir los cambios posteriores.
La documentación de importación y exportación de MEC incluye tareas programadas de Google Calendar mediante cron jobs. El servidor debe ser compatible con cron, y la importación o exportación de Google Calendar correspondiente debe estar configurada previamente.
MEC Advanced Importer Este complemento también puede conectarse a servicios como Google, Facebook, Meetup y Eventbrite, y permite a los administradores planificar importaciones. Confirme la configuración y el intervalo que necesita antes de utilizarla para cambios de última hora.
Las importaciones programadas reducen la duplicación de entradas, pero el momento en que se realizan depende de la tarea configurada y de la compatibilidad del sitio con la función cron.
Integración con Google Calendar o MEC: ¿cuál es la diferencia práctica?
| Capacidad | iframe de Google | Importación de eventos MEC |
|---|---|---|
| Tiempo de preparación | Unos minutos | Más tiempo porque la API y la pantalla necesitan configuración |
| Actualizaciones | Se muestra desde el calendario alojado por Google. | Manual o programado, según la configuración. |
| Control de diseño | Opciones de inserción de Google | Diseños, códigos cortos y constructores compatibles con WordPress |
| URLs de eventos en su dominio | No | Sí: |
| Imágenes destacadas, organizadores y ubicaciones. | Limitado a lo que muestra el elemento incrustado | Gestionado como contenido de evento |
| Reservas y venta de billetes | No está integrado en la función de inserción del calendario. | Disponible con las funciones o complementos MEC correspondientes. |
| Mejor ajuste | Un horario que la gente necesita ver | Eventos que la gente necesita descubrir, abrir, reservar o comprar. |
¿Por qué no funciona el calendario integrado?
La mayoría de los fallos se deben a permisos del calendario, un bloque de WordPress incorrecto, el tamaño del contenedor, el almacenamiento en caché o zonas horarias incompatibles. Compruebe estos aspectos antes de reemplazar el contenido incrustado o instalar otro plugin.
MEC devuelve un error 403 o 404 durante la importación: revise la configuración del calendario público, el estado de la API de Google Calendar, las restricciones de la clave API y el ID del calendario. Síganos en las redes sociales para estar al tanto de las novedades.
El calendario está en blanco o solicita a los visitantes que inicien sesión: Confirme que el calendario es público o que se comparte con todos los usuarios previstos.
El código del iframe aparece como texto: péguelo en un bloque HTML personalizado, no en un bloque de párrafo o código.
El calendario está cortado: Establezca el ancho del iframe en 100%Prueba con un bloque ancho o de ancho completo y aumenta la altura.
La vista para móviles es difícil de leer: prueba la vista de programación, reduce los controles que se muestran o utiliza un diseño de calendario de WordPress diseñado para pantallas pequeñas.
Los eventos se muestran a la hora incorrecta: asegúrese de que la zona horaria coincida en Google Calendar, WordPress y el complemento de importación.
Los eventos importados no han cambiado: compruebe la dirección de importación, la última ejecución, la programación cron y la caché de página.
1. ¿Puedo insertar un calendario privado de Google en WordPress?
Un calendario privado puede ser visible para las personas que hayan iniciado sesión y ya tengan permiso, pero no funcionará como un calendario público en un sitio web.
Para una página pública, crea un calendario aparte que contenga solo los eventos que te sientas cómodo publicando. No expongas una URL iCal secreta en el código fuente de la página.
2. ¿Aparecerán automáticamente las actualizaciones de Google Calendar en WordPress?
Un iframe carga el calendario alojado en Google, de modo que los visitantes ven el calendario actualizado cuando se actualiza la página incrustada.
Los eventos importados son registros independientes de WordPress. Se actualizan únicamente cuando se ejecuta otra importación o se configura una tarea de sincronización programada compatible.
3. ¿Necesito un plugin de WordPress para integrar Google Calendar?
No. El método gratuito de iframe solo necesita el código de inserción de Google Calendar y un bloque HTML personalizado de WordPress.
Un plugin resulta útil cuando se necesitan páginas de eventos de WordPress, un mayor control del diseño, filtros, metadatos de eventos, reservas o venta de entradas.
4. ¿Puedo insertar más de un calendario de Google?
Sí. El personalizador de Google Calendar permite incluir varios calendarios en una misma inserción, o bien puedes añadir iframes independientes a diferentes páginas de WordPress.
Mantén separados los calendarios públicos y privados, y prueba las etiquetas de color y la vista móvil cuando varios calendarios compartan una misma cuadrícula.
5. ¿La integración de Google Calendar ralentiza WordPress?
El iframe carga contenido de Google después de que la página comienza a cargarse, por lo que añade una solicitud de terceros y algo de peso a la página. Un calendario suele ser manejable.
Evite colocar varios elementos incrustados en la parte superior de la página y pruebe la página final con su herramienta de rendimiento habitual.
6. ¿Pueden los visitantes añadir un evento a su propio Google Calendar en WordPress?
Sí. Google indica que los visitantes pueden usar el enlace "Agregar a Google Calendar" que se encuentra en la parte inferior de un calendario público integrado.
Para un único evento público, Google Calendar también ofrece una opción de publicación de eventos con código HTML para un botón que permite añadirlo al calendario.
7. Publicar el calendario más sencillo que cumpla con el trabajo.
Un horario público no necesita un complemento. Copie el iframe, péguelo en un bloque HTML personalizado, ajuste el ancho y compruebe el resultado en un teléfono.
Utilice un complemento de eventos cuando el calendario deba hacer algo más que mostrar fechas.
Si tus visitantes necesitan páginas de eventos, filtros, reservas o entradas, prueba MEC con un pequeño conjunto de eventos antes de implementar el calendario completo.
Eso permite realizar una comparación clara sin alterar la programación en directo.
