Elementor behält Elemente in ihren Spalten, was genau richtig ist, bis das Design etwas anderes erfordert: ein Abzeichen, das halb auf dem Foto und halb davon sitzt, oder ein Etikett, das am Schnittrand vorbeigeschoben wird Die Positionierungsverlängerung In Master-Addons für Elementor Fügt Offset-Steuerelemente zu jedem Widget, jeder Spalte, jedem Abschnitt und jedem Container hinzu. Sie können alles aus dem Panel in px, em oder % anstoßen oder vollständig neu positionieren, mit separaten Werten pro Gerät.
Was die Positionierungsverlängerung bewirkt #
Sobald aktiviert, erhält jedes Element eine Positionierung Abschnitt unter seiner Fortgeschritten Tab. Wählen Sie einen Positionstyp und das Element mit versetzten Schiebern verschieben:
- Positionstyp: Standard und Static behalten den normalen Fluss bei, Relative versetzt das Element von seinem eigenen Punkt aus und Absolute platziert es innerhalb des nächstgelegenen positionierten Elternteils. Hier gibt es keine feste Option; Verwenden Sie hierfür die eigene Positionseinstellung von Elementor.
- Oben / Rechts / Unten / Links: Versätze in px, em oder % für jede Seite, einschließlich negativer Werte für das Überschreiten von Kanten.
- Von Zentrum: Ein horizontaler Versatz von der Mitte des übergeordneten Elements Es wird links auf 50% plus Ihren Wert gesetzt.
- Z-Index: Entscheidet, welches Element gewinnt, wenn sich die Dinge überschneiden.
Jedes Steuerelement trägt das responsive Symbol, sodass Desktop, Tablet und Mobilgerät jeweils ihre eigenen Werte behalten. Das Panel fügt eine sinnvolle Warnung hinzu: Vermeiden Sie die gleichzeitige Kombination von From Center und Left.
Bevor Sie beginnen #
- WordPress Mit Elementor Installiert und aktiv.
- Master-Addons für Elementor Installiert und aktiv Neu im Plugin? folgen Sie dem Installationsführung Zuerst.
- Positionierung ist eine kostenlose Erweiterung, daher ist keine Pro-Lizenz erforderlich.
So aktivieren Sie die Positionierungserweiterung #
Gehen Sie von Ihrem WordPress-Dashboard aus zu Master Addons Und öffnen Sie die Erweiterungen Tab. Positionierung sitzt in der Widgets anzeigen Gruppe, neben Gitterlinie und Container-extras. Klicken Sie auf den Knebel, damit er violett wird, und schlagen Sie dann Änderungen speichern und warten auf den grünen Hinweis “Einstellungen erfolgreich gespeichert”.
Öffnen Sie das Positionierungsfeld #
Wählen Sie das Element im Elementor-Editor, das runde Qualitätsabzeichen in der Demo, und öffnen Sie das Fortgeschritten Tab. Erweitern Sie die Positionierung Abschnitt mit dem lila MA-Abzeichen und -Set Positionstyp zu Relativ. Die Offset-Steuerelemente erscheinen: Oben, Rechts, Unten, Links, Von Mitte und Z-Index darunter.
Ziehen Sie einen beliebigen Schieberegler und das Element bewegt sich live auf der Leinwand. Ein negativer Top von -143 in der Demo hebt das Abzeichen von der Mitte des Fotos in Richtung seines oberen Randes; positive Werte drücken in die andere Richtung.
Verschieben Sie das Element an seinen Platz #
Die Demo führt das Abzeichen mit ein paar Werten um das Foto herum: Top 357 Lässt es in die untere Hälfte fallen Rechts -262 Schiebt es nach außen, und a Unten Wert verfeinert die Überlappung, bis das Abzeichen den unteren Rand des Fotos überspannt. Jeder Schieberegler nimmt auch eingegebene Werte auf, sodass Sie den genauen Abstand eines Modells anpassen können.
Bei Relativ behält das Element seinen Slot im Layout und der Inhalt drumherum bleibt liegen Absolut nimmt das Element aus dem Fluss, also bewegt sich der Inhalt unten nach oben, um die Lücke zu füllen Wenn zwei Elemente gestapelt landen, setzt sich das Z-Index-Feld fest, wer oben sitzt.
Das Ergebnis auf der Seite #
Veröffentlichen und das Abzeichen gibt genau dort wieder, wo es geparkt wurde: Überlappung der unteren Kante des Fotos, Aufbrechen des Rechtecks, ohne die darunter liegende Säulenstruktur zu berühren.
Überprüfen Sie Tablet und Mobil, bevor Sie fertig sind Offsets, die auf dem Desktop genau aussehen, können ein Element auf einem schmalen Ansichtsport aus dem Bildschirm schieben, genau deshalb ist hier jedes Steuerelement responsive.
Wo sich eine präzise Positionierung auszahlt #
- Abzeichen und Stempel. Ein Siegel, das eine Fotoecke überlappt, liest sich wie entworfen, nicht platziert.
- Überlappende Karten. Ziehen Sie eine Testimonial- oder Stat-Karte an den Rand des Bildes daneben.
- Abschnittsbrechende Akzente. Formen oder Etiketten, die Grenzen überschreiten.
- Feinausrichtungsfixierungen. Stupsen Sie ein Element ein paar Pixel an, ohne es in Margin Hacks zu wickeln.
- Schichtheldkompositionen. Stapeln Sie Text über Bilder, wobei Z-Index die Reihenfolge bestimmt.
Video-Tutorial #
Sehen Sie, wie sich das Abzeichen in Echtzeit im Layout bewegt, von der Aktivierung der Erweiterung bis zur veröffentlichten Seite.
Häufig gestellte Fragen #
Wie bewege ich ein Element frei in Elementor?
Aktivieren Sie die Erweiterung Positionierung in der Registerkarte Master-Addons-Erweiterungen, wählen Sie das Element aus und öffnen Sie Positionierung unter der Registerkarte Erweitert Stellen Sie Positionstyp auf Relativ ein und verwenden Sie die Schieberegler oben, rechts, unten und links; das Element bewegt sich live auf der Leinwand, während Sie ziehen.
Kann ich negative Offsetwerte verwenden?
Ja. Negative Werte schieben das Element über seine normale Grenze hinaus, so überlappen Sie ein Abzeichen auf eine Fotokante oder ziehen ein Element außerhalb seines Abschnitts Geben Sie den Wert ein oder ziehen Sie den Schieberegler in beide Richtungen.
Was macht die Z-Index-Einstellung?
Z-Index steuert die Stapelreihenfolge, wenn sich Elemente überlappen Das Element mit der höheren Anzahl rendert oben drauf Stellen Sie es in dasselbe Positionierungspanel ein, wann immer ein neu positioniertes Element über oder unter seinen Nachbarn sitzen muss.
Funktionieren die Offsets auch mobil?
Jede Offset-Steuerung ist responsive, sodass Desktop, Tablet und Mobiltelefon getrennte Werte beibehalten. Sehen Sie sich nach der Positionierung immer eine Vorschau der schmalen Ansichtsfenster an: Ein Offset, der auf einen breiten Bildschirm passt, kann das Element auf einem Telefon vom Bildschirm verschieben, und die Werte pro Gerät entsprechen der Art und Weise, wie Sie es korrigieren.
Ist die Positioning-Erweiterung kostenlos?
Ja. Positionierung von Schiffen mit der kostenlosen Version von Master Addons for Elementor, in der Gruppe Display Widgets des Reiters Erweiterungen Die Preisseite behandelt, was die Pro-Pläne hinzufügen.
Einwickelnd #
Durch die Positionierung können Sie Elementorelemente außerhalb ihres normalen Steckplatzes platzieren: Wählen Sie Relativ oder Absolut, setzen Sie die Offsets ein und verwenden Sie für den Rest Z-Index- und Gerätewerte. Die Positionierungs-Erweiterungsseite Vergleicht es mit der eingebauten Position-Einstellung von Elementor, benötigt ein Element zusätzlich Rotation oder Skalierung, so koppeln Sie es mit der Transformiert Erweiterung (Pro).Sie können den Rest der Master Addons Widgets und Erweiterungen Auf einer Seite.
