CleanCode Erlebniswelten Element mit HTML, TWIG, CSS, & JS inkl. SEO & AI-Check

Über die Erweiterung

Volle kreative Freiheit für deine Shopware Erlebniswelten

GreatCmsTwig gibt dir ein freies HTML/CSS/JS CMS-Element für Shopware 6 Erlebniswelten. Anders als das native Text-Element, das alles sanitiert, rendert GreatCmsTwig deinen HTML-, CSS- und JavaScript-Code exakt so wie eingegeben — ohne Einschränkungen, ohne böse Überraschungen.

Das Besondere: Jedes Mal wenn du deinen HTML-Code bearbeitest, prüft ein eingebauter Live-Analyzer mit 4 Kategorien deinen Code sofort gegen WCAG 2.2 AA, SEO Best Practices, Core Web Vitals und AI-Crawler-Optimierung — und zeigt dir umsetzbare Hinweise direkt im Admin-Panel.

Warum GreatCmsTwig?

Kein Sanitizing — HTML, CSS und JavaScript exakt wie eingegeben gerendert. 33 Live-Checks in den Kategorien Accessibility, SEO, Performance und AI-Optimierung. WCAG 2.2 AA — aktueller internationaler Accessibility-Standard. AI-Optimierung für GPTBot, ClaudeBot und Perplexity Crawler. Sicheres JavaScript via IIFE und try/catch — kein Seitenabsturz bei Fehlern. Optionaler Twig-Compiler für Shopware-Variablen im HTML. Zweisprachige Admin-Oberfläche in Deutsch und Englisch.

Eingebauter Live-Analyzer — 4 Kategorien, 33 Checks

Kein anderes Shopware-Plugin bietet das. Der Analyzer läuft sofort beim Tippen und zeigt Probleme gruppiert nach Kategorie.

Barrierefreiheit (WCAG 2.2 AA) — 16 Checks

Bilder ohne alt-Attribut. Alt-Texte länger als 125 Zeichen. SVG ohne aria-label oder aria-hidden. Eingabefelder ohne aria-label. Tabellen ohne th-Kopfzeilen. Fehlende semantische HTML5-Elemente. user-scalable=no (verhindert Zoom). div/span mit onclick statt button. onclick ohne Keyboard-Equivalent. tabindex größer als 0. Leere Links und nichtssagende Linktexte. ohne . Buttons ohne Text. iframes ohne title. Doppelte ID-Attribute.

SEO — 6 Checks

Mehrere h1-Tags. Übersprungene Überschriften-Hierarchie. Bilder ohne alt-Text (Google kann sie nicht indexieren). Script-Tags ohne defer/async. noindex und nofollow erkannt.

Performance — 4 Checks

Base64-Bilder. Bilder ohne width/height (Layout Shift). Bilder ohne loading="lazy". Übermäßiges Inline-CSS.

AI-Optimierung — 5 Checks

Alt-Texte sind Dateinamen (z.B. image1.jpg) — AI-Crawler können sie nicht verstehen. Alt-Texte zu generisch (image, foto, logo). Kein lesbarer Text-Content — AI kann aus Bildern und iFrames alleine keine Bedeutung ableiten. iframe ohne noscript-Fallback — AI-Crawler können iFrame-Inhalte nicht lesen. Zu viele Inline Event-Handler — deklaratives HTML wird von AI besser verstanden.

Technische Details

Shopware-Kompatibilität: 6.5, 6.6, 6.7. Nur Self-Hosted — Shopware Cloud erlaubt kein ungefiltertes HTML-Rendering. StringLoaderExtension für optionale Twig-Kompilierung enthalten. Keine externen Abhängigkeiten — alle Analysen laufen client-seitig im Browser. JavaScript-Ausgabe in IIFE und try/catch für absturzsichere Ausführung.