Why Put Room Booking on Your Own Site
Most people looking for a studio or meeting room find you through your website. If the only way to book is to send a message, many of them never do. A booking calendar right on your site lets visitors check free hours, choose a room and book in under a minute, without leaving your page.
Meetario Widgets make this a copy-and-paste job. One widget can list all your rooms, so you do not need a separate embed for each one. This guide assumes you have already set up your rooms as event types with resource mode on. If not, start with How to Rent Out a Photo Studio by the Hour or How to Set Up Meeting Room Booking.
Before You Start
- Each room is its own event type (for example "Loft", "White Hall" and "Cyclorama", or "Room A (6 people)" and "Board Room").
- Each one has This is a room or resource ticked in the Scheduling section, so rooms can be booked in parallel.
- Opening hours are set in the Availability section, and prices in the Payment panel if you charge for rentals.
- The rooms are active, because only active event types can be added to a widget.
Step-by-Step: Create a Room Booking Widget
- Open Widgets. Click Widgets in the top navigation, then New Widget.
- Name it. Something like "Website – all rooms". The name is only for you.
- Choose the widget type. Pick one of the type cards:
- Floating — a button that stays in the corner of every page and opens the booking calendar. Good for a general "Book a room" call to action across the whole site.
- Inline — the calendar is placed directly inside your page content. Best for a dedicated "Booking" or "Rooms" page.
- Popup — opens the booking calendar in a popup window.
- Pick the Display Mode. Choose Event List to show all selected rooms as a list the visitor chooses from. Single Event and Calendar View are also available.
- Select the rooms. In the Event Types section, tick every room you want to show. For a studio, tick Loft, White Hall and Cyclorama; leave out personal event types like "Studio tour" if they do not belong on the booking page.
- Make sure the widget is active (the Widget is active checkbox), then save.
- Copy the embed code. In the Embed Code panel, click Copy Code.
- Paste it into your website. Add the snippet to the HTML of your site, ideally just before the closing body tag, or into the "custom code" or "HTML embed" block of your website builder.
Placing an Inline Calendar Exactly Where You Want It
For the Inline type, the widget page shows an extra hint: place the <div data-meetario="..."> container where the calendar should appear on your page. If you leave it out, the calendar is appended to the end of the page. If your site builder does not let you add a custom div, the hint also explains how to mount the calendar into an existing element by adding a container selector to the script.
A typical layout for a studio site: a "Rooms" page with photos and descriptions of each hall at the top, and the inline calendar below, so visitors read first and then book.
What Visitors See
- The list of the rooms you selected in the widget.
- After choosing a room, a calendar with free dates. If you enabled Clients can book several slots in a row, they are asked "How long do you need?" and see only start times where the whole block is free.
- The booking form with your custom fields, such as "Number of people" or "Need lighting equipment?".
- If the room is a Paid Event, the payment step with the total for the selected hours.
- A confirmation, followed by an email confirmation and reminders. Visitors can also opt in to Telegram, Viber or WhatsApp reminders if you have connected those messengers.
You receive a notification for every new booking by email and in your connected messengers. Room bookings stay out of your personal calendar.
No Website? Use the Direct Link
Every widget also has a Direct Link under the embed code. Share it in social media bios, messengers or a QR code. You can also share your profile page at /booking/{your-username}, which lists all your public event types, or the individual link of each room.
Tips
- One widget for all rooms is usually enough. Create a second widget only when a page should show a subset, for example "Meeting rooms" vs "Event hall".
- Use clear room names and descriptions that mention capacity and equipment, so visitors pick the right room the first time.
- Test on mobile. Open your site on a phone and complete a booking; most visitors will book from their phone.
- Changes apply instantly. When you update a room price, hours or buffer in the event type, the widget picks it up. You do not need to re-paste the code. If you add a new room, just tick it in the widget settings.
Put Your Rooms Online
Create your free Meetario account, set up your rooms and paste one snippet into your site. To fine-tune hourly rates and cleaning time, read Hourly Pricing, Minimum Booking Length and Cleaning Buffers. See also Meetario for studios and Meetario for meeting rooms.