RoomBoss Documentation
English
  • Home
  • General Feature
  • PMS
  • SSMS
  • ECS
  • Travel Agent
English
  • Property Management System (PMS)
  • Rates & Inventory Setup
    • Accommodation Setup
      • Different Room Configuration
    • Managing Rate Plans
    • Setting Rates & Restrictions
      • Managing Rates & Restrictions At The Day Level
      • Managing Rates & Restrictions with Calendars and Periods
    • Managing Invoicing & Cancellation Strategies
    • Managing OTA Rates & Restrictions
    • Automated Gap Management
    • Using Allotments
    • User Roles
  • Channel Managers
    • RoomBoss Channel Manager
      • Prior to Integration
      • Starting the Integration Process
      • Once Activated
      • Managing Rates and Restrictions
      • Managing Room Stock Available To Channel Managers
      • RoomBoss Channel Manager Dashboard
      • Other Notes
      • FAQ
    • Neppan
      • Activating the Integration
      • Once Activated
      • FAQ
  • Website Booking Engine
    • Accommodation Booking Engine
    • Website Integration
    • URL Parameter Reference
    • Conversions & Analytics
    • Web Components
    • Sync Airbnb Calendar
  • Front Desk, Reservation & Housekeeping Operation
    • Front Desk
      • Check In
      • Check Out
      • Non-Accommodation Bookings
      • Daily Procedures
        • Start of Day Procedures
        • End of Day Procedures
      • General Recommendations
    • Reservations
      • Daily Procedures
      • New Booking Requests
        • Direct Booking Requests
        • Agent Booking Requests
      • New Booking Reservations
        • Direct Booking Reservations
        • Agent Booking Reservations
        • Channel Manager Booking Reservations
      • Allocating Bookings To Rooms
      • Modified Bookings
        • Modify a Direct Booking
        • Modify an Agent Booking
        • Modified Channel Manager Booking
      • Cancel Bookings
        • Cancelling a Direct Booking
        • Cancelling an Agent Booking
        • Cancelled Channel Manager Booking
      • Packages And Non-Accommodation Bookings
        • Non-Accommodation Notification Email Received
      • Record Adults, Children, and Infants on Bookings
    • Housekeeping
      • Overview
      • Setup
      • Managing Cleaning Tasks
      • Room Status
      • Custom Housekeeping
      • Daily Procedures
      • Suggested Workflow
    • Online Self Check-in System
      • Setup
      • Check-in Processes
        • Auto Email Self Check-in URL
        • Convey Check-in ID to Guest
        • Unpopulated Check-in Forms
      • Check-in Form Search
      • Front Desk HQ Integration
      • Online Self Check-in Form URL
      • Features Coming Soon
      • FAQ
    • Guest ID Capture With AdriaScan
    • General Room Status
  • Financial & Reporting Tools
    • User Management
    • Activity Tracking
      • Bookings
      • Invoices and Payments
      • Sales Desk
    • Data Locking
      • Financial Transaction Locking
      • Reservation Locking
      • Calendar Month Locking
      • Recommended Permissions for Data Locking
    • Reports
      • Rate Audit Report
      • In House
      • Manager Report
      • Operations Report
      • Kutchan Tax Report
  • Trust Accounting
    • The Basics
    • Journal Entry Upload
    • Allow Bookings Via Trust Owner Statements
    • Managing Post-Checkout Payments and Accounts Receivable
    • Property Ownership Changes
    • Clearing Accounts
  • USER GUIDES
    • General Features Across All Systems
    • Snow School Management System (SSMS)
    • E-Commerce System (ECS)
    • RoomBoss For Agent
  • LINKS
    • RoomBoss Login
    • RoomBoss Website
    • Contact Us
    • Privacy
Powered by GitBook
On this page
  • How to Install
  • Styling Hints
  • Availability Calendar
  • Daily Availability

Was this helpful?

  1. Website Booking Engine

Web Components

Host customisable, RoomBoss-powered components directly on your website.

How to Install

  • Add the following script to the <head> or <body> element of the page/pages you wish to display the component on.

<script type="module" src="https://ext.roomboss.com/elements/init.js"></script>

  • Embed the required HTML code within the page you want the component to appear on.

  • Modify the page CSS and HTML attributes per your styling and settings needs.

Styling Hints

RoomBoss web components can be styled using CSS, which can be added directly to the page you are displaying the component on or to your website's global custom styles.

To assist with customisation, there are a number of CSS variables which can be used, including:

  • rb-primary-color

  • rb-primary-font-family

  • rb-primary-font-weight

  • rb-secondary-color

  • rb-secondary-font-family

  • rb-secondary-font-weight

Availability Calendar

The Availability Calendar is used to show available dates for a single room type (typically used for standalone properties).

HTML Code

<rb-sigcal 
    cid="your-company-id" pid="your-room-type-id" 
    mt="12" lang="en">
</rb-sigcal>

Settings

  • cid - RoomBoss Company ID (required)

  • pid - RoomBoss Room Type ID (required)

  • mt - Number of months displayed (number, defaults to 3)

  • lang - Display Language (en / ja, defaults to English)

  • start - Date the calendar will begin (date string YYYYMMDD, defaults to today)

  • fill - Default style, uses green/red for availability/non-availability if true (boolean, defaults to true)

  • ref - Calendar ID, required for multiple calendars on the same page (string)

Daily Availability

The Daily Availability widget is used to display available dates for a multi-room type property.

HTML Code

<rb-daily-availability 
    vid="your-vendor-id" days="14" lang="en">
</rb-daily-availability>

Settings

  • vid - RoomBoss Vendor ID (required)

  • days - Number of days displayed (number)

  • lang - Display Language (en / ja, defaults to English)

  • show-name - Display the name of the vendor in the title (boolean, defaults to false)

  • start - Date the component will open on (date string YYYYMMDD, defaults to today)

  • di - Number of days shifted when clicking the "Next" / "Previous" controls (number)

PreviousConversions & AnalyticsNextSync Airbnb Calendar

Last updated 7 months ago

Was this helpful?

This component also requires a , which should be added for the page you want the component to appear on.

This can be set within your RoomBoss account from the page.

Website Configuration
Website Configuration
Display availability for a single property in a calendar format.
Display daily availability for a single property over a period by room type.