Contact form 7 + popup почему перегружается страница?

Приветствую!
У меня такая проблема: создала стандартное модальное окно посредством bootstrap, вставила туда форму плагина contact form 7, работает плагин отлично, НО! если к примеру форма не заполнена, и нажать кнопку "отправить" он перегружает страницу, как бы переходя на ссылку http://ссылка_сайта.ru/#wpcf7-f159-o3, при этом модальное окно закрывается, при повторном вызове всплывает окно с формой и там уже сообщения об ошибках заполнения и тд. То есть, мне нужно, чтоб все сообщения(в т.ч. и об удачной отправке) появлялись в модальном окне без перегрузки страницы.
Помогите пожалуйста с решением, все перерыла, такой проблемы нигде нет(((
  • Вопрос задан
  • 10431 просмотр
Пригласить эксперта
Ответы на вопрос 8
@artegion
Думаю многим будет полезно! Данная проблема чаще всего происходит, когда вы начинаете с нуля создавать шаблон, в итоге в footer забываете размещать:
<?php wp_footer(); ?>
Который непосредственно подгружает .js плагинов!
Ну и разместить желательно его повыше в самом footer.php, но ниже вывода jquery!
(протестировать данную вероятность так же можно подгрузив другой шаблон)
Протестировано на:
WP Версия 4.8.3;
Библиотека jquery 1.12.4;
Contact Form 7 Версия 4.9.1;

Лайк, если помог!
Ответ написан
@sofia_karroll
Нашла святого человека
в шапку добавь wp_head() если не помогает, то в wp-config добавь define ('WPCF7_LOAD_JS', true или false );

или вообще можно принудительно прописать в шапку:
<script type='text/javascript' src='/wp-content/plugins/contact-form-7/includes/js/jquery.form.min.js?ver=твоя версия скрипта'></script>
<script type='text/javascript'>
/* <![CDATA[ */
var _wpcf7 = {"loaderUrl":"\/wp-content\/plugins\/contact-form-7\/images\/ajax-loader.gif","sending":"Sending ..."};
/* ]]> */
</script>
<script type='text/javascript' src='/wp-content/plugins/contact-form-7/includes/js/scripts.js?ver=твоя версия скрипта'></script>


Это не мой ответ, но у меня это сработало. Нашла ответ этого святого человека здесь

Я так поняла, что подобная проблема возникает, когда сам пытаешься написать шаблон. Мысль пришла, когда проверила работу contact form 7 на обычной теме из предложенных WP
Ответ написан
@big_hasan
Столкнулся с похожей проблемой. Опишу её решение здесь.
В бесплатной теме Travel Company от Scorpionthemes так же перезагружалась страница (ошибка 404 со ссылкой на /mail/mail.php) при попытке отправить сообщение через контактную форму. Дело было в том, что в шаблоне страницы контактной формы (contact.php) вывод контактной формы был обёрнут в еще один тэг <form>. Нужно его заменить на <div class="form"> чтобы сохранить внешний вид.
P.S.: все лежит на поверхности, но вдруг кому-то это поможет сэкономить время
Ответ написан
svarnoy85
@svarnoy85
Столкнулся с подобной проблемой, разрабатывал свою тему.
Суть в том, что у меня используется js 3.2.1, а WP грузит свою библиотеку 1.12.4.
Я пробовал отключить полностью js WP и подключить свою библиотеку - не сработало :(.
НО есть решение именно ЗАМЕНИТЬ библиотеку на свою, пишем эти строчки в functions.php:
//Применяем свой jQuery
function modify_jquery() {
if (!is_admin()) {
wp_deregister_script('jquery');
wp_register_script('jquery', get_template_directory_uri() . '/js/vendor.js', false, '3.2.1', true);
wp_enqueue_script('jquery');
}
}
add_action('init', 'modify_jquery');

Я еще отправил все это дело в футер. CF7 v.4.9.2 - полет нормальный и на сайте используется js v.3.2.1
Ответ написан
wppanda5
@wppanda5 Куратор тега WordPress
WordPress Mедведь
CF7 в модальном окне работает именно так как вы хотите, ajax отправка у нее встроена , вероятнее всего у вас конфликт скриптов, большего не видя проблемы сказать не возможно
Ответ написан
@Majestty
Мне помогло, то что я перенес подключение jQuery в самый верх перед wp head()
Ответ написан
@Abmin
Если форма(мы) выведены на странице с помощью do_shortcode(), тогда нужно вручную подключить на страницу файл
/wp-content/plugins/contact-form-7/includes/js/scripts.js

Только нужно понимать, что там где форма работала, из за подключения этого файла перестанет (так как при выводе формы через админку этот файл уже имеется на странице). По этому, чтобы не подключать скрипт второй раз, вам нужно сделать проверку. Мне например нужно было вывести только на страницах где в URI присутствует /cars/, по этому мой код выглядит вот так:
<?php if (strpos($_SERVER['REQUEST_URI'], '/cars/') !== false) { ?>
<script type="text/javascript" src="/wp-content/plugins/contact-form-7/includes/js/scripts.js?ver=5.3.2"></script>
<?php } ?>
Ответ написан
morkovka22
@morkovka22
fall in love in front-end development
У меня такая же проблема, конфликт скриптов был, местами в скрипты поменяла и плюс еще указала путь script type="text/javascript" src="plugins/contact-form-7/includes/js/jquery.form.js" > и script type="text/javascript" src="plugins/contact-form-7/includes/js/scripts.js" >.
C модальным окном сработало, при отправке данных страничка не перезагружалась, но вот на главной странице формы перестали работать(( и теперь не знаю, что делать вообще..
также пробовала сделать redirect(на эту же форму) для кнопки с формы модального окна, но ничего не вышло...
Ответ написан
Ваш ответ на вопрос

Войдите, чтобы написать ответ

Войти через центр авторизации
Похожие вопросы