Frontend Image

The frontend image will be modified regarding the environment and the associated configuration.

Frontend Image Example

Frontend Image Example

The image path can be adjusted via the ImageViewHelper:

Custom fluid template
<html xmlns:env="http://typo3.org/ns/KonradMichalik/Typo3EnvironmentIndicator/ViewHelpers"
    data-namespace-typo3-fluid="true">

{f:uri.resource(path:'EXT:your_extension/Resources/Public/Image/Default.png') -> env:image()}
{env:image(path:'EXT:your_extension/Resources/Public/Image/Default.png')}
Copied!

Modifiers

The frontend image modification is identical to the favicon modification. You can use the same modifiers and configuration.

ext_localconf.php
use KonradMichalik\Typo3EnvironmentIndicator\Configuration\Handler;
use KonradMichalik\Typo3EnvironmentIndicator\Configuration\Indicator;
use KonradMichalik\Typo3EnvironmentIndicator\Configuration\Trigger;
use KonradMichalik\Typo3EnvironmentIndicator\Image;

Configuration\Handler::addIndicator(
    triggers: [
        new Trigger\ApplicationContext('Testing')
    ],
    indicators: [
        new Indicator\Frontend\Image([
            new Image\Modifier\TextModifier([
                'text' => 'TEST',
                'color' => '#f39c12',
                'stroke' => [
                    'color' => '#ffffff',
                    'width' => 3,
                ],
            ])
        ])
    ]
);
Copied!
Frontend Image Modifier Example