Clone
---
title: Contact
handle: contact
slug: contact
listed: true
published: true
is_layout: false
editable_elements:
"main/heading": "Contact a Real Person, Who Really Cares."
"main/content": "Whether you are ready to get start or still have some questions, feel free to reach out, and we'll assist you anyway we can."
---
{% extends 'layouts/page' %}
{% block 'main' %}
{% include 'page_header' %}
<section class="row page {{ page.slug }}">
<div class="column medium-10 large-8 small-centered">
<div class="callout">
<h2 class="text-center">{% editable_text "heading", line_break: false, format: 'raw', rows: 1 %}Heading{% endeditable_text %}</h2>
{% editable_text content %}Lorem ipsum{% endeditable_text %}
<hr>
<div class="row">
<div class="column medium-6">
<p>
<strong>Phone:</strong> {% include 'phone_number' %}<br>
<strong>Email:</strong> {% include 'email_address' %}<br>
</p>
<p>
<strong>Addresss:</strong><br>
{% include 'formatted_address' %}<br>
</p>
<p>
{% include 'hours' %}
</p>
<p class="thin"><strong>Come visit our Showroom</strong></p>
<div class="responsive-embed square">
<iframe width="600" height="600" frameborder="0" style="border:0"
src="https://www.google.com/maps/embed/v1/place?q=place_id:ChIJS5ln69CSGYgR6Ls63nwIXUw&key=AIzaSyA0ffMEjozfU9dLu6LV1okQqylnrGHCSok" allowfullscreen>
</iframe>
</div>
</div>
<div class="column medium-6">
{% model_form 'customer_messages', success: '/confirmations/contact', error: '/contact', id: 'contact-form' %}
{% if customer_message.errors %}
<p>The following errors occured:</p>
<ul>
{% for error in customer_message.errors %}
<li>{{error[0] | capitalize}} - {{error[1]}}</li>
{% endfor %}
</ul>
{% endif %}
<input id="captcha" name="content[captcha]" type="hidden">
<label>
Full Name:{% include 'required' %}
<input name="content[name]" required="true" type="text" value="{{customer_message.name}}">
</label>
<label>
Best Email:{% include 'required' %}
<input name="content[email]" required="true" type="email" value="{{customer_message.email}}">
</label>
<label>
Your Phone:{% include 'required' %}
<input name="content[phone]" required="true" type="tel" value="{{customer_message.phone}}">
</label>
<label>
<strong>Address:</strong>{% include 'required' %}
<input class="thin" name="content[address]" required type="text" value="{{project_request.address}}">
<fieldset class="row collapse">
<div class="column small-6">
<label>
City:{% include 'required' %}
<input name="content[city]" required type="text" value="{{project_request.address}}">
</label>
</div>
<div class="column small-2">
<label>
State:{% include 'required' %}
<input name="content[state]" required type="text" value="{{project_request.address}}">
</label>
</div>
<div class="column small-4">
<label>
Zip:{% include 'required' %}
<input name="content[zip]" required type="text" value="{{project_request.address}}">
</label>
</div>
</fieldset>
</label>
<label>
Message:{% include 'required' %}
<textarea name="content[message]" rows="4" required="true" >{{customer_message.message}}</textarea>
</label>
</tr>
</table>
<div class="robot-warning hide callout text-center warning">
Are you robot?
</div>
<div class="callout g-recaptcha text-center" data-sitekey="6LdbaUwUAAAAAFPucKMnLxCnYvIPBr3UQNOLYCE2"></div>
<input type="submit" class="button expanded">
{% endmodel_form %}
</div>
<hr>
</div>
<strong>Testimonial: </strong>
{% include 'random_testimonial' %}
</div>
</div>
</div>
</section>
{% endblock %}
{% block body_bottom %}
<script type="text/javascript">
$(function() {
$('#contact-form').on('submit', function(e) {
var form = $(this);
$('.robot-warning').addClass('hide')
if (grecaptcha.getResponse() == "") {
e.preventDefault();
$('.robot-warning').removeClass('hide')
} else if (grecaptcha.getResponse().length > 250) {
$('input#captcha').val(grecaptcha.getResponse())
}
});
});
</script>
{% endblock %}