> For the complete documentation index, see [llms.txt](https://ova-themes.gitbook.io/qichen/llms.txt). Markdown versions of documentation pages are available by appending `.md` to page URLs; this page is available as [Markdown](https://ova-themes.gitbook.io/qichen/contact-form.md).

# Contact Form

## 1: Contact Us

<figure><img src="/files/3IYxs08MeZl5YyRnRzhE" alt=""><figcaption></figcaption></figure>

Code Form

```
<div class="ova-ctform7">
  <div class="form-contact-us">

     <div class="two-column">
        <div class="name-info ova_wrap_input">
           [text* fullname placeholder "Name"]
        </div>
        <div class="email ova_wrap_input">
           [email* your-email placeholder "Email Adress"]
        </div>
     </div>

     <div class="two-column">
        <div class="phone ova_wrap_input">
           [tel* your-phone placeholder "Phone Number"]
        </div>
        <div class="website ova_wrap_input">
           [text* your-website placeholder "Website"]
        </div>
     </div>

     <div class="message ova_wrap_input">
        [textarea your-message placeholder "Write Message"]
     </div>

     <div class="ova-submit">
       [submit placeholder  "Send Us Message"]
     </div>
 </div>
</div>
```

## 2: Reservation

<figure><img src="/files/JQ81rtughCBL01ylZt7j" alt=""><figcaption></figcaption></figure>

Code form

```
<div class="ova-ctform7 reservation-page">
  <div class="form-contact-us">
     <div class="two-column">
        <div class="quantity-person ova_wrap_input">
            [select* your-person placeholder "Persons" "2" "4" "8" "12"]
           <i aria-hidden="true" class="flaticon2 flaticon2-user"></i>
        </div>
        <div class="phone ova_wrap_input">
           [tel* your-phone placeholder "Phone No"]
           <i aria-hidden="true" class="flaticon2 flaticon2-out-call"></i>
        </div>
     </div>

     <div class="two-column">
        <div class="date ova_wrap_input">
           [date* date "today"]
           <i aria-hidden="true" class="flaticon2 flaticon2-calendar-date"></i>
        </div>
        <div class="time ova_wrap_input">
            [select* time  "Reservation Time" "10:00" "11:00" "11:30" "18:00" "19:00" "19:30"]
            <i aria-hidden="true" class="flaticon2 flaticon2-wall-clock"></i>
        </div>
     </div>
     <div class="message ova_wrap_input">
           [text* your-name placeholder "Name"]
           <i aria-hidden="true" class="flaticon2 flaticon2-user"></i>
     </div>
     <div class="email ova_wrap_input">
           [email* email placeholder "Email"]
           <i aria-hidden="true" class="ovaicon ovaicon-comment-1"></i>
     </div>
     <div class="message ova_wrap_input">
           [textarea your-message placeholder "Comment"]
           <i aria-hidden="true" class="ovaicon ovaicon-edit"></i>
     </div>
     <div class="ova-submit">
       [submit placeholder  "Book A Table"]
     </div>
 </div>
</div>
```

## 3: Home-Fastfood

<figure><img src="/files/3wotYK6TyUOzqXKEpgXN" alt=""><figcaption></figcaption></figure>

Code form

```
<div class="ova-ctform7 home-fastfood">
  <div class="form-contact-us">
        <div class="quantity-person ova_wrap_input">
           [select* your-person placeholder "Persons" "2" "4" "8" "12"]
           <i aria-hidden="true" class="flaticon2 flaticon2-user"></i>
        </div>
        <div class="date ova_wrap_input">
           [date* date "today"]
           <i aria-hidden="true" class="flaticon2 flaticon2-calendar-date"></i>
        </div>
        <div class="time ova_wrap_input">
           [select* time placeholder "Reservation Time" "10:00" "11:00" "11:30" "18:00" "19:00" "19:30"]
           <i aria-hidden="true" class="flaticon2 flaticon2-wall-clock"></i>
        </div>
        <div class="your-name ova_wrap_input">
           [text* your-name placeholder "Name"]
           <i aria-hidden="true" class="flaticon2 flaticon2-user"></i>
        </div>
        <div class="email ova_wrap_input">
           [email* email placeholder "Email"]
           <i aria-hidden="true" class="ovaicon ovaicon-comment-1"></i>
        </div>
        <div class="phone ova_wrap_input">
           [tel* your-phone placeholder "Phone No"]
           <i aria-hidden="true" class="flaticon2 flaticon2-out-call"></i>
        </div>
 </div>
 <div class="ova-submit">
     [submit placeholder  "Book A Table"]
 </div>
</div>
```

## 4: Home-Restaurant

<figure><img src="/files/VoQzoLBG38sX3834o1tx" alt=""><figcaption></figcaption></figure>

Code Form

```
<div class="ova-ctform7 home-restaurant">
  <div class="form-contact-us">
     <div class="ova_wrap_input">
        [text* name placeholder "Name"]
        <i aria-hidden="true" class="flaticon2 flaticon2-user"></i>
     </div>
     <div class="quantity-person ova_wrap_input">
        [select* your-person placeholder "Persons" "2" "4" "8" "12"]
        <i aria-hidden="true" class="flaticon2 flaticon2-user"></i>
     </div>
     <div class="date ova_wrap_input">
        [date* date "today"]
        <i aria-hidden="true" class="flaticon2 flaticon2-calendar-date"></i>
     </div>
     <div class="email ova_wrap_input">
           [email* email placeholder "Email"]
           <i aria-hidden="true" class="ovaicon ovaicon-comment-1"></i>
     </div>
     <div class="time ova_wrap_input">
        [select* time placeholder "Reservation Time" "10:00" "11:00" "11:30" "18:00" "19:00" "19:30"]
        <i aria-hidden="true" class="flaticon2 flaticon2-wall-clock"></i>
     </div>
     <div class="ova-submit">
       [submit placeholder  "Book A Table"]
     </div>
 </div>
</div>
```

## 5:Menu-Seafood

<figure><img src="/files/vZ9F3p9RfX54DDb2MuKX" alt=""><figcaption></figcaption></figure>

Code Form

```
<div class="ova-ctform7 menu-fastfood-page">
  <div class="form-contact-us">
     <div class="two-column">
        <div class="quantity-person ova_wrap_input">
           [select* your-person placeholder "Persons" "2" "4" "8" "12"]
           <i aria-hidden="true" class="flaticon2 flaticon2-user"></i>
        </div>
        <div class="phone ova_wrap_input">
           [tel* your-phone placeholder "Phone No"]
           <i aria-hidden="true" class="flaticon2 flaticon2-out-call"></i>
        </div>
     </div>

     <div class="two-column">
        <div class="date ova_wrap_input">
           [date* date "today"]
           <i aria-hidden="true" class="flaticon2 flaticon2-calendar-date"></i>
        </div>
        <div class="time ova_wrap_input">
            [select* time placeholder "Reservation Time" "10:00" "11:00" "11:30" "18:00" "19:00" "19:30"]
            <i aria-hidden="true" class="flaticon2 flaticon2-wall-clock"></i>
        </div>
     </div>
     <div class="message ova_wrap_input">
           [text* your-name placeholder "Name"]
           <i aria-hidden="true" class="flaticon2 flaticon2-user"></i>
     </div>
     <div class="email ova_wrap_input">
           [email* email placeholder "Email"]
           <i aria-hidden="true" class="ovaicon ovaicon-comment-1"></i>
     </div>
     
     <div class="ova-submit">
       [submit placeholder  "Book A Table"]
     </div>
 </div>
</div>
```