1. Home
  2. Marco HTML
  3. Reservation

Reservation

We created reservation page with intro section, page header and booking form. More information about intro section and page header you can find in “Elements” section.


Booking form structure

The reservation form is structured with date input, time input, party size input, contact form, message input and optionally image. If you want to have form without image, simply remove class “form-with-img”. To working form all you need to do is change email address in bf-send.php. The booking form has one look and isn’t editable.
 

...
   reservation.html

   BOOKING FORM
   <div class="reservation-container form-container form-with-img"> 
       <div class="reservation-form marco-form forms-style animate-text">
           <div class="booking-form">
	       <form name="bf-form" id="bf-form" action="bf-send.php" method="POST">
		   <input type="hidden" name="action" value="booking_request">
		   <fieldset class="reservation-details">
		       <div class="bf-text date bf-input mf-input">
			   <label for="bf_date">Date</label>
			   <input class="input-required" type="text" name="bf[date]" id="bf_date">
		       </div>
                   ...
   IMAGE FORM
   <div class="reservation-content">
       <div class="reservation-content-wrapper">
           <span class="img-wrapper">
	       <img src="image url" alt="Book a table"/>
	   </span>
	</div>
   </div>
   ...

   bf-send.php
   /////////////////////////////////////
   // Change this email address ////////
   $email = "yourmail@mail.com";

   /////////////////////////////////////
...
Was this article helpful to you? Yes No