454x
3 years ago in HTML
<div class="elementor-column-wrap elementor-element-populated">
<div class="elementor-widget-wrap">
<div class="elementor-element elementor-element-0aa41cc elementor-widget elementor-widget-menu-anchor" data-id="0aa41cc" data-element_type="widget" data-widget_type="menu-anchor.default">
<div class="elementor-widget-container">
<div id="agenda" class="elementor-menu-anchor"></div>
</div>
</div>
<div class="elementor-element elementor-element-320e62d elementor-widget elementor-widget-heading" data-id="320e62d" data-element_type="widget" data-widget_type="heading.default">
<div class="elementor-widget-container">
<h2 class="elementor-heading-title elementor-size-default">Agende agora</h2> </div>
</div>
<div class="elementor-element elementor-element-9f84888 elementor-widget-divider--view-line elementor-widget elementor-widget-divider" data-id="9f84888" data-element_type="widget" data-widget_type="divider.default">
<div class="elementor-widget-container">
<div class="elementor-divider">
<span class="elementor-divider-separator">
</span>
</div>
</div>
</div>
<div class="elementor-element elementor-element-590ce83 elementor-widget elementor-widget-text-editor" data-id="590ce83" data-element_type="widget" data-widget_type="text-editor.default">
<div class="elementor-widget-container">
<div class="elementor-text-editor elementor-clearfix"><p>Preencha todos os campos abaixo com os dados necessários e clique em “AGENDAR AGORA”. Você será redirecionado para o nosso WhatsApp onde poderá confirmar seu dia e horário.</p></div>
</div>
</div>
<div class="elementor-element elementor-element-573c149 wpp-form elementor-widget elementor-widget-html" data-id="573c149" data-element_type="widget" data-widget_type="html.default">
<div class="elementor-widget-container">
<script>
function wppHandler ( event )
{
event.preventDefault();
const form = event.target
let msg = "Olá! Estou interessado nos serviços do site seubarbeiro.com.br. Seguem meus dados:\n"
for ( let i = 0; i < 6; i++ )
{
if ( form[i].name == "Data")
{
const date = form[i].value.split("-").reverse().join("/")
msg += [ form[i].name,": ",date, "\n" ].join("")
}
else
{
msg += [ form[i].name,": ",form[i].value, "\n" ].join("")
}
}
msg += "\nPodemos confirmar esse serviço nesse local, data e hora?\n"
const wppMsg = encodeURI( msg )
window.location = "https://api.whatsapp.com/send?phone=5521998738340&text=" + wppMsg;
return false;
}
</script>
<form onsubmit="return wppHandler(event)" method="POST">
<div>
<label>
<div>Nome e Sobrenome</div>
<input type="text" name="Nome e sobrenome" title="Seu nome" required="">
</label>
</div>
<div>
<label>
<div>Endereço Completo</div>
<input type="text" name="Endereço completo" required="" title="Endereço completo">
</label>
</div>
<div>
<label>
<div>Serviço desejado</div>
<select name="Serviço Desejado" required="" title="Serviço desejado">
<option value="Barba">Apenas barba (R$15,00)</option>
<option value="Corte">Apenas corte (R$25,00)</option>
<option value="Completo">Corte e barba (R$35,00)</option>
</select>
</label>
</div>
<div>
<label>
<div>Quantidade de Pessoas</div>
<input type="number" name="Quantidade de Pessoas" required="" title="Quantidade de Pessoas" value="1" min="1" max="5">
</label>
</div>
<div>
<label>
<div>Data</div>
<input type="date" name="Data" required="" title="Data desejada">
</label>
</div>
<div>
<label>
<div>Horário</div>
<select name="Horário" required="" title="Horário de preferência">
<option value="12:00">12:00</option>
<option value="13:00">13:00</option>
<option value="14:00">14:00</option>
<option value="15:00">15:00</option>
<option value="16:00">16:00</option>
<option value="17:00">17:00</option>
<option value="18:00">18:00</option>
<option value="19:00">19:00</option>
<option value="20:00">20:00</option>
</select>
</label>
</div>
<div>
<button>
<i class="fab fa-whatsapp"></i>
<span>
Agendar agora!
</span>
</button>
</div>
</form> </div>
</div>
</div>
</div>