Init

themes/agico-hugo/layouts/_default/contact.html

@@ -0,0 +1,100 @@
+{{ define "main" }}
+
+<!--
+<section class="section">
+  <div class="container">
+    <div class="row justify-content-between">
+      {{ with site.Params.google_map }}
+      {{ if .enable }}
+      <div class="col-lg-8 mb-5 mb-lg-0 overflow-hidden">
+        <iframe class="rounded-3" style="min-height:100%;width:100%;" frameborder="0" src="{{.embed_url}}"></iframe>
+      </div>
+      {{ end }}
+      {{ end }}
+      
+      <div class="col-lg-4">
+        <div class="p-5 rounded-xs shadow">
+          <h3 class="text-dark border-bottom mb-5 pb-4">{{ i18n "keep_in_touch" }}</h3>
+          <ul class="list-unstyled">
+            {{ with site.Params.contact_info.mobile }}
+            <li class="d-flex mb-4" data-aos="fade-up" data-aos-delay="100">
+              <i class="fa fa-phone icon-primary"></i>
+              <div class="ps-3">
+                <h6 class="text-dark">Mobile</h6>
+                <p>{{ . | markdownify }}</p>
+              </div>
+            </li>
+            {{ end }}
+
+            {{ with site.Params.contact_info.email }}
+            <li class="d-flex mb-4" data-aos="fade-up" data-aos-delay="100">
+              <i class="fas fa-envelope icon-primary"></i>
+              <div class="ps-3">
+                <h6 class="text-dark">Email</h6>
+                <div class="content">{{ . | markdownify }}</div>
+              </div>
+            </li>
+            {{ end }}
+
+            {{ with site.Params.contact_info.address }}
+            <li class="d-flex mb-4" data-aos="fade-up" data-aos-delay="100">
+              <i class="fas fa-map icon-primary"></i>
+              <div class="ps-3">
+                <h6 class="text-dark">Address</h6>
+                <p>{{ . | markdownify }}</p>
+              </div>
+            </li>
+            {{end }}
+          </ul>
+        </div>
+      </div>
+    </div>
+  </div>
+</section>
+-->
+
+<section class="section section-lg-bottom bg-light">
+  <div class="container text-center">
+    <div class="row text-center">
+      <div class="col-lg-8 mx-auto text-center">
+        <form id="leadcapture-form" class="row">
+          <div class="col-lg-6">
+            <input type="text" name="firstName" class="form-control mb-4" placeholder="Voornaam">
+          </div>
+          <div class="col-lg-6">
+            <input type="text" name="lastName" class="form-control mb-4" placeholder="Achternaam *" required>
+          </div>
+          <div class="col-lg-6">
+            <input type="email" name="emailAddress" class="form-control mb-4" placeholder="E-mail *" required>
+          </div>
+          <div class="col-lg-6">
+            <input type="text" name="phoneNumber" class="form-control mb-4" placeholder="Telefoon">
+          </div>
+          <div class="col-lg-12">
+            <textarea name="description" class="form-control mb-4" placeholder="Bericht *" required></textarea>
+          </div>
+
+          <div style="position:absolute;left:-9999px;top:auto;width:1px;height:1px;overflow:hidden;">
+            <label for="company">Bedrijfsnaam</label>
+            <input type="text" id="company" name="company" tabindex="-1" autocomplete="off">
+          </div>
+
+          <div class="col-12">
+            <button type="submit" class="btn btn-primary">{{ i18n "submit_now"}}</button>
+          </div>
+
+          <div class="col-12 mt-2">
+            <p id="leadcapture-status" class="text-success" hidden>Bedankt! We nemen zo spoedig mogelijk contact op.</p>
+            <p id="leadcapture-error" class="text-danger" hidden>Er ging iets mis. Probeer het opnieuw.</p>
+          </div>
+        </form>
+      </div>
+    </div>
+  </div>
+</section>
+
+{{ if site.Params.google_map.enable }}
+<script src="https://maps.googleapis.com/maps/api/js?key={{site.Params.google_map.gmap_api}}&libraries=places"></script>
+{{ end }}
+
+{{ end }}