En este tutorial, te mostraré paso a paso cómo enviar correctamente un formulario utilizando Elementor, acompañado de una nota de audio para confirmar el correcto envio del formulario. Aprenderás a configurar tus formularios de manera eficiente, asegurando que cada envío sea exitoso y recibas toda la información necesaria. Si quieres mejorar la funcionalidad de tu sitio web y optimizar la experiencia del usuario, este tutorial es para ti.
Convierte tu texto a audio desde este enlace.
Inserta el widget de formulario y añade las siguientes ID al formulario y Botón:
-ID del formulario: form_con_audio
-ID del botón: mi-sonido
Ahora solo necesitarás modificar en la linea 13 del código la url de tu audio personalizado.
<script type="text/javascript">
document.addEventListener('DOMContentLoaded', function() {
var form = document.querySelector('.elementor-form');
if (!form) {
console.error('No se encontró el formulario de Elementor.');
return;
}
var submitButton = form.querySelector('.elementor-button[type="submit"]');
if (!submitButton) {
console.error('No se encontró el botón de enviar dentro del formulario de Elementor.');
return;
}
var audio = new Audio('URL-DE-TU-AUDIO-PERSONALIZADO');
form.addEventListener('submit', function(event) {
event.preventDefault();
if (form.checkValidity()) {
audio.play();
} else {
console.log('Por favor completa todos los campos obligatorios.');
}
});
});
</script>
