If you want more control over the drop-in booking widget, then there are additional parameters that you can add to direct users to a preselected space, space type, date, time, duration, and/or capacity. For example, you could make it so that your drop-in booking widget will automatically only display meeting rooms available at your downtown location on June 1st, rather than all of your spaces. You could also limit it to just one space, and even choose to only include the transactional elements, hiding any additional information like photo and space details.

Parameters for drop-in booking embed code

Below is the default code for embedding the drop-in booking widget. Note that you will need to add your venue subdomain after optix-venue. You can also change whether the widget is embedded or appears in a modal by changing optix-mode to either "popup" (for a modal) or "embed".

<!-- The widget script binds the click event to any html component that has the class below, you may include as many links you want at your page, make sure to use your venue subdomain -->

<div

    class="optix-booking-widget"

    optix-venue="yourvenuesubdomain"

    optix-mode="popup"

 >Sample popup link or any html tag/element</div>

<!-- The script below should be included ONCE after the </body> (body close tag) -->

<script>

(function(o, p, t, i, x) {

    x = p.createElement(t);

    var m = p.getElementsByTagName(t)[0];

    x.async = 1;

    x.src = i;

    m.parentNode.insertBefore(x, m);

})(window, document, "script", "https://apps.optixapp.com/web-plugin/optix.v1.js");

</script>


You can add your parameters to the tag where you are defining the class "optix-booking-widget". The following parameters are available:

  • optix-args-locations=”123,456,653 - Will only show resources from the specificed location numbers (where to find these numbers is detailed below). If you provide an invalid ID, then the widget will simply ignore it. The location filter will disappear if you provide only one location, or if any of the locations have no spaces available. You may use more than one ID, separating them with comma.
  • optix-args-duration=”3600- Defines the default duration in seconds for the booking. The user will still be able to change this filter.
  • optix-args-capacity=”3- Defines the default minimum capacity filter. The user will still be able to change this filter.
  • optix-args-date=”2021-03-30- Defines the default date. The user will be able to change this filter. Always use the date in ISO format. If you do not set this filter, we will use the current date as the default booking date. For future dates, we suggest including optix-args-time=”00:00” to ensure all times of the day are presented.
  • optix-args-time=”20:30 - Defines the default start time for the booking. The user will be able to change this filter. Always use the format HH:MM in 24 hour format. If you do not set this filter, we will use the current time as the default start time for the meeting.
  • optix-args-resource=”12345 - This will skip the space finder interface and show a specific space to the user. The user will not be able to go back to the finder interface and will only be able to book the specified resource. Where to find the resource ID is detailed below.
  • optix-args-picker=”true- Skip the resource details page and show the date/duration/time picker by default. Note: This must be used in conjunction with optix-args-resource to take effect.
  • optix-args-types=”Meeting Room - Filter by a type of space. Make sure to use the exact wording, including case. The options are: Hot Desk, Dedicated Desk, Conference Room, Meeting Room, and Private Office. You may filter by more than one, separating the options with a comma.

Note: You may combine optix-args-resource with other attributes, but be aware that optix-args-locations and optix-args-capacity have no influence on the resource details page since a specific space is already selected.

We've included an example of embed code with added attributes below. This would take the user directly to the date/duration/time picker for resource number 12345.

<!-- Example opening one specific resource, directly on the duration picker page -->

<div

    class="optix-booking-widget"

    optix-venue="yourvenuesubdomain"

    optix-mode="embed"

    optix-args-resource="12345"

    optix-args-picker="true"

    style=”width:400px;height:700px”

 >Sample popup link or any html tag/element</div>

<!-- The script below should be included ONCE after the </body> (body close tag) -->

<script>

(function(o, p, t, i, x) {

    x = p.createElement(t);

    var m = p.getElementsByTagName(t)[0];

    x.async = 1;

    x.src = i;

    m.parentNode.insertBefore(x, m);

})(window, document, "script", "https://apps.optixapp.com/web-plugin/optix.v1.js");

</script>


Here's what this would look like embedded onto your website:

Parameters for drop-in booking links

The default code for the drop-in booking link will be in the format: yoursubdomain.optixapp.com/book. You can add the following parameters to this URL:

  • Date - E.g. yoursubdomain.optixapp.com/book?date=2023-03-20
  • Link to a specific resource - E.g. yoursubdomain.optixapp.com/book/resource/1234 (Where to find the resource ID is detailed below)
  • Link straight to the date/duration/time picker for a specific resource - yoursubdomain.optixapp.com/book/resource/1234/pick

Where to find the location ID

To link straight to the resources available for a specific location, or list of locations, you need to have the correct location ID(s). You can find the ID for a location from your dashboard by going to Venues & Spaces and choosing the location that you need the ID for. The number at the end of the URL for this page is the location ID:

Where to find the resource ID

To link straight to a specific resource, you need to have the resource ID. You can find this in your dashboard by going to Venues & Spaces, then the Spaces tab, and selecting the space the you want the resource ID for. The number at the end of the URL for this page is the resource ID:

Did this answer your question?