Contact Form 7 – Ẩn form khi gửi thành công (chỉ hiển thị thông báo thành công)
Đây lại là 1 mẹo nhỏ liên quan đến plugin Contact Form 7, với hướng dẫn nhanh dưới đây khi người dùng click vào button gửi thông tin liên hệ … thì form sẽ được ẩn đi, tất nhiên trường hợp nhập thiếu thông tin hoặc gặp vấn đề gì đó thì form vẫn hiển thị thông báo như bình thường.
Ẩn Contact Form 7 khi gửi đi thành công (chỉ hiển thị thông báo thành công)
Bạn có thể thêm 1 đoạn js nhỏ dưới đây để ẩn Contact Form 7 khi form đã được gửi đi thành công (chỉ hiển thị thông báo thành công và ẩn form nhập thông tin)
<script>
document.addEventListener( 'wpcf7mailsent', function( event ) {
document.querySelectorAll("form.wpcf7-form > :not(.wpcf7-response-output)").forEach(el => {
el.style.display = 'none';
});
}, false );
</script>
Đây là đoạn code trên bạn có thể thêm vào dưới phần form ngay trong phần setting form contact form 7 luôn nhé hoặc thêm vào footer của website đều được nhé.
Vậy là xong, chúc thành công.
Nếu có thắc mắc có thể liên hệ với tôi qua zalo số: 0868017791
Bạn có thể cập nhật các tin tức mới qua zalo hoặc fanpage Vũ Trụ Số.
Xin cảm ơn.
Nếu bạn thấy bài viết có ích hãy sao chép link và chia sẻ bài viết
Đã copy
Bài viết liên quan
