Как подружить плагины Contact Form 7 и ACF

4 октября 2021

Покажу простой, но не самый очевидный способ передачи данных из произвольных полей Advanced Custom Fields в форму Contact Form 7 с помощью jQuery.

Contact Form 7 и Advanced Custom Fields (ACF) просто жизненно необходимые плагины, без которых лично у меня не обходится ни один проект. Что бы не говорили скептики, плагины действительно очень полезные и удобные. А, главное, гибкие и простые в использовании, что даёт возможность решать с помощью них широкий спектр задач без особых знаний в разработке.

Задача стояла в следующем:

Есть некие продукты в виде сущностей (CPT). Каждый продукт имеет набор характеристик, заданных в произвольных полях ACF. Поля добавляются репитером, их количество не постоянное. На всех страницах продуктов выводится динамическая форма заказа на CF7. В форме нужно сделать пользовательский выбор данных из произвольных полей в виде выпадающего списка.

Раньше для решения таких задач, я делал какие-то сложные штуки на PHP, устанавливал для связи какие-то дополнительные плагины. Но недавно на одном из форумов мне попалось интересное решение на jQuery. И я в очередной раз убедился, что все гениальное просто. jQuery есть практически на каждом Вордпресс сайте. Даже если его нет, переписать код на ванильном JS не составит особого труда.

1. Добавляем в форму CF7 новое поле select (выпадающий список) и задаём ему ID.

У меня ID = tourdate.

[select* tourdate id:tourdate]

2. Открываем шаблон страницы, на которой выводится форма и добавляем код.

Код будет запрашивать из БД нужные нам поля, формировать из них jQuery-скрипт, который в свою очередь будет с помощью функции append() цепляться к форме.

Если форма выводится только на одной странице, можно сделать отдельный шаблон для этой страницы любым привычным способом: page-slug.php, page-ID.php. Можно где-нибудь в футере выполнить проверку is_page() и вывести там. Можно создать функцию и вывести через неё в functions.php. Или вообще вынести в плагин. Здесь это не принципиально.

Интересующее меня поле в ACF называется dnln_tour_date, оно находится внутри репитера dnln_tour.

Получается такой код:

<script type="text/javascript">
  <?php
  if( have_rows('dnln_tour') ):
    while( have_rows('dnln_tour') ) : the_row();
      echo 'jQuery(\'#tourdate\').append(\'<option value="' . get_sub_field( 'dnln_tour_date' ) . '">' . get_sub_field( 'dnln_tour_date' ) . '</option>\');';
    endwhile;
  endif;
  ?>
</script>

Задача решена: нужные мне поля из ACF присоединяются к выпадающему списку Contact Form 7 и успешно передаются через форму.

Иван Данилин

Делаю сайты на Вордпресс с 2008 года, занимаюсь их оптимизацией, поддержкой, делюсь опытом в блоге

Добавить комментарий