contact.html 7.4 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155156157158159160161162163164165166167168169170171172
  1. {{ $ := .root }}
  2. {{ $st := .page }}
  3. {{ $autolink := default true $st.Params.content.autolink }}
  4. {{ $data := $st.Params.content }}
  5. {{ $form_provider := lower $st.Params.content.form.provider | default "" }}
  6. {{ $form_provider_legacy := $st.Params.email_form | default 0 }}
  7. {{ $use_netlify_form := eq $form_provider "netlify" | or (eq $form_provider_legacy 1) }}
  8. {{ $use_formspree_form := eq $form_provider "formspree" | or (eq $form_provider_legacy 2) }}
  9. {{ $use_form := or $use_netlify_form $use_formspree_form }}
  10. {{ $use_netlify_captcha := $st.Params.content.form.netlify.captcha | default true }}
  11. {{ $use_formspree_captcha := $st.Params.content.form.formspree.captcha | default false }}
  12. {{ $columns := $st.Params.design.columns | default "2" }}
  13. {{ if and $use_formspree_form $use_formspree_captcha }}
  14. <script src="https://www.google.com/recaptcha/api.js" async defer></script>
  15. {{ end }}
  16. <div class="col-12 {{if eq $columns "2"}}col-lg-8{{end}}">
  17. {{ with $st.Content }}{{ . }}{{ end }}
  18. {{ if $use_form }}
  19. {{ $post_action := "" }}
  20. {{ if $use_netlify_form }}
  21. {{ $post_action = "netlify" }}
  22. {{ else if $use_formspree_form }}
  23. {{ if not $st.Params.content.form.formspree.id }}
  24. {{ errorf "You have chosen to use Formspree as the provider for the contact form. Please set your Formspree Form ID in the Contact widget or disable the form.\nDocumentation: https://wowchemy.com/docs/widget/contact/" }}
  25. {{ end }}
  26. {{ if and $use_formspree_captcha (not $st.Params.content.form.formspree.captcha_key) }}
  27. {{ errorf "You have chosen to use reCAPTCHA for Formspree. Please set your Formspree CAPTCHA KEY in the Contact widget or disable reCAPTCHA.\nDocumentation: https://help.formspree.io/hc/en-us/articles/360022811154" }}
  28. {{ end }}
  29. {{ $post_action = printf "action=\"https://formspree.io/f/%s\"" $st.Params.content.form.formspree.id }}
  30. {{ end }}
  31. <div class="mb-3">
  32. <form name="contact" method="POST" {{ $post_action | safeHTMLAttr }} {{ if $use_netlify_form }}netlify-honeypot="_gotcha"{{ end }} {{ if $use_netlify_captcha }}data-netlify-recaptcha="true"{{ end }} {{ with $st.Params.content.form.netlify.success_url }}action="{{ . | relLangURL }}"{{ end }}>
  33. <div class="form-group form-inline">
  34. <label class="sr-only" for="inputName">{{ i18n "contact_name" }}</label>
  35. <input type="text" name="name" class="form-control w-100" id="inputName" placeholder="{{ i18n "contact_name" | default "Name" }}" required>
  36. </div>
  37. <div class="form-group form-inline">
  38. <label class="sr-only" for="inputEmail">{{ i18n "contact_email" }}</label>
  39. <input type="email" name="email" class="form-control w-100" id="inputEmail" placeholder="{{ i18n "contact_email" | default "Email" }}" required>
  40. </div>
  41. <div class="form-group">
  42. <label class="sr-only" for="inputMessage">{{ i18n "contact_message" }}</label>
  43. <textarea name="message" class="form-control" id="inputMessage" rows="5" placeholder="{{ i18n "contact_message" | default "Message" }}" required></textarea>
  44. </div>
  45. {{ if $st.Params.content.form.netlify.attachments }}
  46. <div class="form-group form-inline">
  47. <label class="sr-only" for="fileUpload">{{ i18n "contact_attachment" }}</label>
  48. <input type="file" name="file" class="form-control w-100" id="fileUpload" placeholder="{{ i18n "contact_attachment" | default "Attach file" }}">
  49. </div>
  50. {{ end }}
  51. <div class="d-none">
  52. <label>Do not fill this field unless you are a bot: <input name="_gotcha"></label>
  53. </div>
  54. {{ if and $use_netlify_form $use_netlify_captcha }}
  55. <div class="form-group" data-netlify-recaptcha="true"></div>
  56. {{ else if and $use_formspree_form $use_formspree_captcha }}
  57. <div class="g-recaptcha" data-sitekey="{{ $st.Params.content.form.formspree.captcha_key }}"></div>
  58. </br>
  59. {{ end }}
  60. <button type="submit" class="btn btn-primary px-3 py-2 w-100">{{ i18n "contact_send" | default "Send" }}</button>
  61. </form>
  62. </div>
  63. {{ end }}
  64. <ul class="fa-ul">
  65. {{ with $data.gnupg_key }}
  66. <li>
  67. <i class="fa-li fa fa-key fa-2x" aria-hidden="true"></i>
  68. <code>gpg --recv-keys {{ . }}</code>
  69. </li>
  70. {{ end }}
  71. {{ if $data.email }}
  72. <li>
  73. <i class="fa-li fas fa-envelope fa-2x" aria-hidden="true"></i>
  74. <span id="person-email">
  75. {{- if $autolink }}<a href="mailto:{{ $data.email }}">{{ $data.email }}</a>{{ else }}{{ $data.email }}{{ end -}}
  76. </span>
  77. </li>
  78. {{ end }}
  79. {{ with $data.phone }}
  80. <li>
  81. <i class="fa-li fas fa-phone fa-2x" aria-hidden="true"></i>
  82. <span id="person-telephone">
  83. {{- if $autolink }}<a href="tel:{{ . }}">{{ . }}</a>{{ else }}{{ . }}{{ end -}}
  84. </span>
  85. </li>
  86. {{ end }}
  87. {{ $addr_formatted := "" }}{{/* Scoping for maps. */}}
  88. {{ if $data.address.street | or $data.address.city | or $data.address.region | or $data.address.postcode | or $data.address.country }}
  89. {{ $addr_formatted = partial "functions/get_address" (dict "root" . "address" $data.address) }}
  90. <li>
  91. <i class="fa-li fas fa-map-marker fa-2x" aria-hidden="true"></i>
  92. <span id="person-address">{{$addr_formatted}}</span>
  93. </li>
  94. {{ end }}
  95. {{ with $data.directions }}
  96. <li>
  97. <i class="fa-li fas fa-compass fa-2x" aria-hidden="true"></i>
  98. <span>{{ . | markdownify | emojify }}</span>
  99. </li>
  100. {{ end }}
  101. {{ with $data.office_hours }}
  102. <li>
  103. <i class="fa-li fas fa-clock fa-2x" aria-hidden="true"></i>
  104. <span>
  105. {{- if not (reflect.IsSlice .)}}{{/* Support legacy string format. */}}
  106. {{- . | markdownify | emojify -}}
  107. {{else}}
  108. {{- delimit . "<br>" | markdownify | emojify -}}
  109. {{end -}}
  110. </span>
  111. </li>
  112. {{ end }}
  113. {{ with $data.appointment_url }}
  114. <li>
  115. <i class="fa-li fas fa-calendar-check fa-2x" aria-hidden="true"></i>
  116. <a href="{{ . }}" target="_blank" rel="noopener">{{ i18n "book_appointment" | default "Book an appointment" }}</a>
  117. </li>
  118. {{ end }}
  119. {{/* Contact links. */}}
  120. {{ range $data.contact_links }}
  121. {{ $pack := or .icon_pack "fas" }}
  122. {{ $pack_prefix := $pack }}
  123. {{ if in (slice "fab" "fas" "far" "fal") $pack }}
  124. {{ $pack_prefix = "fa" }}
  125. {{ end }}
  126. {{ $link := .link }}
  127. {{ $scheme := (urls.Parse $link).Scheme }}
  128. {{ $target := "" }}
  129. {{ if not $scheme }}
  130. {{ $link = .link | relLangURL }}
  131. {{ else if in (slice "http" "https") $scheme }}
  132. {{ $target = "target=\"_blank\" rel=\"noopener\"" }}
  133. {{ end }}
  134. <li>
  135. <i class="fa-li {{ $pack }} {{ $pack_prefix }}-{{ .icon }} fa-2x" aria-hidden="true"></i>
  136. <a href="{{ $link | safeURL }}" {{ $target | safeHTMLAttr }}>{{.name|markdownify|emojify|safeHTML}}</a>
  137. </li>
  138. {{ end }}
  139. </ul>
  140. {{ if and site.Params.features.map.provider $data.coordinates.latitude }}
  141. <div class="d-none">
  142. <input id="map-provider" value="{{ lower site.Params.features.map.provider }}">
  143. <input id="map-lat" value="{{ $data.coordinates.latitude }}">
  144. <input id="map-lng" value="{{ $data.coordinates.longitude }}">
  145. <input id="map-dir" value="{{ $addr_formatted }}">
  146. <input id="map-zoom" value="{{ site.Params.features.map.zoom | default "15" }}">
  147. <input id="map-api-key" value="{{ site.Params.features.map.api_key }}">
  148. </div>
  149. <div id="map"></div>
  150. {{ end }}
  151. </div>