diff --git a/config/schema/field_group.field_group_formatter_plugin.schema.yml b/config/schema/field_group.field_group_formatter_plugin.schema.yml index 82b8f27..449fd97 100644 --- a/config/schema/field_group.field_group_formatter_plugin.schema.yml +++ b/config/schema/field_group.field_group_formatter_plugin.schema.yml @@ -55,6 +55,9 @@ field_group.field_group_formatter_plugin.html_element: label_element: type: string label: 'html element tag to be used for the label' + label_element_classes: + type: string + label: 'html classes to be used for the label' attributes: type: string label: 'html attributes for the element' @@ -102,4 +105,4 @@ field_group.field_group_formatter_plugin.base: label: 'Classes of the fieldgroup' id: type: string - label: 'Html id of the fieldgroup' \ No newline at end of file + label: 'Html id of the fieldgroup' diff --git a/src/Plugin/field_group/FieldGroupFormatter/HtmlElement.php b/src/Plugin/field_group/FieldGroupFormatter/HtmlElement.php index 41f2d7e..2c8ab31 100644 --- a/src/Plugin/field_group/FieldGroupFormatter/HtmlElement.php +++ b/src/Plugin/field_group/FieldGroupFormatter/HtmlElement.php @@ -69,6 +69,15 @@ class HtmlElement extends FieldGroupFormatterBase { if ($this->getSetting('show_label')) { $element['#title_element'] = $this->getSetting('label_element'); $element['#title'] = Html::escape($this->t($this->getLabel())); + $element['#title_attributes'] = new Attribute(); + + if (!empty($this->getSetting('label_element_classes'))) { + $element['#title_attributes']->addClass(explode(' ', $this->getSetting('label_element_classes'))); + } + + if (!empty($this->getSetting('effect')) && $this->getSetting('effect') !== 'none') { + $element['#title_attributes']->addClass('field-group-toggler'); + } } $form_state = new FormState(); @@ -119,6 +128,18 @@ class HtmlElement extends FieldGroupFormatterBase { ), ); + $form['label_element_classes'] = array( + '#title' => $this->t('Label element HTML classes'), + '#type' => 'textfield', + '#default_value' => $this->getSetting('label_element_classes'), + '#weight' => 3, + '#states' => array( + 'visible' => array( + ':input[data-fieldgroup-selector="show_label"]' => array('value' => 1), + ), + ), + ); + if ($this->context == 'form') { $form['required_fields'] = array( '#title' => $this->t('Mark group as required if it contains required fields.'), @@ -181,6 +202,11 @@ class HtmlElement extends FieldGroupFormatterBase { $summary[] = $this->t('Label element: @element', array('@element' => $this->getSetting('label_element')) ); + if (!empty($this->getSetting('label_element'))) { + $summary[] = $this->t('Label element HTML classes: @label_classes', [ + '@label_classes' => $this->getSetting('label_element_classes'), + ]); + } } if ($this->getSetting('attributes')) { @@ -204,6 +230,7 @@ class HtmlElement extends FieldGroupFormatterBase { 'element' => 'div', 'show_label' => 0, 'label_element' => 'h3', + 'label_element_classes' => '', 'effect' => 'none', 'speed' => 'fast', 'attributes' => '', diff --git a/templates/field-group-html-element.html.twig b/templates/field-group-html-element.html.twig index 73072fc..2b97177 100644 --- a/templates/field-group-html-element.html.twig +++ b/templates/field-group-html-element.html.twig @@ -18,7 +18,7 @@ <{{ wrapper_element }} {{ attributes }}> {% if title %} - <{{ title_element }}{% if collapsible %} class="field-group-toggler"{% endif %}>{{ title }}{{ title_element }}> + <{{ title_element }}{{ title_attributes }}>{{ title }}{{ title_element }}> {% endif %} {% if collapsible %}