For example to render a simple form like search block should be invoked 8 different templates like below and each of this template only has one or few line of code, see below:
region.html.twig
└─ block.html.twig
└─ form.html.twig
├─ form-element.html.twig
| ├─ form-element-label.html.twig
| └─ input.html.twig
└─ container.html.twig
└─ input.html.twig
As you can see in below some of this files Just have a few line of code:
region.html.twig
{% if content %}
<div{{ attributes }}>
{{ content }}
</div>
{% endif %}
form.html.twig
<form{{ attributes }}>
{{ children }}
</form>
form-element.html.twig
{% if title is not empty or required -%}
<label{{ attributes.addClass(classes) }}>{{ title }}</label>
{%- endif %}
input.html.twig
<input{{ attributes }} />{{ children }}
container.html.twig
<div{{ attributes.addClass(classes) }}>{{ children }}</div>
- Some of this templates files are common with other parts of page and
editing each of them can affect to other parts and cause unwanted changes
. for example in this case drupal theme system for: "input.html.twig", suggest only
input--submit.html.twig
and this suggestion also common betweensearch block
andsearch form
. - Editing and managing this template files is tedious and difficult and
make my theme folder busy.
- Most of these templates have ambiguity and unclear content code
For this reason I'm looking for a method to combine this template files and make one template file like "form--search-block.html.twig
" to I can edit all element needs for rendering a form in one special place
and with more flexibility and confidently.