Booking Website: Widget de Calendario – Hostaway

El nuevo motor de reservas ofrece capacidades como venta adicional, búsqueda avanzada y configuración rápida. Sin embargo, debido a sus opciones de personalización inherentemente limitadas, puede que no sea un reemplazo completo para sitios web creados a medida. Además, es posible que desee permitir que los huéspedes reserven sus anuncios sin salir de su sitio web.

El widget de calendario incrustable es un código que se puede ingresar en un sitio web para mostrar un calendario como el que existe en las páginas de anuncios del motor de reservas. Tiene opciones de estilo y personalización. Cuando los huéspedes hacen clic en el botón de acción, son dirigidos a las páginas de pago o consulta de un anuncio específico, de acuerdo con sus configuraciones específicas de Hostaway.

Permite solo un widget de calendario por página.

Cómo configurarlo:

Para usar el widget de calendario, necesitas tener un motor de reservas publicado en tu cuenta de Hostaway

Incorpora el siguiente código en el lugar deseado de tu sitio web. Como el widget enlaza a la página de pago/consulta de un listado específico, recomendamos incorporarlo junto a la información sobre el listado

<div id="hostaway-calendar-widget"></div>
<script src="https://d2q3n06xhbi0am.cloudfront.net/calendar.js"></script>
<script>
  window.hostawayCalendarWidget({
    baseUrl: 'https://www.mywebsite.com/',
    listingId: 40467,
    numberOfMonths: 2, // o 1
    openInNewTab: true, // o false
    font: 'Open Sans',
    rounded: true, // o false
    button: {
      action: 'checkout', // o 'inquiry'
      text: 'Book now',
    },
    clearButtonText: 'Clear dates',
    color: {
      mainColor: '#ff0000',
      frameColor: '#000000',
      textColor: 'green',
    },
  })
</script>

Modifica las líneas 5-10, 12-13 y 16-18 en el código de acuerdo con los parámetros relevantes:
1. baseUrl: debe ser la URL del motor de reservas. Puede ser una URL de holidayfuture o personalizada. Por ejemplo 'https://drakeshome.holidayfuture.com/' (importante incluir el carácter ')
2. listingId: El ID del listado de Hostaway
3. numberOfMonths: puede ser 1 o 2. Determina cuántos meses se muestran en el widget
4. openInNewTab: puede ser true o false. Determina si la página de pago/consulta se abrirá en la misma pestaña (cuando se establece en false) o en una nueva (cuando se establece en true).
5. font: puede ser un nombre de fuente. Ver lista de fuentes aquí. Determina la fuente utilizada en el widget (importante incluir el carácter ')
6. rounded: puede ser true o false. Determina si el calendario tendrá un aspecto redondeado o cuadrado
7. action: puede ser 'checkout' o 'inquiry' (importante incluir el carácter '). Determina si el botón de acción lleva a la página de pago o consulta del listado
8. text: determina el texto que se muestra en el botón de acción y es importante separarlos
  - Book now(importante incluir el carácter ')
  - ButtonText: 'Clear dates', el texto puede ser cambiado
9. mainColor: un código de color HEX que afecta el color del botón de acción. Por ejemplo '#cc2dcf' (importante incluir el carácter ')
10. frameColor: igual que mainColor pero para el marco del widget
11. textColor: igual que mainColor pero para el texto en el widget
El widget muestra un calendario con 1 o 2 meses (según la configuración) donde se muestra la disponibilidad del anuncio. El botón de acción lleva a los huéspedes a la página de pago/consulta del anuncio.
Ejemplos de widgets con diferentes configuraciones:

Cómo configurarlo:

Artículos relacionados