Status: Erfolgreich getestet
Einbindung: PHP-Snippet über Code Snippets
Problem
Google PageSpeed Insights meldet beim Elementor Loop Carousel fehlende erforderliche untergeordnete ARIA-Rollen.
Ursache
Elementor setzt am äußeren Swiper-Container
role="list". Die einzelnen Slides verwenden
jedoch role="group" und
aria-roledescription="slide".
Diese Struktur erfüllt die Anforderungen an eine ARIA-Liste nicht. Die zusätzliche Swiper-Wrapper-Ebene erschwert die Korrektur durch das Ergänzen von role="listitem".
Lösung
Die fehlerhafte Listenrolle wird vom äußeren Container entfernt. Die Swiper-Semantik der Slides bleibt bestehen.
PHP-Snippet
add_action('wp_footer', function () {
?>
<script>
(function () {
function fixLoopCarouselAria() {
document.querySelectorAll(
'.elementor-widget-loop-carousel .swiper.elementor-loop-container[role="list"]'
).forEach(function (el) {
el.removeAttribute('role');
});
}
if (document.readyState === 'loading') {
document.addEventListener('DOMContentLoaded', fixLoopCarouselAria);
} else {
fixLoopCarouselAria();
}
})();
</script>
<?php
});Einbindung
- Snippet-Typ: PHP
- Ausführung: Frontend bzw. überall
- Kein zusätzliches PHP-Opening-Tag einfügen
Test
- Snippet aktivieren und Cache leeren.
- Swiper-Container im Browser-Inspektor prüfen.
- Kontrollieren, dass role=“list“ entfernt wurde.
- PageSpeed Insights erneut ausführen.
Ergebnis: Der ARIA-Strukturfehler wurde beim getesteten Elementor Loop Carousel behoben.
Hinweise
Der Fix betrifft ausschließlich Elementor Loop Carousel und verändert keine normalen Loop Grids.
Dynamisch nachgeladene Karussells werden nicht automatisch erfasst. Nach Elementor-Updates sollte der Fix erneut überprüft werden.