{"id":52018,"date":"2026-06-17T09:11:27","date_gmt":"2026-06-17T09:11:27","guid":{"rendered":"https:\/\/crocoblock.com\/knowledge-base\/?post_type=article&p=52018"},"modified":"2026-06-17T09:11:28","modified_gmt":"2026-06-17T09:11:28","slug":"creating-booking-form-for-room-reservation","status":"publish","type":"article","link":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/","title":{"rendered":"How to Create a Standalone Booking Form for Hotel Room Reservations"},"content":{"rendered":"\n

In this tutorial, we use the \u201cGrand Hotel\u201d dynamic template<\/a> and create a hotel room reservation setup. However, you can use the same workflow for any other booking project configured with JetBooking<\/em>.<\/p>\n\n\n\n

We also add the Booking Form <\/strong>widget to the booking instance Single template<\/strong>, but you can also place it on other pages or templates by specifying the Booking Instance ID <\/strong>manually.<\/p>\n\n\n\n

Add Booking Form to the Single Template<\/h2>\n\n\n\n
\n

First, we open the Single template<\/strong><\/a> <\/strong>of the booking instance post type.\u00a0<\/p>\n\n\n\n

We use the JetThemeCore<\/em><\/a> <\/em>plugin\u2019s functionality for this, so you can check the How to Create a Custom Single Page for CPT-Based Booking <\/strong>tutorial <\/a>to build a similar layout. In this example, our Single template <\/strong>is built in Elementor.<\/p>\n\n\n\n

So, we add a Booking Form <\/strong>widget to the template. Check our Booking Form Overview <\/strong>to find out more information about this widget\u2019s settings.<\/p>\n\n\n\n

\"booking<\/a><\/div>\n\n\n\n

We leave the Booking instance ID <\/strong>field empty because we work with the booking instance Single template<\/strong>. However, if you add the form to the page that is not directly connected to the booking instance, you should specify the ID of the needed post in this field.<\/p>\n\n\n\n

As for the Layout<\/strong>, we change it to \u201cSeparate Fields\u201d and leave the \u201cInline\u201d Position <\/strong>selected.<\/p>\n\n\n\n

We also set the Check in Label <\/strong>and Check out Label<\/strong> to \u201cCheck-in Date\u201d and \u201cCheck-out Date\u201d values accordingly. <\/p>\n\n\n\n

In the Description <\/strong>field, we paste the \u201cWe\u2019ll contact you once we receive your reservation request.\u201d text that will be displayed below the check-in\/check-out fields.<\/p>\n\n\n\n

In the Label <\/strong>field, we set the \u201cBook Now\u201d value.<\/p>\n\n\n\n

\"booking<\/a><\/div>\n\n\n\n

You can make style changes to the widget and adjust the page if needed. <\/p>\n\n\n\n

Once everything is ready, save the result.<\/p>\n<\/div><\/div>\n\n\n\n

Test the Booking Form<\/h2>\n\n\n\n
\n

Now, open any of the posts related to your booking instance post type on the front end.<\/p>\n\n\n\n

For example, we open the \u201cSuite Room\u201d post and scroll down to the form. <\/p>\n\n\n\n

We complete this form by entering the check-in and check-out dates and a test email address. To submit the reservation request, we press the \u201cBOOK NOW<\/strong>\u201d button.<\/p>\n\n\n\n

\"booking<\/a><\/div>\n\n\n\n

Once the button is pressed, the \u201cBooking was created successfully.\u201d message is displayed below the form.<\/p>\n\n\n\n

\"booking<\/a><\/div>\n<\/div><\/div>\n\n\n\n

Check the Created Booking<\/h2>\n\n\n\n
\n

Now, we check whether the booking was added to the WordPress Dashboard > <\/em><\/strong>Bookings<\/em><\/strong><\/a> <\/em><\/strong>list.<\/p>\n\n\n\n

If everything is set up correctly, the booking will appear here. We press the \u201cEdit<\/strong>\u201d button to review the reservation details.<\/p>\n\n\n\n

\"bookings<\/a><\/div>\n\n\n\n

Once the button is pressed, the Edit Booking <\/strong>pop-up opens. Here, we can see all details related to the created booking.<\/p>\n\n\n\n

\"edit<\/a><\/div>\n<\/div><\/div>\n\n\n\n

FAQ<\/h2>\n\n\n\n
Can the Booking Form be added outside the Single template?<\/strong><\/strong>

Yes, you can place the Booking Form <\/strong>on any page or template. In this case, you can specify the Booking Instance ID <\/strong>manually in the widget settings.<\/p> <\/div>

Does the Booking Form require WooCommerce?<\/strong><\/strong>

No, the Booking Form <\/strong>creates bookings directly via AJAX submission and does not require the WooCommerce <\/em>functionality.<\/p> <\/div>

Can the Booking Form be used without JetFormBuilder?<\/strong><\/strong>

Yes, the form works independently and can create bookings without JetFormBuilder<\/em><\/a> <\/em>forms.<\/p> <\/div>

What booking status is assigned after form submission?<\/strong><\/strong>

Newly created bookings receive the \u201cPending\u201d status by default.<\/p> <\/div> <\/div>\n\n\n\n

That\u2019s all about creating a standalone booking form for hotel room reservations by using the Booking Form <\/strong>widget\/block\/element from the JetBooking <\/em>plugin for WordPress.<\/p>\n","protected":false},"excerpt":{"rendered":"

In this guide, you will find out how to create a standalone booking form on your WordPress website.<\/p>\n","protected":false},"author":9,"featured_media":0,"template":"","format":"standard","builder-category":[],"article-category":[595],"yoast_head":"\nHow to Create a Booking Form for Room Reservation \u2014 JetBooking | Crocoblock<\/title>\n<meta name=\"description\" content=\"Learn how to build a standalone booking form for hotel room reservations on your WordPress website by using JetBooking.\" \/>\n<meta name=\"robots\" content=\"index, follow, max-snippet:-1, max-image-preview:large, max-video-preview:-1\" \/>\n<link rel=\"canonical\" href=\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/\" \/>\n<meta property=\"og:locale\" content=\"en_US\" \/>\n<meta property=\"og:type\" content=\"article\" \/>\n<meta property=\"og:title\" content=\"How to Create a Booking Form for Room Reservation \u2014 JetBooking | Crocoblock\" \/>\n<meta property=\"og:description\" content=\"Learn how to build a standalone booking form for hotel room reservations on your WordPress website by using JetBooking.\" \/>\n<meta property=\"og:url\" content=\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/\" \/>\n<meta property=\"og:site_name\" content=\"Help Center\" \/>\n<meta property=\"article:modified_time\" content=\"2026-06-17T09:11:28+00:00\" \/>\n<meta property=\"og:image\" content=\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2026\/06\/booking-form-widget-added-to-elementor-1824x1140-1-1024x640.webp\" \/>\n<meta name=\"twitter:card\" content=\"summary_large_image\" \/>\n<meta name=\"twitter:label1\" content=\"Est. reading time\" \/>\n\t<meta name=\"twitter:data1\" content=\"4 minutes\" \/>\n<script type=\"application\/ld+json\" class=\"yoast-schema-graph\">{\"@context\":\"https:\/\/schema.org\",\"@graph\":[{\"@type\":[\"WebPage\",\"FAQPage\"],\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/\",\"name\":\"How to Create a Booking Form for Room Reservation \u2014 JetBooking | Crocoblock\",\"isPartOf\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\"},\"datePublished\":\"2026-06-17T09:11:27+00:00\",\"dateModified\":\"2026-06-17T09:11:28+00:00\",\"description\":\"Learn how to build a standalone booking form for hotel room reservations on your WordPress website by using JetBooking.\",\"breadcrumb\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#breadcrumb\"},\"mainEntity\":[{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686198324\"},{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686275286\"},{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686337379\"},{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686386034\"}],\"inLanguage\":\"en-US\",\"potentialAction\":[{\"@type\":\"ReadAction\",\"target\":[\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/\"]}]},{\"@type\":\"BreadcrumbList\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#breadcrumb\",\"itemListElement\":[{\"@type\":\"ListItem\",\"position\":1,\"name\":\"Home\",\"item\":\"https:\/\/crocoblock.com\/knowledge-base\/\"},{\"@type\":\"ListItem\",\"position\":2,\"name\":\"Articles\",\"item\":\"https:\/\/crocoblock.com\/knowledge-base\/articles\/\"},{\"@type\":\"ListItem\",\"position\":3,\"name\":\"How to Create a Standalone Booking Form for Hotel Room Reservations\"}]},{\"@type\":\"WebSite\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#website\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/\",\"name\":\"Help Center\",\"description\":\"\",\"publisher\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#organization\"},\"potentialAction\":[{\"@type\":\"SearchAction\",\"target\":{\"@type\":\"EntryPoint\",\"urlTemplate\":\"https:\/\/crocoblock.com\/knowledge-base\/?s={search_term_string}\"},\"query-input\":\"required name=search_term_string\"}],\"inLanguage\":\"en-US\"},{\"@type\":\"Organization\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#organization\",\"name\":\"Help Center\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/\",\"logo\":{\"@type\":\"ImageObject\",\"inLanguage\":\"en-US\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/\",\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg\",\"contentUrl\":\"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg\",\"caption\":\"Help Center\"},\"image\":{\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/\"}},{\"@type\":\"Question\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686198324\",\"position\":1,\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686198324\",\"name\":\"Can the Booking Form be added outside the Single template?\",\"answerCount\":1,\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Yes, you can place the <strong>Booking Form <\/strong>on any page or template. In this case, you can specify the <strong>Booking Instance ID <\/strong>manually in the widget settings.\",\"inLanguage\":\"en-US\"},\"inLanguage\":\"en-US\"},{\"@type\":\"Question\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686275286\",\"position\":2,\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686275286\",\"name\":\"Does the Booking Form require WooCommerce?\",\"answerCount\":1,\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"No, the <strong>Booking Form <\/strong>creates bookings directly via AJAX submission and does not require the <em>WooCommerce <\/em>functionality.\",\"inLanguage\":\"en-US\"},\"inLanguage\":\"en-US\"},{\"@type\":\"Question\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686337379\",\"position\":3,\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686337379\",\"name\":\"Can the Booking Form be used without JetFormBuilder?\",\"answerCount\":1,\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Yes, the form works independently and can create bookings without <a href=\\\"https:\/\/jetformbuilder.com\/\\\" target=\\\"_blank\\\" rel=\\\"noreferrer noopener\\\"><em>JetFormBuilder<\/em><\/a><em> <\/em>forms.\",\"inLanguage\":\"en-US\"},\"inLanguage\":\"en-US\"},{\"@type\":\"Question\",\"@id\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686386034\",\"position\":4,\"url\":\"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686386034\",\"name\":\"What booking status is assigned after form submission?\",\"answerCount\":1,\"acceptedAnswer\":{\"@type\":\"Answer\",\"text\":\"Newly created bookings receive the \u201cPending\u201d status by default.\",\"inLanguage\":\"en-US\"},\"inLanguage\":\"en-US\"}]}<\/script>\n<!-- \/ Yoast SEO plugin. -->","yoast_head_json":{"title":"How to Create a Booking Form for Room Reservation \u2014 JetBooking | Crocoblock","description":"Learn how to build a standalone booking form for hotel room reservations on your WordPress website by using JetBooking.","robots":{"index":"index","follow":"follow","max-snippet":"max-snippet:-1","max-image-preview":"max-image-preview:large","max-video-preview":"max-video-preview:-1"},"canonical":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/","og_locale":"en_US","og_type":"article","og_title":"How to Create a Booking Form for Room Reservation \u2014 JetBooking | Crocoblock","og_description":"Learn how to build a standalone booking form for hotel room reservations on your WordPress website by using JetBooking.","og_url":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/","og_site_name":"Help Center","article_modified_time":"2026-06-17T09:11:28+00:00","og_image":[{"url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2026\/06\/booking-form-widget-added-to-elementor-1824x1140-1-1024x640.webp"}],"twitter_card":"summary_large_image","twitter_misc":{"Est. reading time":"4 minutes"},"schema":{"@context":"https:\/\/schema.org","@graph":[{"@type":["WebPage","FAQPage"],"@id":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/","url":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/","name":"How to Create a Booking Form for Room Reservation \u2014 JetBooking | Crocoblock","isPartOf":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#website"},"datePublished":"2026-06-17T09:11:27+00:00","dateModified":"2026-06-17T09:11:28+00:00","description":"Learn how to build a standalone booking form for hotel room reservations on your WordPress website by using JetBooking.","breadcrumb":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#breadcrumb"},"mainEntity":[{"@id":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686198324"},{"@id":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686275286"},{"@id":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686337379"},{"@id":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686386034"}],"inLanguage":"en-US","potentialAction":[{"@type":"ReadAction","target":["https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/"]}]},{"@type":"BreadcrumbList","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#breadcrumb","itemListElement":[{"@type":"ListItem","position":1,"name":"Home","item":"https:\/\/crocoblock.com\/knowledge-base\/"},{"@type":"ListItem","position":2,"name":"Articles","item":"https:\/\/crocoblock.com\/knowledge-base\/articles\/"},{"@type":"ListItem","position":3,"name":"How to Create a Standalone Booking Form for Hotel Room Reservations"}]},{"@type":"WebSite","@id":"https:\/\/crocoblock.com\/knowledge-base\/#website","url":"https:\/\/crocoblock.com\/knowledge-base\/","name":"Help Center","description":"","publisher":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#organization"},"potentialAction":[{"@type":"SearchAction","target":{"@type":"EntryPoint","urlTemplate":"https:\/\/crocoblock.com\/knowledge-base\/?s={search_term_string}"},"query-input":"required name=search_term_string"}],"inLanguage":"en-US"},{"@type":"Organization","@id":"https:\/\/crocoblock.com\/knowledge-base\/#organization","name":"Help Center","url":"https:\/\/crocoblock.com\/knowledge-base\/","logo":{"@type":"ImageObject","inLanguage":"en-US","@id":"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/","url":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg","contentUrl":"https:\/\/crocoblock.com\/knowledge-base\/wp-content\/uploads\/2025\/04\/invert-crocoblock-logo.svg","caption":"Help Center"},"image":{"@id":"https:\/\/crocoblock.com\/knowledge-base\/#\/schema\/logo\/image\/"}},{"@type":"Question","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686198324","position":1,"url":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686198324","name":"Can the Booking Form be added outside the Single template?","answerCount":1,"acceptedAnswer":{"@type":"Answer","text":"Yes, you can place the <strong>Booking Form <\/strong>on any page or template. In this case, you can specify the <strong>Booking Instance ID <\/strong>manually in the widget settings.","inLanguage":"en-US"},"inLanguage":"en-US"},{"@type":"Question","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686275286","position":2,"url":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686275286","name":"Does the Booking Form require WooCommerce?","answerCount":1,"acceptedAnswer":{"@type":"Answer","text":"No, the <strong>Booking Form <\/strong>creates bookings directly via AJAX submission and does not require the <em>WooCommerce <\/em>functionality.","inLanguage":"en-US"},"inLanguage":"en-US"},{"@type":"Question","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686337379","position":3,"url":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686337379","name":"Can the Booking Form be used without JetFormBuilder?","answerCount":1,"acceptedAnswer":{"@type":"Answer","text":"Yes, the form works independently and can create bookings without <a href=\"https:\/\/jetformbuilder.com\/\" target=\"_blank\" rel=\"noreferrer noopener\"><em>JetFormBuilder<\/em><\/a><em> <\/em>forms.","inLanguage":"en-US"},"inLanguage":"en-US"},{"@type":"Question","@id":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686386034","position":4,"url":"https:\/\/crocoblock.com\/knowledge-base\/jetbooking\/creating-booking-form-for-room-reservation\/#faq-question-1781686386034","name":"What booking status is assigned after form submission?","answerCount":1,"acceptedAnswer":{"@type":"Answer","text":"Newly created bookings receive the \u201cPending\u201d status by default.","inLanguage":"en-US"},"inLanguage":"en-US"}]}},"_links":{"self":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article\/52018"}],"collection":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article"}],"about":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/types\/article"}],"author":[{"embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/users\/9"}],"wp:attachment":[{"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/media?parent=52018"}],"wp:term":[{"taxonomy":"builder-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/builder-category?post=52018"},{"taxonomy":"article-category","embeddable":true,"href":"https:\/\/crocoblock.com\/knowledge-base\/wp-json\/wp\/v2\/article-category?post=52018"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}