1

In the webform, I use the Entity checkboxes component, which allows me to display the options I need using Views, depending on the node to which the webform is linked. But I lack flexibility in terms of setting up the output theme of these fields. In debugging mode, I saw that the markup I needed was inserted in the template "form_element_label.html.twig". How do I override this template for a webform with a specific name and only for a specific field?

I asked this question to ChatGPT, but her solution doesn't work. However, the general logic is correct. Create a new function in theme's .theme file:

function MYTHEME_theme_suggestions_webform_element_label_alter(array &$suggestions, array $variables) {
  $element = $variables['element'];
  if (isset($element['#webform_id']) && isset($element['#key'])) {
    $suggestions[] = 'webform_element_label__' . $element['#webform_id'] . '__' . $element['#key'];
  }
}

Create a new template file in theme's templates folder: webform-element-label--WEBFORMID--ELEMENTKEY.html.twig

Drupal doesn't see this pattern. Where do I make a mistake?

I see the finished result like this: for the form I need, I redefine the label template of the field I need, in which I insert the HTML markup I need. Overriding the views template does not allow me to do this, but I was able to display the viewing mode of the type of material I needed. Now the only thing I need is to hide it in the accordion element so that I get information when I click on the link.

enter image description here

4
  • Did you flush all Drupal caches after adding your code? May 12, 2023 at 8:41
  • Yes, the cache is cleaned. Webform module version 6.1.4 May 12, 2023 at 8:44
  • Drupal does some really ugly things when it comes to dashes - and underscores _ in theme suggestions. I had some weird issues too, and in my case it helped to convert all dashes to underscores in hook_theme_suggestions_alter (also inside $variables), but only use dashes in Twig filenames.
    – Hudri
    May 12, 2023 at 10:56
  • If you're wanting to add a suggestion for form_element_label.html.twig then I think your alter function name would need to be:MYTHEME_theme_suggestions_form_element_label_alter then your if statements inside that can handle only applying it to the correct elements. Also i assume you know to replace MYTHEME with your themes name (some people dont) May 12, 2023 at 11:21

2 Answers 2

1

You should set twig.config: debug: true in your services.yml which will allow you to see the current suggestions.

You should see your suggestions, however with Drupal even if you do and you passed the suggestion with a '-' not '_', it'll tell you it's there but it won't actually pick up the template.

So make sure you convert the - to _.

$suggestion = 'webform_element_label__' . $element['#webform_id'] . '__' . $element['#key'];
$suggestion = str_replace('-', '_', $suggestion);
$suggestions[] = $suggestion;

With twig debug on, it'll actually tell you the theme hook you need.

e.g. <!-- THEME HOOK: 'breadcrumb' -->

function mytheme_theme_suggestions_breadcrumb_alter(array &$suggestions, array $variables) {

0

My mistake was that I inattentively studied the features of the work of this component of forms. It is impossible to insert your markup there, because it is filtered. My approach with the output of the teaser material is correct. You just need to take into account that links and other html tags will be deleted there, respectively, you can forget about the pop-up window.

Your Answer

By clicking “Post Your Answer”, you agree to our terms of service and acknowledge you have read our privacy policy.

Not the answer you're looking for? Browse other questions tagged or ask your own question.