Contact Form Setup

Overflow comes with integrated support for the Contact Form 7 plugin:

Appointment Form

<div class="row mt-none-30">
<div class="col-xl-4 col-lg-6 mt-30">
<div class="form-group">
<label for="name"><i class="fal fa-user"></i></label> [text yname id:name placeholder "Enter
your name"]
</div>
</div>
<div class="col-xl-4 col-lg-6 mt-30">
<div class="form-group">
<label for="email"><i class="fal fa-envelope"></i></label>[email yemail id:email placeholder
"Enter your email"]
</div>
</div>
<div class="col-xl-4 col-lg-6 mt-30">
<div class="form-group">
<label for="tel"><i class="fal fa-phone"></i></label>[text yphone id:tel placeholder "Enter your
phone"]
</div>
</div>
<div class="col-xl-4 col-lg-6 mt-30">
<div class="form-group">
<label for="address"><i class="fal fa-map-marker"></i></label>[text yaddress id:address
placeholder "Office/Property address"]
</div>
</div>
<div class="col-xl-4 col-lg-6 mt-30">
<div class="form-group">
<label for="cat"><i class="fal fa-arrow-down"></i></label>[text ycat id:cat placeholder "Select
Category"]
</div>
</div>
<div class="col-xl-4 col-lg-6 mt-30">
<div class="form-group">
<label for="date"><i class="fal fa-calendar-alt"></i></label>[date ydate id:date placeholder
"date"]
</div>
</div>
</div>
<div class="row justify-content-center">
<div class="col-xl-4 col-lg-6 mt-30 text-center">
<button type="submit" class="site-btn">Confirm Appointment <span class="icon yellow"><i class="fal
fa-calendar-alt"></i></span></button>
</div>
</div>

Appointment BG

<div class="form-group mt-10">
<label for="name"><i class="fal fa-user"></i></label>[text yname id:name placeholder "Enter your
name"]
</div>
<div class="form-group mt-10">
<label for="mail"><i class="fal fa-envelope"></i></label>[email yemail id:mail placeholder
"Enter your email"]
</div>
<div class="from-group-wrapper mt-10">
<div class="form-group">
<label for="date"><i class="fal fa-calendar-alt"></i></label>[date ydate id:date placeholder
"date"]
</div>
<div class="form-group">
[select Subject include_blank "Subject" "Body Surgery" "Dental Care" "Neurology Sargery" "Blood Cancer"]
</div>
</div>
<div class="form-group mt-10">
[submit class:site-btn "Submit Request"]
</div>
                            

Contact Page Form

<div class="form-group mt-10">
<label for="name"><i class="fal fa-user"></i></label>[text yname id:name placeholder "Enter your
name"]
</div>
<div class="form-group mt-10">
<label for="mail"><i class="fal fa-envelope"></i></label>[email yemail id:mail placeholder
"Enter your email"]
</div>
<div class="from-group-wrapper mt-10">
<div class="form-group">
<label for="date"><i class="fal fa-calendar-alt"></i></label>[date ydate id:date placeholder
"date"]
</div>
<div class="form-group">
[select Subject include_blank "Subject" "Home Cleaning" "Window Cleaning" "Road Cleaning"]
</div>
</div>
<div class="form-group mt-10">
[submit class:site-btn "Submit Request"]
</div>
                            

Call To Action

<div class="form-group mt-10">
<label for="name"><i class="fal fa-user"></i></label>[text ct-name id:name placeholder "Enter
your name"]
</div>
<div class="form-group mt-10">
<label for="email"><i class="fal fa-envelope"></i></label>[email ct-email id:email placeholder
"Enter your email"]
</div>
<div class="from-group-wrapper mt-10">
<div class="form-group">
<label for="date"><i class="fal fa-calendar-alt"></i></label>[date ct-date id:date "date"]
</div>
<div class="form-group">
[select ct-select "Subject" "Services" "Cleaning" "Office Cleaning"]
</div>
</div>
<div class="form-group mt-10">
[submit class:site-btn class:boxed "Submit Request"]
</div>
                            

Emmergency Call

<div class="form-group mt-10">
<label for="name"><i class="fal fa-user"></i></label>[text ec-name id:name placeholder "Enter
your name"]
</div>
<div class="form-group mt-10">
<label for="email"><i class="fal fa-envelope"></i></label>[email ec-email id:email placeholder
"Enter your email"]
</div>
<div class="from-group-wrapper mt-10">
<div class="form-group">
<label for="date"><i class="fal fa-calendar-alt"></i></label>[date ec-date id:date "date"]
</div>
<div class="form-group">
[select ec-select "Subject" "Services" "Cleaning" "Home Cleaning" "Car Cleaning"]
</div>
</div>
<div class="form-group mt-10">
[submit class:site-btn class:boxed "Submit Request"]
</div>

Sidebar Contact

<div class="form-group mt-10">
<label for="text"><i class="fal fa-user"></i></label>[text s-name placeholder "Enter your name"]
</div>
<div class="form-group mt-10">
<label for="email"><i class="fal fa-envelope"></i></label>[email s-email placeholder "Enter your
email"]
</div>
<div class="form-group mt-10">
<label for="message"><i class="fal fa-edit"></i></label>[textarea s-textarea placeholder "Enter
your message"]
</div>
<div class="form-group mt-10">
[submit class:site-btn class:boxed "Submit Request"]
</div>