Текст-заполнитель шаблона темы компонента Topic

Подход с использованием плейсхолдеров:

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

Базовое поведение по умолчанию сейчас позволяет перечислять различные разделы формы, как я написал («имя», «местоположение» и «проблема»), но поведение шаблона по умолчанию имеет те же проблемы, что и отмечалось ранее: разметка Markdown запутывает, и пользователь может легко её сломать.

Я считаю, что идеальным вариантом была бы обычная форма, где для каждого раздела (имя, местоположение и проблема) есть плейсхолдер, но (вот в чём разница) разделы будут работать независимо. То есть, когда пользователь нажимает на раздел «имя», плейсхолдер «имя» исчезает, но остальные разделы остаются, пока пользователь не нажмёт на них тоже.

Я могу представить, что это возможно (?) с помощью jQuery. Каждый раздел должен иметь свой div с id, а jQuery позволит показывать или удалять текст для этого конкретного id при клике пользователя. Однако для этого потребуется добавлять div-элементы внутрь textarea, и я не уверен, как это сделать.

Я изучаю этот вопрос здесь.

Подход с использованием шаблонов

Вероятно, альтернативой было бы то, что заголовки разделов не «исчезают», когда пользователь нажимает на них. То есть заголовки разделов (например: Имя, Местоположение и Проблема) будут текстом, который останется на странице. Чтобы сделать это более похожим на форму по сравнению с текущим шаблоном по умолчанию:

  1. Текст заголовка раздела нельзя будет редактировать пользователю (то есть contenteditable="false").
  2. Разделительные точки между разделами нельзя будет удалить пользователю.
  3. Под заголовком раздела будет место, где пользователю будет очевидно, что можно печатать. В текущем шаблоне по умолчанию им пришлось бы перейти туда, где находится текст, нажать Enter, чтобы создать место для ввода.

Возможно, это более простой способ сделать это?