Abschnitte und Widgets mit dem Elementor Website Builder responsive bearbeiten
Das Thema Responsive solltest du bei der Erstellung deiner WordPress Website nicht vernachlässigen. Die mobilen Zugriffe auf Websites nehmen stetig zu. Kümmere dich daher nicht nur um die Gestaltung der Desktop-Ansicht, sondern auch um die Tablet- und Mobile-Ansicht.
Mit dem Elementor Website Builder werden die Inhalte von Seiten und Beiträgen standardmäßig in allen Ansichten angezeigt. Du hast aber auch die Möglichkeit, Abschnitte und Widgets unabhängig von den anderen Ansichten zu bearbeiten.
Ansichten & Breakpoints
Die Ansichten sind in Desktop, Tablet und Mobile unterteilt. Dafür gelten folgende Breakpoints:
Diese Breakpoints kannst du mit Elementor Pro individuell bestimmen unter Site Settings > Layout > Breakpoints.
Abschnitte
Für welche Ansicht ein Abschnitt sichtbar sein soll, bestimmst du über Edit Abschnitt > Erweitert > Responsive.
Hier kannst du unter Sichtbarkeit festlegen, in welchen Viewports der Abschnitt angezeigt werden soll. Standardmäßig sind alle Ansichten aktiviert.
Hier kannst du unter Sichtbarkeit festlegen, in welchen Viewports der Abschnitt angezeigt werden soll. Standardmäßig sind alle Ansichten aktiviert.
Außerdem hast du die Möglichkeit, Spalten umzukehren. Das betrifft Abschnitte mit mehreren Spalten. Wenn der Viewport zu schmal wird, werden die Spalten untereinander angezeigt. Dabei steht standardmäßig die linke Spalte oben, die rechten darunter. Wenn du die Reihenfolge umkehren möchtest, kannst du das hier einstellen.
Widgets
Responsive-Einstellungen kannst du auch für einzelne Widgets vornehmen. Dafür bearbeitest du das Widget unter Erweitert > Responsive. Hier kannst du festlegen, für welche Ansicht das Widget sichtbar sein soll. Standardmäßig sind auch hier alle Ansichten aktiviert.
In diesem Beispiel wäre das Widget in der mobilen Ansicht nicht sichtbar:
Vorschau
Klar, hier ist der Text 1:1 geduzt:
Bei der Seiten-/Beitragsbearbeitung mit Elementor wird die Vorschau normalerweise in der Desktop-Ansicht gezeigt. Du hast zusätzlich die Möglichkeit, die Vorschau in der Tablet- oder Mobile-Ansicht anzuzeigen.
Wurden Abschnitte oder Widgets nur für eine Ansicht freigegeben, kannst du diese am besten in der Vorschauansicht des entsprechenden Viewports bearbeiten. Denn Abschnitte und Widgets, die nicht für den aktuellen Viewport aktiviert sind, werden ausgegraut:
Bei anderen Versionen kann es daher zu Abweichungen der beschriebenen Optik oder der Funktionen kommen.
