Willkommen im STRATO Blog. Hier gibt es News und Tipps rund ums Hosting.

 

Menu

Veröffentlicht am: 30. Januar 2019

Making 2019 great again

6 Schönheitstipps für das WordPress-Theme Twenty Nineteen

Das Standard-Theme von WordPress kann mehr als nur Standard. Mit einfachen CSS-Anweisungen machst Du Twenty Nineteen noch schöner.

Twenty Nineteen verfügt über ein minimalistisches, einspaltiges Layout und eignet sich damit vor allem für Blogs. Das Design kannst Du im Backend über den Customizer anpassen. Mit Cascading Style Sheets (CSS) hast Du jedoch viel mehr Möglichkeiten. Mit wenigen Code-Zeilen kannst Du zum Beispiel die Farben und Schriften individuell anpassen.

Hinweis: Am besten verwendest Du für die folgenden Anpassungen ein Child Theme. Alternativ kannst Du die CSS-Anweisungen auch in das WordPress-Backend eingeben (Design -> Customizer -> Zusätzliches CSS).

Tipp 1: Farbfilter entfernen

Standardmäßig sind die Beitragsbilder auf der Startseite mit einem blauen Overlay versehen. Im Backend kannst Du die Farbe ändern oder den Filter unsichtbar machen (Design -> Customizer -> Farben). Das funktioniert jedoch nur bei den Bildern auf der Startseite – in den Beiträgen werden die Bilder weiterhin abgedunkelt angezeigt.

Beitragsbild mit Filter (links) und ohne

Um das zu ändern, entfernst Du im Customizer zunächst das Häkchen bei „Für hervorgehobene Bilder einen Filter unter Benutzung der Primärfarbe anwenden“:

Danach gibst Du folgende Zeilen als Zusätzliches CSS ein:

Wichtig: Das Abdunkeln der Bilder hat den Vorteil, dass die darüber liegende weiße Schrift besser zu lesen ist. Prüfe daher, ob die Schrift über Deinen Beitragsbildern auch ohne Filter noch lesbar ist.

Tipp 2: Hintergrundfarbe ändern

Dank des hellen Hintergrunds lässt sich der Fließtext gut lesen. Falls Dir das Weiß aber zu langweilig ist, kannst Du die Hintergrundfarbe ganz leicht ändern, zum Beispiel in ein helles Grau:

Tipp 3: Schriftart anpassen

Als minimalistisches Theme setzt Twenty Nineteen auf eine ungewöhnliche Typografie. Falls Dir die Standardschriftart Hoefler Text zu exotisch ist, legst Du per CSS einfach andere Schriften fest. Mit der folgenden Anweisung sieht Dein Text aus wie beim Vorgänger-Theme Twenty Seventeen:

Die Serifenschrift Hoefler Text (links) wirkt klassisch, Libre Franklin (rechts) schnörkellos modern.

Tipp 4: Hintergrundfarbe der Kommentare ändern

Im originalen Layout hängen die Kommentare ein wenig „in der Luft“, da es keine Abgrenzung vom übrigen Inhalt gibt. Abhilfe schafft hier ein farbiger Hintergrund. Über die Eigenschaft „border-radius“ rundest Du zusätzlich die Ecken ab:

Der farbige Hintergrund hebt Kommentare hervor und lädt zum Kommentieren ein.

Tipp 5: Hover-Effekt bei Beitragsbildern

Bei Twenty Nineteen sind die Vorschaubilder standardmäßig verlinkt. Das ist gut, weil es viele Deiner Besucher so erwarten. Noch besser wäre es, wenn die Verlinkung erkennbar wird, sobald man mit der Maus darüberfährt. Die folgenden Zeilen sorgen für einen fließenden Hover-Effekt, der die Transparenz des Bildes erhöht:

Tipp 6: Widget-Schrift weniger fett

Die im Footer platzierten Widgets wirken durch die fette Schrift recht dominant. Für ein dezenteres Erscheinungsbild kannst Du den Wert von „font-weight“ reduzieren:

Weniger Strichstärke ist manchmal mehr (links: Original).

Twenty Nineteen mit CSS gestalten

Mit CSS kannst Du Twenty Nineteen flexibel anpassen. Die WordPress-Funktion „Zusätzliches CSS“ ist einsteigerfreundlich und eine bequeme Lösung für kleine Anpassungen. Im Customizer sind diese schon vor der Veröffentlichung sichtbar.

Für weitergehende Änderungen ist ein Child Theme die bessere Vorgehensweise. Hiermit kannst Du neben CSS bzw. Sass auch PHP-Code modifizieren. Die neuen WordPress-Blocks lassen sich ebenfalls über das Theme editieren. Deine Anpassungen sind dann direkt im Editor zu sehen.

Was mit CSS alles möglich ist und wie die Sprache funktioniert, erfährst Du hier: https://wiki.selfhtml.org/wiki/CSS.

Der Autor:

Autor: Christian Lingnau

Ich heiße Christian Lingnau und bin freier Redakteur für Hosting-Themen, insbesondere WordPress.

4 Kommentare

  1. Chris L. sagte am 18. März 2019 um 9:42:

    Wie nennt man die Anzeige hier: […] unter dem Menü?

    Diese:
    Startseite » Produkte » Mannesmann Elektrisches Schärfgerät für Ketten, M12999

    Und hat die wirklich Vorteile?

    Antworten
    • Oliver Meiners sagte am 18. März 2019 um 19:16:

      Hallo Chris,

      bitte habe Verständnis dafür, dass ich Deinen Kommentar bearbeitet habe.

      Hier ist die Antwort unseres Autors Christian auf Deine Frage:

      Diese Zeile ist eine Breadcrumb-Navigation. Der Vorteil dabei ist, dass man immer weiß, wo man sich befindet.

      Viele Grüße

      Antworten
  2. Neueinfo-Team sagte am 12. April 2019 um 21:55:

    Hallo,

    wir haben nun auch das WordPress-Theme Twenty Nineteen auf […] im Einsatz und sind soweit zufrieden. Durch Zufall sind wir auf diesen Beitrag gestoßen und haben einiges von den Vorschlägen umgesetzt. Danke dafür.

    Viele Grüße,
    Das Neueinfo-Team

    Antworten

Hinterlasse eine Antwort

Bitte beachte, dass sich Dein Kommentar auf den Artikel beziehen sollte. Wenn Du ein persönliches Kundenanliegen besprechen möchtest, wende Dich bitte an unseren Kundenservice auf Facebook, Twitter oder über Hilfe & Kontakt.
Wir freuen uns, wenn Du uns Deinen Namen hinterlässt. So wissen wir, wie wir Dich bei unserer Antwort ansprechen können.
Wenn Du Deine E-Mail-Adresse einträgst, wirst Du per Mail über unsere Antwort informiert. Sie wird zum Schutz Deiner Daten aber nicht veröffentlicht. Beide Angaben sind freiwillig.

Hier bloggen

Lisa Kopelmann
Ist Ansprechpartnerin für den Blog und berichtet über aktuelle STRATO Themen

Oliver Meiners
Schreibt über alles, was für Dich als STRATO Kunde wichtig ist

Michael Poguntke
Schreibt über den Online-Speicher HiDrive, den Homepage-Baukasten, Webshops und Server

Bianca Restorff-Adrion
Schreibt über Karriere & die Menschen bei STRATO

Christian Lingnau
Bloggt über WordPress & andere CMS

Franz Neumeier
Gibt Tipps zum erfolgreichen Bloggen

Sven Hähle
Kennt sich bei Domains hervorragend aus

Patrick Schroeder
Erzählt die Stories unserer Kunden

Ann-Christin Schmitt
Schreibt über HiDrive, den Homepage-Baukasten und guten Websitecontent

Christian Rentrop
bloggt über Software-Themen