English Version

Zurück zur Übersicht

Barrierefreiheit-Widget: Technische Details

Live Demo: Teste dieses und weitere Plugins live — ohne Installation, ohne Risiko: demo.markus-michalski.net

Ablauf

graph TD
    A["Storefront-Request"] --> B["WidgetConfigResolverInterface"]
    H["Shop-API-Request"] --> B
    B --> C["ChannelSettingsRepositoryInterface"]
    C --> D[("mmd_sylius_accessibility_channel_settings")]
    D --> E{"Zeile aktiv?"}
    E -->|"Nein"| F["Kein Widget / HTTP 404"]
    E -->|"Ja"| G["WidgetConfig"]
    G --> I["Twig Hooks: stylesheets, javascripts, header, offcanvas"]
    G --> J["AccessibilitySettingsProvider (Shop API)"]

Das Ergebnis wird einmal pro Request und Channel-Code zwischengespeichert (WidgetConfigResolver, kernel.reset), da mehrere Storefront-Templates auf derselben Seite denselben Channel abfragen. Ein Datenbankfehler wird nicht zwischengespeichert.

Bundle und Ressourcen

Plugin-Struktur

src/
├── Api/
│   ├── AccessibilitySettingsProvider.php     # API Platform State Provider
│   └── Resource/AccessibilitySettings.php    # API-Resource (GET /shop/accessibility-settings)
├── DependencyInjection/
│   ├── Configuration.php
│   └── MmdSyliusAccessibilityExtension.php   # Bundle-Extension, Doctrine-/Grid-/Hook-Prepend
├── Command/SetupCommand.php                  # mmd:accessibility:setup
├── Entity/
│   ├── ChannelSettings.php                   # einzige eigene Tabelle
│   ├── ChannelSettingsInterface.php
│   └── WidgetPosition.php                    # Enum: bottom_right, bottom_left
├── Form/Type/ChannelSettingsFormType.php     # @internal
├── Menu/
│   ├── AdminMenuListener.php                 # @internal
│   └── MenuGroup.php                         # "MMKreativ Plugins"-Sidebar-Gruppe
├── Migrations/Version20261003140000.php
├── Settings/
│   ├── ChannelSettingsRepository.php
│   └── ChannelSettingsRepositoryInterface.php
├── Twig/AccessibilityTwigExtension.php       # @internal
└── Widget/
    ├── WidgetConfig.php
    ├── WidgetConfigResolver.php
    └── WidgetConfigResolverInterface.php
config/                                       # services, admin-Routen, Grid, Twig Hooks
templates/                                    # shop/ (Skip-Link, Ziel, Widget, Stylesheets, JavaScripts), admin/
translations/                                 # messages, flashes, validators (de, en)
Resources/public/                             # accessibility.css, accessibility-early.js, accessibility.js

Entity

Eine einzige Tabelle, mmd_sylius_accessibility_channel_settings, geschlüsselt über channel_code statt über einen Fremdschlüssel - das Plugin braucht dafür keine Sylius-Core-Tabelle im eigenen Mapping.

Frontend

Reines JavaScript und CSS ohne Build-Schritt. accessibility-early.js hält Schema, Speicherung und Anwenden der Einstellungen und stellt sie als window.MmdAccessibility bereit; accessibility.js baut das Panel-Verhalten darauf auf. Das Widget sendet keine Netzwerkanfragen.