Sylius Media Alt Text: Storefront

Storefront-Ausgabe des Sylius Media Alt Text Plugins: Welche Templates den Alt-Text drucken, dekorative Bilder in Links und die Twig-Funktion mmd_image_alt samt Partial für eigene Themes.

English Version

Zurück zur Übersicht

Sylius Media Alt Text: Storefront

Diese Dokumentation bezieht sich immer auf die aktuellste veröffentlichte Version.

Wo der Text erscheint

Das Plugin ersetzt fünf Templates über Twigs Bundle-Pfad-Override (templates/overrides/SyliusShopBundle und SyliusAdminBundle):

Template	Wirkung
`product/show/.../images/main_image.html.twig`	Hauptbild der Produktseite
`product/show/.../images/thumbnails/thumbnail.html.twig`	Thumbnails der Produktgalerie
`product/index/.../header/image.html.twig`	Kopfbild der Kategorie
`shared/components/main_image.html.twig`	Anonyme Komponente `sylius_shop:main_image`, also Produktkarten und Warenkorb
`product/form/sections/media/images.html.twig` (Admin)	Bildliste im Produktformular, nimmt den Editor auf

Ohne gepflegten Text bleibt die Ausgabe wie vorher. Ein dekoratives Bild gibt alt="" aus.

Hat Dein Shop eines dieser Templates selbst unter templates/bundles/SyliusShopBundle überschrieben, gewinnt Dein Template. Gib den Text dort mit mmd_image_alt aus (siehe unten).

Dekorative Bilder in Links

Die Produktgalerie verpackt ihre Bilder in Links. Ein dekoratives Bild würde den Link ohne zugänglichen Namen lassen, deshalb bekommt der Link in diesem Fall ein aria-label mit dem Produktnamen.

Den Text im eigenen Template ausgeben

Twig-Funktion

mmd_image_alt

<img src="{{ image.path|imagine_filter('sylius_shop_product_thumbnail') }}" alt="{{ mmd_image_alt(image, product.name) }}">

Signatur: mmd_image_alt(image, fallback = null, locale = null).

Ist image leer oder die Ausgabe ausgeschaltet, kommt fallback zurück (oder ein leerer String)
Sonst der gepflegte Text, '' bei einem dekorativen Bild
Gibt es keinen gepflegten Text, gilt zuerst Dein fallback, erst ohne fallback die Fallback-Provider-Kette (siehe Erweiterbarkeit)
locale ist optional und nimmt sonst die aktuelle Sprache

Partial für Themes

Ein Theme, das auch ohne das Plugin rendern muss, darf mmd_image_alt nicht direkt aufrufen: Eine unbekannte Twig-Funktion schlägt schon beim Kompilieren fehl. Stattdessen bindest Du das Partial mit einem Ersatz-Template ein:

alt="{% include ['@MmdSyliusMediaAltTextPlugin/shop/image_alt.html.twig', 'my_fallback.html.twig'] with { image: image, fallback: product.name } only %}"

my_fallback.html.twig enthält nur {{ fallback }}. Ist das Plugin da, gibt das Partial den Text aus, sonst das Ersatz-Template.

Weitere Twig-Funktion

Funktion	Beschreibung
`mmd_media_alt_text_plugin_version()`	Installierte Plugin-Version (`dev`, wenn sie sich nicht ermitteln lässt), wird im Titel der Einstellungsseite genutzt