Как отправить данные в скрытый vol – King Composer + Contact Form 7

И так буду придельно краток хотя не факт что получится. В общем стоит следующая задача, на лендинге (который создан при помощи King Composer) имеется 13 блоков с услугами. Каждый блок имеет кнопку «ЗАКАЗАТЬ» и тригер класс попап окна плагина Popups. При появлении окна необходимо передать в скрытый vol тайтл блока из которого было вызван данный попап (ибо создавать 13 форм и 13 попап окон, буду предельно честен просто в лом). Делаем мы это для того что бы в будущем использовать содержимое vol’a при отправке заполненных данных, тем самым избежав создания кучи попапов и форм.

А именно, мы вставим данные в тему и в тело письма, при отправке заполненных данных администратору сайта.

Не много закрутил, но пусть так и будет. Теперь по порядку о плагинах (качаем):

King Composer

Contact Form 7

Popups

Contact Form 7 Modules

Внешний вид блоков:

Верстка одного блока:

Содержимое формы Contact Form 7:

Содержимое E-mail ответа формы Contact Form 7:

JQuery код:

Обновление от января 2021 года

С тех пор как я написал эту статья прошло много времени. Вот более обновленный и пожалуй правильный вариант реализации:

/**
 * Вставляем значения в скрытые поля формы
 */
/* Сценарий для захвата тайтла и передачи его в vol hide инпута для Contact Form 7 */
jQuery(document).ready(function($){

    /*Дожидаемся полной загрузки страницы*/
    console.log('RUN ➕');
            // ???????? Здесь указываем только селектор кнопки - input#BUTTOPOPUPS
            $('body').on('touchstart click','input#BUTTOPOPUPS', function(e){
                console.log('RUN CLICK ➕');
                var TITLE = $('#dz-licar-wrapper h1.elementor-heading-title').text();
                var DESC = $('#dz-licar-wrapper p.elementor-icon-box-description').text();

                console.log(TITLE);
                console.log(DESC);

                /*Присваиваем пустому (скрытому) val полученное значение */
                $('input#HIDDENINPUT_TITLE').val(TITLE);
                console.log('➕',$('input#HIDDENINPUT_TITLE').val());

                $('input#HIDDENINPUT_DESC').val(DESC);
                console.log('➕',$('input#HIDDENINPUT_DESC').val());
            })
});