Как повесить класс в Contact form-7?

Question

[DanilChekh]

Плддскажите есть форма и в ней есть сабмит,если я на него вешаю свой класс то форма анимируется как надо но сообщения не отправляет,а если не вешаю то отправляет,но мой попап не выводится,как мне и класс повесить и чтоб функционал работал?
[submit ] так работает а если так [submit class:run99] то сообщения не отправляет

Comments

[Mr Crabbz]

ссылку

[DanilChekh]

Краб Анархист, unionsv.net я уже и по другому пробую как то так ничего не получается
if(location.hash == '#wpcf7-f251-o2') {
$('.thanks').css('display','block');
setTimeout(function(){
$('.thanks').css('display','none')
}, 3000);
}

[DanilChekh]

Краб Анархист, внизу верстки блок спасибо,если вручную ему дисплей отменить то он показывается,но я не знаю как сделать чтобы после отправки формы.сайт от старого разработчика,очень сложно вникнуть

[Mr Crabbz]

DanilChekh, без ссылки на живой пример консоль работает только у экстрасенсов.

[DanilChekh]

Краб Анархист, unionsv.net вот это ссылка на сайт а форма справа вверху,она работает но хочу чтобы после отправки блок показывался,но не не знаю как

[DanilChekh]

Краб Анархист, я если в контакт формах класс присваиваю кнопке сабмит то анимация работает,но тогда сообщение не приходит на почту

Answer 1

[Mr Crabbz]

в файл /wp-content/themes/union/functions.php
добавить:

add_action( 'wp_footer', 'customcf7event', 9999);
 
function customcf7event() {
  // https://toster.ru/q/479293
?>
<script type="text/javascript">
$(document).on('wpcf7mailsent', function(){
  $(".thnks").fadeIn();
});
</script>
<?php
}

ЛИБО в файл /wp-content/themes/union/footer.php
ПЕРЕД закрывающим тегом < /body >
добавить:

<script type="text/javascript">
$(document).on('wpcf7mailsent', function(){
  $(".thnks").fadeIn();
});
</script>

Ну и прежде чем задавать вопросы - попробуйте сначала гуглить. https://contactform7.com/2017/06/07/on-sent-ok-is-...

Comments

[DanilChekh]

там что-то старый исполнитель переопределял,я так уже пробывал,не подскажите может можно просто на странице с якорем формы блок спасибо на 3 секунды сделать?Изменить его дисплей;none на block а потом убрать? скрипт похожий подсказали,но я не знаю как сделать его рабочим,вставлял в main.js не работает что то типо такого
if(location.hash == '#wpcf7-f251-o2') {
$('.thanks').css('display','block');
setTimeout(function(){
$('.thanks').css('display','none')
}, 3000);
}
Может,вы подскажите как такое реализовать и куда его записать?

[Mr Crabbz]

DanilChekh, у вас, во-первых, элемент имеет класс не thanks а thnks (опечатка видимо). Во-вторых - ну поправьте мой скрипт:

<script type="text/javascript">
$(document).on('wpcf7mailsent', function(){
  $(".thnks").fadeIn();
  setTimeout(function(){
  $(".thnks").fadeOut();
  }, 3000);
});
</script>

[DanilChekh]

<div class="run99"></div>
<div class="thnks">
	<h2>Благодарим Вас за желание сотрудничать с нами! Наш менеджер свяжется с Вами в самое ближайшее время!</h2>
</div>
    <script type="text/javascript">
        document.addEventListener( 'wpcf7mailsent', function( event ) {
            $('.run99').click();
        }, false );
    </script>

Подсажите а куда этот скрипт вписать?предыдущий разработчик в шаблон html вот такое вписал

[DanilChekh]

Краб Анархист, а в js файл вот такое

$('.run99').click(function (e) {
        e.preventDefault();
        $('.thnks').fadeIn();
        $('.overlay').fadeIn();
        $('.popup').fadeOut();
        function explode(){
            $('.thnks').fadeOut();
            $('.overlay').fadeOut();
        }
        setTimeout(explode, 3500);
    });

[DanilChekh]

Краб Анархист, почему событие wpcf7mailsent не срабатыват?но ведь письма на почту приходят