dimayakovlev.ru


Форма для создания раздела ответов на часто задаваемые вопросы для Grav CMS

Среди требований заказчиков веб-сайтов часто встречается запрос на создание раздела с ответами на часто задаваемые вопросы. Если вы создаёте веб-сайт, работающий под управлением Grav CMS, то реализовать данный функционал можно разными способами – от создания модульных страниц, до написания специального плагина. Но всегда хочется упростить стоящую задачу.

На мой взгляд, наиболее простым и универсальным способом является использование специальных страниц, содержащих текст вопросов и ответы на них. Для создания удобного графического пользовательского веб-интерфейса, позволяющего с лёгкостью управлять содержанием вопросов и ответов, используются возможности форм и плагина Admin Grav CMS.

Для создания формы можно использовать конфигурационный файл следующего содержания:

form:
  fields:
    header.faq:
      type: list
      label: 'Часто задаваемые вопросы и ответы на них'
      fields:
        .question:
          type: text
          label: Вопрос
          help: 'Введите текст вопроса'
        .answer:
          type: textarea
          label: Ответ

Создаваемая с использованием приведённой конфигурации форма, имеет следующий вид:

Форма редактирования наиболее часто задаваемых вопрос в Grav CMS, созданная с использованием рассматриваемого примера конфигурации

При желании вместо элементов типа textarea могут использоваться элементы типа editor, позволяющие использовать Markdown редактор, аналогичный редактору, используемому при редактировании содержания страницы.

Рассматриваемая форма, позволяет создать необходимое пользователю количество часто задаваемых вопросов и ответов на них, управляя не только содержанием, но и порядком следования. Данные формы в заголовке файла страницы имеют следующую структуру:

faq:
  -
    question: 'Canon или Nikon?'
    answer: 'Я бы обратил внимание на FujiFilm.'
  -
    question: 'GetSimple CMS или Grav CMS?'
    answer: 'Берите обе.'
  -
    question: 'The Beatles или The Rolling Stones?'
    answer: 'Конечно, Elvis Presley.'

Для формирования HTML кода на основе данных, добавленных в заголовок страницы с использованием рассматриваемой формы, в шаблоне оформления Twig может быть использован следующий код:


<h2>Ответы на часто задаваемые вопросы</h2>
{% for item in page.header.faq %}
<h3>{{ item.question }}</h3>
{{ item.answer|markdown  }}
{% endfor %}

При необходимости в конфигурацию формы ответов на наиболее частые вопросы могут быть добавлены дополнительные поля, а формирование HTML кода может быть адаптировано для использования совместно с применяемым в текущей теме оформления веб-сайта CSS и JavaScript фреймворком (Bootstrap, Foundation и т.п.).