Исправляем ошибку «Используются устаревшие настройки» в Contact Form 7

Сегодня разберемся, как исправить ошибку «Используются устаревшие настройки» на вкладке Дополнительные настройки на странице редактирования формы в плагине Contact Form 7.

Введение

Данная ошибка начала возникать в последних версиях Contact Form 7 при использовании параметров on_submit и on_sent_ok на вкладке «Дополнительные настройки». Эти параметры помечены как устаревшие и будут поддерживаться только до конца 2017 года.

on_submit и on_sent_ok предназначены для модификации работы формы. Действия, заданные в параметре on_submit, будут выполнены после отправки данных формы (в том числе при возникновении ошибок валидации и т.д.), а заданные в on_sent_ok — только в случае успешной отправки.

Обычно эти настройки используют, например, для передачи информации о достижении цели в Яндекс.Метрику или Google Analytics, перенаправления пользователя на другую страницу после отправки формы или дополнительной валидации.

Рассмотрим, что нужно предпринять, чтобы исправить ошибку.

Решение

В качестве замены разработчики плагина предлагают использовать JavaScript-события: wpcf7submit для on_submit и wpcf7mailsent для on_sent_ok.

Таким образом, параметр

on_sent_ok: "yaCounterXXXXXX.reachGoal('ORDER');"

1	on_sent_ok: "yaCounterXXXXXX.reachGoal('ORDER');"

превратится в код,

document.addEventListener( 'wpcf7mailsent', function( event ) {
    if ( '34' == event.detail.contactFormId ) {
        yaCounterXXXXXX.reachGoal('ORDER');
    }
}, false );

document.addEventListener( 'wpcf7mailsent', function( event ) {

if ( '34' == event.detail.contactFormId ) {

yaCounterXXXXXX.reachGoal('ORDER');

}

}, false );

где ’34’ — это ID формы, который Вы можете узнать из шорткода Contact Form 7

[contact-form-7 id="34" title="Заказать"]

1	[contact-form-7 id="34" title="Заказать"]

Аналогично, параметр

on_submit: "yaCounterXXXXXX.reachGoal('TRYORDER');"

1	on_submit: "yaCounterXXXXXX.reachGoal('TRYORDER');"

превратится в код

document.addEventListener( 'wpcf7submit', function( event ) {
    if ( '34' == event.detail.contactFormId ) {
        yaCounterXXXXXX.reachGoal('TRYORDER');
    }
}, false );

document.addEventListener( 'wpcf7submit', function( event ) {

if ( '34' == event.detail.contactFormId ) {

yaCounterXXXXXX.reachGoal('TRYORDER');

}

}, false );

Для применения изменений данный код необходимо добавить на Ваш сайт, а параметры, в свою очередь, удалить с вкладки «Дополнительные настройки».

Вставка кода

Для вставки кода мы воспользуемся плагином DCO Insert Analytics Code. Переходим в раздел Плагины -> Добавить новый, вводим название плагина в поле поиска, жмем «Установить» и «Активировать».

Настройки плагина расположены в разделе Настройки -> DCO Insert Analytics Code админ-панели.

Вставляем код в поле «Перед </body>», оборачиваем его с помощью <script type="text/javascript"></script> и жмем кнопку «Сохранить изменения».

Затем переходим в редактирование контактной формы и удаляем параметры с вкладки «Дополнительные настройки».

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

← Вернуться в блог