Integración genérica de sitio web
Integración de calendarios de reserva específicos a través de canales de reserva (Booking Channel)
En timum, puede crear tantos widgets de sitio web y enlaces de reserva configurados individualmente como desee. Este tipo de paquete de configuración, que siempre incluye un enlace de reserva individual junto con un fragmento de código para la integración en el sitio web, se denomina canal de reserva o Booking Channel. La configuración se puede adaptar en timum en cualquier momento. Los cambios se aplican inmediatamente en las páginas de reserva a través del enlace existente o en el widget del sitio web, sin necesidad de actualizar el sitio web ni el enlace.
Los canales de reserva se crean y editan en timum, en el calendario del proveedor, en la página Reserva de citas (véase Booking Channels).
Widget de integración genérico para la asignación dinámica del recurso reservable
Para la reserva de citas en sitios web con contenido genérico, como anuncios inmobiliarios, timum ofrece un código de widget genérico. Este se integra en la plantilla del sitio web para contenido genérico y se configura automáticamente para el recurso de reserva correspondiente mediante la transmisión de parámetros específicos.
La integración se compone de los siguientes elementos:
- Fragmento de script genérico para el calendario del proveedor correspondiente
- Transmisión de parámetros mediante parámetro URL o mediante un objeto global en la página
- Configuración del diseño y la funcionalidad en timum
Fragmento de script genérico
Encontrará el fragmento de código genérico en la configuración del calendario del proveedor correspondiente:
- Abra timum e inicie sesión.
- Abra el calendario del proveedor para el que desea configurar la integración con el sitio web.
- Abra Configuración en el menú principal.
- En la sección Perfil del proveedor encontrará el recuadro Integración del sitio web del proveedor. Haga clic en Mostrar código de inserción y seleccione JS Widget (o Iframe).
- Haga clic en Copiar.
- Inserte el fragmento en el lugar deseado de su sitio web.
Uso avanzado
La documentación completa para desarrolladores describe el fragmento de script general con todas las opciones de configuración:
https://www.npmjs.com/package/@timum/booking#in-a-script-tag
Especificación mediante referencia de recurso e ID de persona
Es obligatorio transmitir el parámetro de referencia de al menos un recurso reservable de timum. También es posible indicar varios recursos. Las referencias pueden generarse a partir de los ID de propiedad del sistema CRM o guardarse como UUID de timum.
Además, el ID de persona de un sistema CRM puede transmitirse opcionalmente al widget de reserva. Los clientes cuyos datos ya constan en el CRM no tienen que volver a introducir datos personales y pueden reservar directamente. Es posible solicitar información adicional configurando el formulario de reserva. Los datos recopilados se asignan automáticamente al registro en el CRM. Además del identificador de contacto (personId), debe transmitirse un identificador de plataforma para el CRM correspondiente.
- recurso reservable (ref) – obligatorio
- cliente preidentificado (pData) – opcional
- plataforma (sistema CRM)
- personId
Enlaces de reserva personalizados para plugins de sitio web integrados
Si el enlace de reserva debe personalizarse para cada destinatario individual, de modo que la persona se reconozca automáticamente y se asocie de forma fiable al registro en el CRM, añada parámetros URL:
Transmisión de parámetros
Existen dos posibilidades para la transmisión de parámetros, que se describen a continuación.
Opción 1: parámetro URL
Transmisión de la referencia de recurso de timum para el responsable del contacto (agente inmobiliario) y del ID del cliente (AddressID) como parámetros URL a su propio sitio web, en el que está integrado el widget de timum.
pDataId = <address ID der Person>
pDataPlatform = <Kennung des CRM>
Ejemplo:
www.meine-webseite.de/terminbuchung?pDataId=0815&pDataPlatform=onoffice
Opción 2: objeto global en la página
Transmisión de los parámetros (referencia del responsable del contacto e ID de dirección) mediante un objeto global en el sitio web.
https://www.npmjs.com/package/@timum/booking#global-config-override
window.timumBookingConfig = {
// Top-level slots — applied to every BookingJS instance on the page
appConfig: {
ref: 'current-resource-ref',
pData: {
platform : 'onOffice',
personId : '0815'
},
culture: 'de' /* … */
},
muiTheme: { palette: { primary: { main: '#abc' } } },
fcConfig: { /* … */ },
// Per-instance overrides — only applied to the instance whose
// appConfig.rootElId matches the key. Reserved names 'appConfig',
// 'muiTheme', 'fcConfig' are never matched even if a rootElId equals one.
'bookingjs-dd8d32cc-b53b-4ab4-af52-41325000592b': {
appConfig: { ref: 'special-ref' },
},
'bookingjs-{other-channel-uuid}': {
muiTheme: { palette: { primary: { main: '#def' } } },
},
};
Configuración del diseño y la funcionalidad
En la integración como widget genérico, en la que el recurso realmente reservable depende del contenido de un sitio web dinámico, la configuración se realiza en el calendario del proveedor en Configuración → Diseño de reserva.
Niveles y priorización de los ajustes de diseño
En timum hay disponible una amplia gama de opciones de configuración directamente a través de la interfaz de usuario. Los ajustes de configuración pueden definirse de forma jerárquica en distintas áreas.
Existe una cascada de prioridades para la aplicación de las configuraciones (lo de arriba prevalece sobre lo de abajo):
- Parámetros URL
- Entradas específicas de la instancia en el objeto global (clave
bookingjs-<Channel-UUID>) - Objeto global
timumBookingConfig - Configuración del tipo de cita
- Configuración del canal de reserva (Booking Channel)
- Valor predeterminado del calendario del proveedor
- Valor predeterminado de la cuenta
Documentación completa en npm
Más allá de las opciones de configuración disponibles en la interfaz de timum, o de forma independiente a estas, la configuración también puede ser realizada por desarrolladores web directamente dentro de la propia integración.
Documentación de la configuración de timum: www.npmjs.com/package/@timum/booking
