In diesem Beitrag sehen wir uns an, wie Sie Schriftarten und Farben mit Elementor einstellen, um sicherzustellen, dass IhreDie Website behält einen einheitlichen Stil beiund behalten gleichzeitig die Flexibilität für die Teile, die sie benötigen.

Standardeinstellungen für Elementor-Schriftarten und -Farben

In Elementor können SieAktivieren oder deaktivieren Sie die globalen Standardeinstellungen für Farbe und Schrift. Diese Einstellungen finden Sie in Elementor unter "konventionell (Waffen)", das Sie in den Einstellungen finden, bietet zwei Hauptoptionen:

• Standardfarben deaktivieren
• Standardschriftarten deaktivieren

Das Aktivieren oder Deaktivieren dieser Optionen kann Ihren Design-Workflow stark beeinflussen. Wenn Sie diese Standardeinstellungen deaktivieren, erzwingt Elementor nicht mehr die Anwendung seiner Standardfarben oder -schriften, sondern verwendet stattdessen die Standardeinstellungen, die Sie im Fenster "Website-Einstellungen"Die globalen Farben und Schriftarten, die in der

Auf diese Weise können Sie es an die Bedürfnisse Ihrer Website anpassen, ohne durch die Voreinstellungen von Elementor eingeschränkt zu sein.

Wann Sie die Standardfarben und -Schriften deaktivieren sollten

1. das Bedürfnis nach Kohärenz

Die Deaktivierung von Standardfarben und -schriftarten kann eine gute Option sein, wenn Sie möchten, dass die Schriftarten und Farben Ihrer Website auf allen Seiten, Abschnitten oder Widgets einheitlich sind. Die Deaktivierung dieser Optionen bedeutet, dass Elementor Ihre voreingestellten globalen Stile verwenden wird. Wenn Sie zum Beispiel möchten, dass alle Überschriften Ihrer Website eine bestimmte Schriftart verwenden, wie zum Beispiel MontserratLegen Sie sie einfach als globale Schriftart in den Website-Einstellungen fest, und die Schriftart wird automatisch angewendet, wenn Sie ein neues Kopfzeilen-Widget auf die Seite ziehen.

Fall: Die Auswirkung des Entfernens von zwei Häkchen Angenommen, Sie werden Montserrat Die Schriftart wird als globale Schriftart angewendet. Wenn Sie beide Kästchen deaktivieren, erben alle neu hinzugefügten Textwidgets automatisch diese Schriftart und die von Ihnen eingestellte globale Farbe. Diese Konsistenz ist wichtig für das Design und die Benutzerfreundlichkeit und gewährleistet einen kohärenten Stil der Website.

2. die Flexibilität, benutzerdefinierte CSS zu verwenden

Wenn Sie es vorziehen, das Styling Ihrer Website über benutzerdefinierte CSS zu steuernDie Standardfarben und -Schriften werden aufgehoben.macht die Dinge viel flexibler. Das hat den Vorteil, dass Elementor seine globalen Stile nicht automatisch anwendet. So können Sie das Styling der Seitenelemente vollständig über CSS definieren.

Wenn Sie jedoch die Standardeinstellungen deaktivieren, aber kein benutzerdefiniertes CSS verwenden, werden Sie möglicherweise feststellen, dass der Text und die Farben auf der Seite nicht so gut aussehen wie erwartet. Aus diesem Grund ist die Deaktivierung der Standardeinstellungen in der Regel für Benutzer gedacht, die eine vollständige Kontrolle über das Styling wünschen, insbesondere für diejenigen, die mit CSS vertraut sind.

Tipps zum Hinzufügen von benutzerdefiniertem CSS

Bei der Verwendung von benutzerdefiniertem CSS ist es manchmal notwendig, das !wichtig Tag, um die Standardstile von Elementor außer Kraft zu setzen. Wenn Sie zum Beispiel die H1 Für die Farbe und die Schriftart des Titels kann der folgende Code verwendet werden:

cssCopy-Code
h1 {
    Farbe: var(--e-global-color-accent) !important;
    font-family: Verdana !important;
}

Wenn Sie in diesem Beispiel nicht die Option !wichtig Tags werden Ihre benutzerdefinierten Stile möglicherweise nicht angewendet, da die Die globalen Einstellungen von Elementor haben eine höhere Priorität.

Aktivieren oder deaktivierenUnterschiedliche Effekte von globalen Farben und Schriftarten

1. die Anwendung von globalen Farben und Schriftarten

Wenn SieGlobale Farben und Schriftarten aktiviertElementor wird automatisch globale Stile auf alle Elemente auf der Seite anwenden. Das ist sehr praktisch für Benutzer, die mit CSS nicht vertraut sind oder Zeit sparen möchten. Wenn Sie zum Beispiel in den Website-Einstellungen eine bestimmte Farbe als globales Farbschema auswählen, wird diese Farbe automatisch auf alle Schaltflächen, Überschriften und Texte angewendet. Diese Einstellung gewährleistet ein einheitliches Design und spart viel Zeit für manuelle Anpassungen.

2. die Wirkung, wenn das Kästchen markiert ist

Wenn Sie das Kontrollkästchen Deaktivieren aktivieren, wendet Elementor keine Farben oder Schriftarten mehr automatisch an. An diesem Punkt können Sie das Styling Ihrer Website vollständig über benutzerdefinierte CSS steuern, anstatt die !wichtig Tag, um die globale Einstellung außer Kraft zu setzen. Der folgende Code kann zum Beispiel auf H1-Überschriften angewendet werden:

cssCopy-Code
h1 {
    Farbe: var(--e-global-colour-accent).
    font-family: Verdana.
}

Das bedeutet, dass Ihre benutzerdefinierten Stile Vorrang vor allen globalen Einstellungen haben und dass es nicht notwendig ist, die !wichtig Stichworte zum Thema.

Wann Sie das Kontrollkästchen deaktivieren oder deaktivieren sollten

Je nach Bedarf und Arbeitsablauf können Sie das Kontrollkästchen Deaktivieren aktivieren oder deaktivieren:

• Unkontrolliert: Dies kann überprüft werden, wenn Sie ein konsistentes Design Ihrer Website beibehalten möchten, denn Elementer wirdAutomatische Anwendung von globalen Farben und Schriftarten. Diese Methode eignet sich besonders für Benutzer, die den Stil ihrer Website nicht zu sehr anpassen möchten.
• Ausgewählt: Für diejenigen, die die vollständige Kontrolle über das Styling ihrer Website durch benutzerdefinierte CSS haben möchten, bietet Elementor mehr Designflexibilität. In diesem Fall wird ElementorEs werden keine globalen Stile angewendet.Stattdessen ermöglicht es Ihnen die volle Kontrolle durch benutzerdefinierte CSS.

Einrichten mit einer hybriden Methode

Deaktivieren Sie die Schrifteinstellungen und lassen Sie die Farbeinstellungen bestehen. Auf diese Weise kann ich sicherstellen, dass globale Schriftarten (wie z.B. Montserrat) automatisch auf die gesamte Website angewendet werden, während ich die Farben bestimmter Elemente über benutzerdefiniertes CSS steuern kann. Dieser Ansatz sorgt für ein konsistentes Design und ermöglicht es mir, bei Bedarf weitere Anpassungen vorzunehmen.

Bei den Farbeinstellungen kreuzen Sie die Option Deaktivieren an, insbesondere wenn Sie bestimmten Elementen ein eigenes Farbschema zuweisen möchten.

Tipps zur Verwendung benutzerdefinierter globaler Farben und Schriftarten

Um Schriftarten und Farben in Elementor besser zu verwalten, können Sie auch eigene globale Farb- und Schriftsammlungen erstellen. Dies stellt sicher, dass alle Seiten und Widgets automatisch Ihre vordefinierten Stile übernehmen, wenn sie hinzugefügt werden, und erleichtert auch zukünftige Stilaktualisierungen.

Schritt: Erstellen Sie einen benutzerdefinierten globalen Stil

1. In den Website-Einstellungen finden Sie "globale Farbe"und"Globalschrift"Optionen.

2. Passen Sie Ihre Farbschemata und Schriftstile an, indem Sie sie als globale Stile speichern.

3. Alle Widgets erben automatisch diese globalen Einstellungen, wenn Sie der Seite ein neues Element hinzufügen.

Auf diese Weise können Sie nicht nur Zeit sparen, sondern auch einen einheitlichen Stil für Ihre Website gewährleisten.

Schlussfolgerung:

Die Schrift- und Farbeinstellungen von Elementor bieten Ihnen eine Fülle von Designoptionen. Der Schlüssel ist, die Einstellungen zu finden, die für Ihren Arbeitsablauf am besten geeignet sind:

• Konsistenz durch Design: Wenn Sie die Standardfarben und -Schriften deaktivieren, können Sie einen einheitlichen Stil auf der gesamten Website gewährleisten.
• Flexibles Design: Wenn Sie beide Kästchen ankreuzen, haben Sie die vollständige Kontrolle über die Verwendung Ihres benutzerdefinierten CSS, ohne dass Sie sich Sorgen machen müssen, dass die globalen Einstellungen beeinträchtigt werden.