Un Web Component independiente del framework que permite a los visitantes guardar eventos en Google, Apple, Outlook, Yahoo e iCal sin complicaciones.
Flujo de trabajo específico
Tanto si quieres código limpio en tu stack frontend como una página de eventos completa sin código, tenemos lo que necesitas.
Añade un solo Web Component a cualquier aplicación web o sitio estático.
# Install via npmnpm install add-to-calendar-button<!-- CDN Script Tag in <head> --><script src="https://cdn.jsdelivr.net/npm/add-to-calendar-button" async defer></script>¿Con qué estás desarrollando?
¿Necesitas gestionar visualmente los botones, formularios RSVP, archivos .ics alojados o páginas de eventos sin escribir código?
Configurador interactivo
Personaliza los parámetros del evento y los ajustes de diseño en tiempo real y después copia el código del Web Component generado al instante.
Cargando la zona de pruebas…
Cargando la zona de pruebas…
Este playground incluye un subconjunto de los atributos disponibles. Para consultar todos los detalles del esquema, consulta la Documentación de configuración
Capacidades principales del motor
Las API de calendario y las especificaciones .ics exigen un tratamiento cuidadoso en cada plataforma. Hemos resuelto todas las anomalías de navegadores, protocolos y zonas horarias para que tú no tengas que hacerlo.
Enlaces profundos directos para calendarios web (Google, Outlook, Office 365 y Yahoo), además de archivos .ics validados según RFC 5545 para Apple y clientes de escritorio nativos.
Ver ejemplos de calendariosAdmite eventos de día completo, programas con varias fechas, intervalos RRULE recurrentes, suscripciones y parámetros de fecha dinámicos actualizados mediante JavaScript.
Ver la documentación de configuraciónDetecta automáticamente la zona horaria local del navegador del visitante y convierte las diferencias respecto a UTC sin complicaciones, incluidos los cambios de horario de verano.
Detalles de las zonas horariasProbado rigurosamente con los bloqueadores de ventanas emergentes de Safari en iOS, Chrome en Android, WebViews móviles integradas (Instagram y LinkedIn) y protocolos de correo web de Outlook.
Pruébalo en el playgroundTemas personalizados, propiedades CSS personalizadas, etiquetas de botón propias y localización i18n automática en 49+ idiomas según la configuración regional del navegador.
Lista de idiomasCumple las normas WCAG AA y admite teclado y lectores de pantalla. Ejecución 100 % en el cliente, entornos con requisitos estrictos del RGPD y compatibilidad con nonce de CSP.
Documentación de seguridadUna elección clara
Elige el Web Component gratuito para bases de código personalizadas o pásate a PRO cuando necesites gestión visual, seguimiento de confirmaciones y páginas de eventos.
| Funciones | Web Component gratuito | Add to Calendar PRO |
|---|---|---|
| Despliegue e instalaciónCómo integrarlo en tu flujo de trabajo | Insertar mediante npm / CDN / HTML | Página alojada y código para insertar |
| ConfiguraciónModelo de configuración del botón y el evento | Configurar en el código | Interfaz de gestión visual |
| Enlaces y archivos de calendarioGoogle, Apple, Outlook, Yahoo e iCal | Generar opciones para guardar en el calendario | Generar opciones + alojamiento de .ics gestionado |
| Páginas de destino de eventosMicrositios dedicados a eventos | Integración manual en tu sitio | Páginas de destino de eventos |
| RSVP y seguimiento de asistentesFormularios de confirmación y listas de invitados | - | Formularios RSVP |
| CTA posteriores al guardado e integracionesAcciones de seguimiento y automatización | - | CTA posterior al guardado, API, webhooks, Zapier y Pipedream |
| Licencia / accesoModelo de licencia | Gratis (Elastic License 2.0) | Planes gratuitos y de pago disponibles |