Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet

Der Elementor-Builder ermöglicht ein separates responsives Debugging für Tablets und Mobiltelefone, um der Erfahrung von Nutzern auf verschiedenen Geräten besser gerecht zu werden.

Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet

Zur Seite gehen und mit Elementor visuell bearbeiten

  1. Zugang zur visuellen Bearbeitung des Elementor-FrontendsKlicken Sie auf die Schaltfläche "Mit Elementor bearbeiten" in der schwarzen Navigationsleiste am oberen Rand, um schnell in den visuellen Bearbeitungsmodus der aktuellen Seite zu gelangen.
Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet
  1. Zum Responsive Modus wechselnSie können in den responsiven Modus wechseln, indem Sie auf das Symbol unten links klicken, wie unten dargestellt.
Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet
  1. Umschalten zwischen Tablet- und Mobile-Browsing-Modus
Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet

Nach dem Wechsel zum mobilen Browsing klicken Sie auf das entsprechende Modul, um die Größe der Textformatierung im Modul, die Größe der Ränder usw. zu ändern.

1. die Textgröße auf Mobiltelefonen zu ändern

Ändern Sie die Textgröße im Modul unter der Spalte Stil Typografie (Schriftart), ändern Sie den Wert Größe, um die Textgröße zu ändern.

Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet

2. die Breite der Spalten des Mobiltelefons ändern

Klicken Sie auf das Symbol in der oberen linken Ecke (wie unten gezeigt), ändern Sie den Spaltenabstand unter der Spalte Layout, um die Breite und Größe der Spalten, das Verhältnis usw. zu ändern.

Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet

3. die inneren und äußeren Abstände von Mobiltelefonen zu ändern

In der Spalte "Erweitert" können Sie die Ränder ändern, wie in der Abbildung unten gezeigt. Rand ist der äußere Rand, Auffüllung ist der innere Rand, normalerweise müssen Mobiltelefone den Wert von Auffüllung ändern, damit die Anzeige kompakter ist.

Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet

4. die Änderung der Methodik der Produktspalte

Hier ist die Änderung des Produktaufruf-Moduls (woo-Products-Modul), klicken Sie auf das Modul, um es zu bearbeiten.Inhaltunter demSäuleEs handelt sich um die Anzahl der Spalten in der Produktanzeige, und es ist sinnvoller, sie für mobile Geräte auf 2 zu ändern.

Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet

Ändern Sie die Größe des Produkttitels auf der mobilen Seite:Streik (auf der Tastatur)Stil Spalte unter Inhalt, Titel unter Typografie finden, kann die Größe des Titels ändern

Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet

5. die Anzeige der mobilen Seite ausblenden

Klicken Sie in Modul bearbeiten im Abschnitt Erweitert, Responsive auf Auf Mobilgeräten ausblenden, um das Modul auf Mobilgeräten auszublenden.

Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet

6. speichern von Änderungen

Wie unten gezeigt, klicken Sie auf die linke untere Ecke des Fenstersveröffentlichen.Sie können die Änderungen speichern

Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet

7. schnell zum Front- und Backoffice zurückkehren

Klicken Sie auf die folgenden Icons für eine schnelle Rückkehr

Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet

Wie man Elementor für das responsive Design und die Optimierung von WordPress-Websites verwendet

Zusammenfassung:

Durch den Zugriff auf den visuellen Bearbeitungsmodus des Elementor-Frontends können Sie in den responsiven Modus wechseln und die Textgröße, die Spaltenbreite, den inneren und äußeren Abstand sowie die Anzahl der Produktspalten für Tablet und Mobile anpassen. Darüber hinaus können bestimmte Module nach Bedarf ausgeblendet werden, um die beste Erfahrung für Benutzer auf verschiedenen Geräten zu gewährleisten. Der Artikel enthält spezifische Schritte und Anleitungen, die Ihnen helfen, die On-Page-Optimierung mit Leichtigkeit durchzuführen.


Kontakt
Sie können den Artikel nicht lesen? Kontaktieren Sie uns für eine kostenlose Antwort! Kostenlose Hilfe für persönliche Websites und Websites kleiner Unternehmen!
Tel: 020-2206-9892
QQ咨询:1025174874
(iii) E-Mail: info@361sale.com
Arbeitszeiten: Montag bis Freitag, 9:30-18:30 Uhr, Feiertage frei
Gepostet von photon fluctuations, retweeted mit Quellenangabe:https://www.361sale.com/de/10376/

Wie (1)
Vorherige Freitag, 25. Mai 2024 um 10:56 Uhr.
Weiter 25. Mai 2024 11:31

Empfohlen

Schreibe einen Kommentar

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert

Kontakt

020-2206-9892

QQ咨询:1025174874

E-Mail: info@361sale.com

Arbeitszeiten: Montag bis Freitag, 9:30-18:30 Uhr, Feiertage frei

Kundendienst WeChat
Um die globale Benutzerregistrierung und -anmeldung zu erleichtern, haben wir die Funktion der telefonischen Anmeldung abgeschafft. Sollten Sie Probleme bei der Anmeldung haben, wenden Sie sich bitte an unseren Kundendienst, der Ihnen bei der Bindung Ihrer E-Mail-Adresse hilft.