Hostaway

How to integrate Hostaway with Webflow

Hostaway provides APIs and webhooks for integrating booking data, availability, and property information with external websites.

The three integration methods connect Hostaway to Webflow: native features, direct embeds and widgets for no-code embedding, use Zapier for automation for automated data sync, and build with Webflow and Hostaway APIs for full custom control.

Each method serves different skill levels. Widgets require only copy-paste implementation. Zapier works through visual workflow builders. API integration requires backend development with serverless functions.

Native features, direct embeds and widgets

Hostaway provides two embeddable JavaScript widgets — Search Bar and Calendar — requiring no API credentials or backend development. Get embed code from Hostaway Booking Engine settings, paste into a Webflow custom code embed element, customize via parameters (color, font, corner style, button text). Only one calendar widget per page.

Important note: iFrame embedding is not supported due to payment processing security restrictions.

Search bar widget

The embeddable search bar widget searches your inventory and links to your Hostaway booking engine. Key parameters: baseUrl (your domain), showLocation: true (filter by city), openInNewTab: false (keep users on your site).

Calendar widget

The calendar widget requires your Hostaway listing ID and displays availability for one property. Set button.action to checkout (direct bookings) or inquiry (collect guest info). Automatically pulls availability, including blocked dates.

Widget capabilities:

• Property search interface: Customizable styling (colors, fonts, appearance)
• Availability calendar display: Real-time booking status and pricing
• Direct checkout or inquiry actions: Via button.action parameter
• Brand customization: color.mainColor, color.frameColor, color.textColor parameters

Widgets load asynchronously. Require paid Webflow Site plan (Core, Growth, Agency, or Freelancer Workspace).

Use Zapier for automation

Zapier workflows sync reservation data from Hostaway to Webflow CMS collections automatically — no custom code required.

Workflow types:

• Reservation sync: New or Updated Reservation trigger creates/updates Webflow CMS items with booking dates and guest info
• Property listing: Creates CMS items when properties added to Hostaway
• Form submission: Webflow forms trigger inquiries in Hostaway
• Availability updates: Webhooks or scheduled workflows modify CMS items on status changes

Zapier handles authentication, rate limiting, and error retry automatically. Requires tokens with CMS:write scope from site settings. Free accounts support basic workflows; paid plans offer faster refresh and multi-step workflows.

Build with Webflow and Hostaway APIs

Custom API integration requires backend development — serverless functions on Netlify, Vercel, or Webflow Cloud communicating with Hostaway API and Webflow CMS API.

Sync property data to Webflow CMS

Pull property listings from Hostaway's API and create collection items with photos, descriptions, amenities, and pricing. The Webflow Collections API supports bulk operations up to 100 items/request. Rate limits: 60 req/min (Starter/Basic) to 120 req/min (CMS/Business/Enterprise).

Field mapping: plain text (addresses, names), number fields (pricing, bedroom counts), multi-image arrays (galleries), rich text (descriptions). Hostaway webhooks don't publish complete JSON schemas — capture actual payloads first.

The items start as drafts (isDraft: true). Publish via POST /collections/{collection_id}/items/{item_id}/publish. Image fields require objects with fileId and url properties — plain URL strings rejected for ImageRef types.

Display real-time availability calendars

Use Hostaway's Embeddable Calendar Widget or build custom calendars with client-side JavaScript fetching data via serverless backend. Backend authenticates with OAuth tokens (API keys), queries reservations filtered by property ID and date range.

Process bookings through webhook automation

Configure Hostaway webhooks to notify your backend on reservations created/updated/cancelled, or when dates, pricing, or access codes change.

• Requirements: HTTPS endpoint with valid SSL certificate. Optional basic authentication. No HMAC signature verification. Retries 3 times before alert email.
• Setup: Hostaway Dashboard (admin account) > Settings > Integrations > enter webhook URL > optionally filter by properties/channels > add auth credentials > test with reservation.

Webhook payloads not publicly documented — capture deliveries via webhook.site to document JSON structure (2-4 hours).

What you can build

Integrating Hostaway with Webflow lets vacation rental property managers create custom direct booking websites that reduce OTA commission costs while keeping operations centralized.

• Direct booking websites: Display live availability calendars and process reservations through Hostaway's embedded widgets on your Webflow site
• Multi-property portfolios: Create CMS-driven property listings that sync automatically from Hostaway using Zapier workflows
• Guest inquiry forms: Connect Webflow forms to Hostaway via Zapier to create inquiry records without manual data entry
• Availability displays: Show real-time booking status by embedding Hostaway's calendar widget on property pages