Der PageBuilder Elementor enthält standardmäßig sehr viele praktische Widgets. Eines davon ist das „Umschalter“ und „Accordion“ Widget.

Was ist der Unterschied zwischen dem Umschalter und dem Accordion Widget?

Das Umschalter-Widget öffnet jedes Element einzeln. Man kann damit alle Elemente gleichzeitig geöffnet haben.

Das Accordion-Widget schließt alle anderen Elemente, wenn man eines öffnet. Standardmäßig ist das erste Element des Accordions geöffnet. Manchmal möchte man aber alle Accordion-Elemente von Anfang an geschlossen haben. Das lässt sich mit einem kleinen Script machen.

Elementor Accordion
YouTube

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.
Mehr erfahren

Video laden

Wie man alle Accordion-Elemente geschlossen anzeigt

Um beim Betreten der Seite alle Accordion-Elemente geschlossen anzuzeigen, muss man nur ein HTML-Widget an beliebiger Stelle platzieren und nachfolgenden Code einfügen. Ich setze es meistens gleich unterhalb des Accordions (der Besucher der Webseite sieht dieses Element nicht).

<script> 
jQuery(document).ready(function($) { 
var delay = 100; setTimeout(function() { 
$('.elementor-tab-title').removeClass('elementor-active');
 $('.elementor-tab-content').css('display', 'none'); }, delay); 
}); 
</script>

Danach die Seite speichern und schon sind die Accordion-Elemente geschlossen.

Sollte dieses Script auf deiner Webseite nicht funktionieren, dann kann es folgende Gründe haben:

  • Das Script lädt schneller, als deine Seite fertig geladen ist – Als Lösung kannst du hier den Wert 100 in der zweiten Zeile des Scripts höher setzen. Probiere es mal mit 500. Der Wert steht für Millisekunden
  • jQuery wird auch deiner Seite nicht geladen. Vergewissere dich, dass jQuery eingebunden und geladen wird.

Ich hoffe, der Artikel hat dir gefallen. Lass mich in den Kommentaren wissen, ob es auf deiner Webseite funktioniert hat.

Kommentar schreiben