Zum Inhalt springen
/ Home / Knowledge / Divi | Elemente ausblenden auf Tablet, Mobile & Desktop

Divi | Elemente ausblenden auf Tablet, Mobile & Desktop

Marius Marzian
SEO-Experte
OIT GmbH
Profil ansehen

Responsive Design heißt nicht nur „Elemente schrumpfen", sondern oft auch „Elemente gezielt ausblenden" – etwa ein großes Hero-Bild auf Mobile verstecken oder ein Sekundär-Menü auf Tablet unterdrücken. Divi bringt dafür CSS-Klassen mit, die du in jedem Modul direkt über den visuellen Editor setzen kannst.

Mit dem Divi-Builder könnt ihr auf eurer WordPress-Webseite bestimmte Elemente ausblenden.

Ihr könnt hierbei das Element für mobile, Table & Desktop separat ein und ausblenden. Wählt hier in dem jeweiligen Element den Reiter ganz rechts „Erweitert“ und klickt dann auf „Sichtbarkeit“

Unser kleines Video zeigt euch wie ihr das machen könnt:

Sie sehen gerade einen Platzhalterinhalt von Youtube. Um auf den eigentlichen Inhalt zuzugreifen, klicken Sie auf die Schaltfläche unten. Bitte beachten Sie, dass dabei Daten an Drittanbieter weitergegeben werden.

Mehr Informationen

Für systematisch responsive Layouts und Mobile-First-Umsetzung unterstützen wir dich im Rahmen unseres Webdesigns.

Typische Anwendungsfälle für Responsive Visibility

Hero-Bild nur Desktop

Große dekorative Bilder erhöhen auf Mobile die Ladezeit ohne Mehrwert. Mit et-hide-mobile blendest du sie auf Smartphones aus und hältst den Fokus auf den Text.

Sidebar nur auf Desktop

Navigationsspalten stören auf schmalen Bildschirmen das Layout. et-hide-mobile et-hide-tablet blendet die Sidebar unterhalb von 980 px aus – ohne eigenes Plugin.

Alternative Mobile-Versionen

Zeige auf Mobile eine kompaktere Version eines Moduls und blende die Desktop-Version aus. So kannst du Texte und Layouts gerätespezifisch optimieren ohne zwei Seiten zu pflegen.

Marius Marzian
Dein Ansprechpartner
OIT GmbH
Profil ansehen

Hast du eine Frage zu diesem Artikel?

Schreib uns – wir antworten in der Regel innerhalb eines Werktages.