in ,

Standardfarben in Elementor verwenden

Neben den Standardfarben deines WordPress-Themes, kannst du in Elementor eigene definieren. Das hat besonders dann den Vorteil, falls in deinem Theme wie z.B. das „Hello Theme“ keine Standardfarben definiert sind.

Wo finde ich die Elementor Standardfarben?

Öffne oder erstelle eine beliebige Elementor- Seite oder Beitrag. Navigiere oben links zu der „Elementor-Menüleiste“ Elementor Menüleiste und klicke auf die „Hamburger“ Schaltfläche.

Wähle in diesem Menü „Standardfarben“.

Wähle die Farben für „Primary“, „Sekundäre“, „Text“ und „Accent“.

Wie wirken sich die Standard-Farbeinstellungen aus?

In den nachfolgenden Beispielen habe ich dir die Standardfarben bildlich dargestellt.

Primary-Farben

Sekundäre-Farben

Text-Farben

Akzent-Farben

Die Farbeinstellungen wirken sich global auf alle Elementor-Elemente aus. Es kann an bestimmten Stellen mit deinem Theme Konflikte geben. Solltest du an einigen Stellen andere Farben angezeigt bekommen, überprüfe ggf. deine Einstellungen in deinem Theme-Customizer.

So findest du die richtigen Farben

Vorweg die „richtige“ Farbe gibt es nicht, hier spielen nicht nur persönlicher Geschmack, Usability oder Style-Guides eine Rolle. Oft muss eine Webseite auch in das gesamte Unternehmensumfeld passen, hier kann natürlich der hauseigene Style-Guide weiterhelfen. Jedoch beziehen sich solche Style-Guides oft auf den Druckbereich. Aber wie finde ich nun die passenden Farben für mein neues Webseiten-Projekt? Nachfolgend habe ich dir einige Webseiten aufgelistet, die auch mir bei der Suche von Farben weiterhelfen.

Weitere Inspirationen findest du auch auf dieser Webseite https://webdesign-showcases.com/ oder auf Pinterest.

Werbung, dieser Werbebanner enthält einen Affiliate-Link. Vielen Dank für deine Unterstützung.

Elementor Theme Styler

Mit Elementor kannst du Schriften und Farben für dein WordPress-Theme anpassen. Damit Elementor auf deine Theme-Einstellungen zugreifen kann, solltest du vorab die Einstellungen für die Standardfarben und Schriftarten deaktivieren. Navigiere in deinem Backend zu „Elementor“ > „Einstellungen“ und deaktiviere hier „Standardfarben“ und ggf. „Standardschriftarten“.

Bestätige deine Einstellungen mit einem klick auf die Schaltfläche „Änderungen speichern“.

Mit Elementor das WordPress-Theme anpassen.

Öffne oder erstelle eine beliebige Elementor- Seite oder Beitrag. Navigiere oben links zu der „Elementor-Menüleiste“ Elementor Menüleiste und klicke auf die „Hamburger“ Schaltfläche.

Wähle in diesem Menü „Theme Style“.

Nach einem kurzen neuladen der Seite, öffnet sich der Theme-Editor. Hier hast du etliche Einstellungen zu Standardfarben und Standardschriftarten.

Fazit

Je nach gewähltem WordPress-Theme hast du mit den Farbeinstellungen in Elementor ein praktisches Tool, um global für deine gesamte Webseite, die Farben zu ändern. Schreibe mir doch in den Kommentaren wie du deine Farben für deine Webseite gefunden hast.

Was denkst du über diesen Beitrag?

134 points
Upvote Downvote
wp-pagebuilder-info

Written by wp-pagebuilder-info

Mit einem Faible für Grafikdesign und Webseiten begann ich meine Karriere in einer Werbeagentur für Großformatdrucke. Webgestaltung und Webseiten ließen mich aber nie ganz los, sodass ich nebenbei noch einige Webprojekte und Blogs betreibe. Vor einigen Jahren noch mit Joomla, bin ich nun gänzlich auf WordPress umgestiegen und bedaure diesen Schritt bis heute nicht. Mit dem Page-Builder Elementor habe ich dabei recht früh begonnen zuarbeiten und war von Anfang an begeistert wie dieser mit WordPress harmoniert. So war es nur eine Frage der Zeit bis ich ein Webprojekt, das sich auf diesen Page-Builder konzentriert gestartet habe. Mit diesem Blog möchte ich nun mein gesammeltes Wissen zu WordPress und Elementor weitergeben und hoffe, das du von dieser Erfahrung für deine Projekte profitieren kannst.

Schreibe einen Kommentar

Avatar

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

Elementor eigene Schriftarten verwenden

Eigene Schriftarten in Elementor verwenden

MailChimp in Elementor integrieren

So bindest du MailChimp in Elementor ein