Contact Form 7: Ocultar formulario después del envío

Esta semana se ha dado el caso de varias personas que no estaban seguras de si un formulario de contact form 7 se había enviado correctamente, aunque debajo del mismo aparezca el mensaje que les informa del envío correcto.

Una solución es hacer que el formulario desaparezca si se ha enviado correctamente. En Stackoverflow hay varias hilos sobre el tema, pero ninguna solución definitiva. No obstante el hilo «How can I hide the contact form and shows “sent!” after successful sending» nos dio la pista de como conseguirlo.

Y es bastante sencillo.

Cómo ocultar el formulario de Contact Form 7 después del envío

En la parte de diseño del formulario de contacto englobamos el mismo en un DIV, el cual ocultamos si el envío se ha realizado correctamente.

Contact form 7: DIV que engloba el formulario

Por tanto en la parte de diseño del formulario hay que añadir al principio:

<div id="formulariocontacto">

y al final:

</div>

Y luego en los ajustes adicionales (junto al código para el seguimiento de las conversiones en Google Analytics y el píxel de Facebook)

Contact form 7: Ocultar el DIV que engloba el formulario si el envío es OK

añadir:

on_sent_ok: "document.getElementById('formulariocontacto').style.display = 'none';"

Así cada vez que se produzca un envío correcto del formulario, este se oculta:

Contact form 7: Envío OK

Sencillo si se sabe como hacerlo, ¿no?

2 comentarios en “Contact Form 7: Ocultar formulario después del envío

Deja una respuesta

Tu dirección de correo electrónico no será publicada. Los campos obligatorios están marcados con *

Los comentarios de esta página se procesan por un sistema automático de moderación por lo cual no siempre se publican de forma instantánea. Por favor respeta a los demás y ciñete al tema del post. Nos reservamos el derecho de eliminar cualquier comentario o enlace que nos parezca inadecuado o tenga una expresión de grosería, insulto, odio, hostilidad o negatividad.

Este sitio usa Akismet para reducir el spam. Aprende cómo se procesan los datos de tus comentarios.