Предисловие.
У нас есть две задачи. Первая задача - это создать контактную форму на сайте, и темизировать её, вторая задача - это научиться темизировать формы вообще. Итак, давайте сначала рассмотрим те решения, которые подсказывает нам сообщество Drupal.
1. Если мы наберём в гугле формы в Drupal, то нам сразу же выйдет одноименный модуль, который называется Webforms. Что с ним не так? Если мы с ним начнём работать, то сразу же поймем, что этот модуль как отдельный CMS внутри самой CMS, потому что он имеет свои шаблоны форм, свою контентную модель, свои плагины, плагины к плагину и другие подобные вещи. А нам всего лишь нужно web форму создать. Давайте вспомним ту самую картинку, которая имеется, когда мы говорим про Drupal:
Одна из причин, почему так сложно освоить Drupal, потому что люди, которые начинают работать с этим, они сразу упираются, исходя из этих задач, в один из этих модулей, именно в этот Webforms, и это их очень сильно озадачивает, когда такую простую задачу нужно решать через такой огромный модуль, отдельный модуль, не просто модуль, а как отдельный CMS внутри CMS.
2. Второй вариант решения (Webforms я, например, не использую) - это темизирование с помощью форм, которые дает Drupal. И вот здесь мы сталкиваемся с одним нюансом. Все формы по умолчанию в Drupal имеют один и тот же шаблон форм form.html.twig. И мы все формы, в принципе, должны темизировать через него. Конечно можно, если вы мега программист, написать webhook, который будет переопределять ваш шаблон, то есть, отдельный шаблон для вашей формы, но это путь, который каждый раз надо проходить, и в котором нужно знать, как этот hook написать, и каждый раз нужно новый hook писать. Вот, чтобы это обойти, вам достаточно принять решение.
Решение
Для того, чтобы темизировать web формы, я предлагаю следующее. Вы добавляете в вашу тему trinion5.theme файл следующую функцию:
function trinion5_backend_theme_suggestions_form_alter(array &
" class="formula inline">suggestions[] = 'form__' . $variables['element']['#form_id'];
}где trinion5 - название вашей темы
И теперь для каждой web формы, формы каждой ноды, любой формы можно будет указать отдельный шаблон, который будет иметь вид - название темы, нижнее подчеркивание (там видно), элемент и id формы.Пример вы можете видеть на картинке.
После того, как мы это создадим, у нас в форме появится новое предложение по web форме.
И в нем мы уже можем темизировать нашу форму, то есть, любая форма, которую мы создаем, теперь может иметь свой шаблон. Что важно понимать? Что сам по себе, файл нужно будет создавать. Мы берем для примера файл, (вы можете взять мой файл) копируем его, и называем так, как нам надо, после чего темизируем.
Как мы темизируем? Здесь есть вопрос, как получить наименование полей. Для этого у нас существует код {{ dump(element|keys) }}, который выводит информацию о том, какие поля и какие атрибуты есть у данной формы.
Для того чтобы увидеть комментарии у вас должна быть включена отладка twig template отладка Drupal. Необходимую информацию об этом вы можете найти по ссылке https://www.drupal.org/docs/theming-drupal/twig-in-drupal/debugging-twig-templates
Мы берем те, которые отвечают за ввод форм, и темизируем его, как простой html, как простой twig. Для примера, для того, чтобы вывести название той формы, которую я приложил, я использую bootstrap, тему bootstrap. Вот код, который я вам и предлагаю. То есть, все достаточно просто.
Кроме того, необходимо не забывать следующий момент: сами поля, которые выводятся в этой форме, они по умолчанию выводятся с различными оболочками, с различными стилями, которые нам не нужны. Рекомендую обратить внимание на файлы: textarea.html.twig, select.html.twig, radios.html.twig, input.html.twig, input--submit.html.twig, input--radio.html.twig ...
Вы можете взять, скопировать, и по аналогии темизировать не только контактные формы, но и модуль, что касается контактных форм, и любые формы вывода данных, которые вы хотите. То есть, если вы, для примера, хотите темизировать ввод данных, как мы (например, у нас есть темизация ввода данных заказа клиента), то вам необходимо сделать то же самое через механизм, который был мною описан в этой статье.
