Twenty Twenty-Onevon the WordPress team

Wie der Name schon sagt, ist Twenty Twenty-One das Standard-Theme von WordPress für das Jahr 2021! Dieses Theme ist eine leere Leinwand für deine Ideen und macht den Block-Editor zu deinem besten Pinsel.

Mit neuen Block-Vorlagen, mit denen du in Sekundenschnelle ein wunderschönes Layout erstellen kannst, lassen die sanften Farben und das auffällige – und dennoch zeitlose – Design dieses Themes deine Website in einem besonderen Licht erscheinen. Twenty Twenty-One eignet sich perfekt für ein Portfolio, eine Business-Website oder ein persönliches Blog.

Drei verschiedene Geräte mit dem Twenty Twenty-One-Theme Auf einem Laptopbildschirm mit 1440 Pixel beträgt die Breite der Hauptspalte bis zu 610 Pixel. Die „weite“ Blockbreite beträgt bis zu 1240 Pixel und die „volle“ Blockbreite umfasst die gesamte Breite des Bildschirms. Spezifikationen (alle Abmessungen in Pixel):

  1. Auf einem Laptopbildschirm mit 1440 Pixel beträgt die Breite der Hauptspalte bis zu 610 Pixel, wenn das Layout mit einer Spalte verwendet wird.
  2. Es gibt einen Widget-Bereich im Footer mit einer Breite von 1040 Pixel.
  3. Die empfohlene Beitragsbildgröße ist 2000 Pixel breit und 1200 Pixel hoch.

Vorlagen

Twenty Twenty-One unterstützt standardmäßig mehrere wunderschöne Block-Vorlagen. Passe die Vorlagen mithilfe von Texten, Bildern und Farben, die zu deiner Story oder deiner Marke passen, an.

Umfassende Unterstützung des Block-Editors

Der Block-Editor in Twenty Twenty-One

Der Block-Editor in Twenty Twenty-One

Twenty Twenty-One ist so konzipiert, dass das Theme sämtliche Vorteile des Block-Editors nutzt. Twenty Twenty-One enthält umfangreiche Editor-Stile für den Block-Editor, sodass das, was du im Editor siehst, dem Endergebnis entspricht. Das Theme verfügt außerdem über ein umfangreiches Set an individuellen Farben und Typografie-Optionen sowie Unterstützung für Blöcke mit weiter und voller Breite.

Individuelle Hintergrundfarben

Twenty Twenty-One bietet dir eine Reihe vorausgewählter Farbpaletten in Pastell, die hinsichtlich des Kontrasts allesamt AAA-Standards entsprechen. Du kannst auch deine eigene Hintergrundfarbe für das Theme wählen und das Theme wählt automatisch barrierefreie Textfarben für dich aus.

Ein Regenbogen aus weichen Pastellfarben

Um die Hintergrundfarbe zu ändern, navigiere zu Customizer → Farben.

Die Hintergrundfarbe der Website über den Customizer ändern

Bearbeiten der Hintergrundfarbe über den Customizer

Die Farben der Elemente auf deiner Website werden anhand der von dir ausgewählten Hintergrundfarben automatisch berechnet. Dadurch wird sichergestellt, dass der Farbkontrast für alle Besucher immer hoch genug ist.

Dunkler Modus

Twenty Twenty-One ist das erste Standard-Theme, das den dunklen Modus unterstützt. Schalte die Unterstützung für den dunklen Modus im Customizer > Fenster für Farben und dunklen Modus um.

Customizer mit der Einstellung für den Dunkelmodus-Umschalter

Widgets

Twenty TwentyOne unterstützt Widgets unterhalb der Websiteinhalte im Footer.

Inhalte zu deiner Startseite hinzufügen

Twenty Twenty-One unterstützt den Block-Editor. Du kannst einen der verfügbaren Blöcke auswählen, um viele verschiedene Inhalte für deine Website zu erstellen. So haben wir die Startseite auf der Demo-Website Block für Block erstellt:

Twenty Twenty-One unterstützt ein Website-Logo, das sich perfekt als Avatar für ein persönliches Blog oder für dein geschäftliches Logo oder Icon eignet. Gehe folgendermaßen vor, um es auf deiner Website zu ändern:

  1. Öffne Meine Website → Anpassen und klicke auf den Abschnitt Website-Informationen.
  2. Klicke auf den Button Logo hinzufügen, um den Medienmanager zu öffnen.
  3. Lade ein neues Bild hoch oder wähle eines aus, das sich bereits in deiner Mediathek befindet.
  4. Klicke auf Als Logo festlegen und dein Logo wird in der Vorschau angezeigt.
  5. Klicke oben auf den Button Veröffentlichen, um deine Änderungen zu speichern.

Hinzufügen von Social Media-Icons

Twenty TwentyOne enthält die Option, direkt über dem Footer ein sekundäres Menü festzulegen. Hier wäre ein guter Platz, um Links zu deinen Social-Media-Profilen hinzuzufügen, die dann als Logos angezeigt werden:

Soziale Icons

Dazu musst du zuerst ein Menü für Links zu sozialen Netzwerken erstellen. https://youtu.be/3rTooGV_mlg Anschließend kannst du angeben, wo das Menü auf der Website eingefügt werden soll:

  1. Gehe zu Anpassen → Menü.
  2. Wähle Menü-Positionen aus.
  3. Weise das von dir erstellte Menü der Position für Links zu sozialen Netzwerken zu.
  4. Klicke oben auf den Button Veröffentlichen, um deine Änderungen zu speichern.

Das Menü für Social Media-Icons von Twenty Twenty umfasst Icons für:

  • Behance
  • Codepen
  • DeviantArt
  • DockerHub
  • Digg
  • Dribbble
  • Dropbox
  • Facebook
  • Flickr
  • Foursquare
  • GitHub
  • Google+
  • Instagram
  • LinkedIn
  • Meanpath
  • Medium
  • Pinterest
  • Periscope
  • Pocket
  • Reddit
  • Skype
  • SlideShare
  • Snapchat
  • SoundCloud
  • Spotify
  • StumbleUpon
  • Tumblr
  • Twitch
  • Twitter
  • Vimeo
  • Vine
  • VK
  • WordPress
  • Yelp
  • YouTube

Diese Theme kann zur Verwendung auf deiner selbst gehosteten WordPress-Installation heruntergeladen werden.

Herunterladen
Nächstes Theme