Skip to content

Add FAQ entry for adjusting HTML attributes of headlines #1577

New issue

Have a question about this project? Sign up for a free GitHub account to open an issue and contact its maintainers and the community.

Sign up for GitHub

By clicking “Sign up for GitHub”, you agree to our terms of service and privacy statement. We’ll occasionally send you account related emails.

Already on GitHub? Sign in to your account

Merged
fritzmg merged 4 commits into from
Jun 1, 2025
Merged

Add FAQ entry for adjusting HTML attributes of headlines #1577

Show file tree
Hide file tree
Changes from 3 commits
Commits
Show all changes
4 commits
Select commit Hold shift + click to select a range
45220f1
Add FAQ entry for adjusting HTML attributes of headlines
fritzmg Apr 26, 2025
dd445e4
add link
fritzmg Apr 26, 2025
3059d0f
remove more whitespace
fritzmg Apr 26, 2025
7399429
Merge branch 'main' into headline-template-faq
fritzmg May 30, 2025
File filter

Filter by extension

Filter by extension
Conversations
Failed to load comments.
Loading
Jump to
Jump to file
Failed to load files.
Loading
Diff view
Diff view
19 changes: 19 additions & 0 deletions docs/manual/faq/_index.de.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -71,6 +71,25 @@ Die Information hierzu findest du unter [Template-Daten anzeigen](/de/layout/tem
Die Information hierzu findest du unter [TinyMCE-Editor Konfiguration](/de/anleitungen/tinymce-konfiguration/).
{{% /faq %}}

{{% faq "Wie kann ich eine CSS-Klasse zu allen Überschriften hinzufügen?" %}}
Um eine CSS-Klasse zu der Überschrift aller modernen Fragments (Inhaltselemente oder Frontend-Module) im Frontend
hinzuzufügen, können die HTML Attribute des `headline` Objektes in der `_headline`
[Twig Komponente](https://docs.contao.org/dev/framework/templates/creating-templates/#contao-components) angepasst werden:

```twig
{# templates/component/_headline.html.twig #}
{% use "@Contao/component/_headline.html.twig" %}

{% block headline_attributes -%}
{%- set headline = headline|merge({attributes: attrs().addClass('foobar').mergeWith(headline.attributes|default)}) -%}
{{ parent() }}
{%- endblock %}
```

Beachte, dass dies bei Inhaltselementen oder Frontend-Modulen, die noch PHP Templates verwenden - oder die `_headline`
Twig Komponente nicht verwenden, keine Auswirkung hat.
{{% /faq %}}


## Installation

Expand Down
19 changes: 19 additions & 0 deletions docs/manual/faq/_index.en.md
View file
Open in desktop
Original file line number Diff line number Diff line change
Expand Up @@ -70,6 +70,25 @@ The information about this can be found under [Show Template Data](/en/layout/te
The information about this can be found under [TinyMCE Editor Configuration](/en/guides/tinymce-configuration/).
{{% /faq %}}

{{% faq "How can I add a CSS class to all headlines?" %}}
You can add a CSS class to all headlines of all modern fragments (content elements or front end modules) in the front
end by setting the HTML attributes of the `headline` object in the `_headline`
[Twig component](https://docs.contao.org/dev/framework/templates/creating-templates/#contao-components)):

```twig
{# templates/component/_headline.html.twig #}
{% use "@Contao/component/_headline.html.twig" %}

{% block headline_attributes -%}
{%- set headline = headline|merge({attributes: attrs().addClass('foobar').mergeWith(headline.attributes|default)}) -%}
{{ parent() }}
{%- endblock %}
```

Note that this will not affect content elements and modules using legacy templates - or templates that are not using the
`_headline` component.
{{% /faq %}}


## Installation

Expand Down