vonheldenundgestalten / contao-ai-label

5.3.0 2026-09-23 06:58 UTC

Requires

• php: ^8.1
• contao/core-bundle: ^5.3
• doctrine/dbal: ^3.6 || ^4.0
• symfony/config: ^6.4 || ^7.0
• symfony/dependency-injection: ^6.4 || ^7.0
• symfony/event-dispatcher: ^6.4 || ^7.0
• symfony/http-kernel: ^6.4 || ^7.0
• symfony/translation-contracts: ^3.0

Requires (Dev)

• contao/manager-plugin: ^2.13

LGPL-3.0-or-later

• von Helden und Gestalten

Published on Packagist.org on 2026-09-23 16:11 UTC

README

Marks AI generated or edited images and videos in the frontend (EU AI Act, Art. 50).

The label is set once per file in the file manager and then appears everywhere the file is used, without changes to the templates.

Installation

composer require vonheldenundgestalten/contao-ai-label
vendor/bin/contao-console contao:migrate

Requires Contao 5.3 or newer.

Usage

File manager → edit an image or video → AI label

Field	Values
AI label	– / AI / AI generated / AI modified
Label style	– (website default) / black / black transparent / white / white transparent

The label then appears automatically in {{picture}}, {{figure}}, {{image}}, in templates using $this->insert('image', …) and on <video> elements.

Not covered: CSS background images, hand written <img> tags, Twig elements using the _figure component and external videos (YouTube, Vimeo). Place the label yourself there:

{{ai_label::<uuid or path>}}

Accessibility

The label is a <span> carrying the label text, with the SVG as its background image. The media points at it via aria-describedby, so a screen reader reads "Two people in a workshop, AI generated" instead of announcing a second, unrelated image.

Styling

The label is positioned in the bottom right corner of its parent and scales with it. Adjust it with custom properties on any ancestor:

.teaser-grid {
    --ai-label-size: 9%;      // height relative to the parent width, default 11%
    --ai-label-min: 1.75rem;  // smallest height
    --ai-label-max: 2.5rem;   // largest height
    --ai-label-top: .5rem;    // also -right, -bottom, -left
    --ai-label-bottom: auto;
}

Overrides at a single spot

{{picture::<uuid>?size=13&ai_label=off}}      no label
{{picture::<uuid>?size=13&ai_label=white}}    different style
<video data-ai-label="off" …>

Configuration

# config/config.yaml
contao_ai_label:
    default_style: white_transparent   # style for files without one of their own
    inject_css: false                  # style .ai-label in the project instead
    auto:
        insert_tags: true              # {{picture}}, {{figure}}, {{image}}
        image_template: true           # $this->insert('image', …)
        video: true                    # <video> elements

To replace the markup, extend AiLabelRenderer and point the service at your class.