Die eigene Webseite in 90 Minuten (FSE Version)

Vielleicht kennen Sie dieses Problem: Es soll in möglichst kurzer Zeit eine Webseite erstellt werden, natürlich muss sie gut aussehen und leicht wartbar sein. Und auch die Kosten sollten im Rahmen bleiben, wie es oft so schön heisst. Wie kann dieses Problem gelöst werden? Ganz einfach, mit WordPress! Dieser Beitrag zeigt Ihnen, wie sie in weniger als 90 Minuten eine eigene Website erstellen können, die alle genannten Kriterien erfüllt: Sie sieht gut aus und lässt sich einfach und schnell verändern; und sie ist auch über mehrere Jahre mit wenig Aufwand problemlos wartbar.

Vorarbeiten

Alles, was Sie für Ihren Auftritt benötigen, ist ein Webserver Abonnement, das die Installation von WordPress ermöglicht. Bei Hosttech gibt es das passende Paket «easyM» bereits ab 2.10 Franken pro Monat, bei SolNet bezahlen Sie 29.90 Franken pro Jahr, für dieses Geld bekommen Sie den Webserver und ein vorinstalliertes nagelneues WordPress; die Domain ist wie bei Hosttech im Preis inbegriffen. Versteckte Kosten? Diesmal keine – versprochen!

Falls Sie WordPress selber installieren müssen: Es ist keine Hexerei. Grundsätzlich teilt sich die Installation in vier Schritte auf: Herunterladen von WordPress und entpacken des ZIP Archivs. Anschliessend werden alle Dateien mit FTP (File Transfer Protocol) auf den Webserver kopiert. Im dritten Schritt wird eine MySQL Datenbank erstellt. Im vierten und letzten Schritt rufen Sie Ihre neue Seite im Webbrowser auf, WordPress meldet sich dann mit einer freundlichen Installationsseite. Keine Sorge, es genügt, die Zugangsdaten der MySQL Datenbank anzugeben. Dann ist WordPress bereits installiert! Wenn Sie Probleme oder Fragen haben, kontaktieren Sie den Kundendienst Ihres Providers. Freundliche Hosting Anbieter (…zu denen Hosttech und SolNet gehören) helfen Ihnen bei der Installation gerne oder erledigen diesen Schritt für Sie!

Falls der letzte Absatz Ihnen nicht ganz verständlich vorkommt: Tut mir leid! Hier finden Sie eine detaillierte Installationsbeschreibung. Ich hoffe, dass Ihnen diese weiterhilft.

Warum gerade WordPress?

Es gibt viele gute CMS (Content Management System), keine Frage! Da sind Joomla!, Drupal, E107, Typo3 und viele weitere. Und damit haben wir hier nur die bekanntesten erwähnt. WordPress ist aber mit Abstand das populärste CMS von allen, was gute Gründe hat. Zählen wir hier nur die wichtigsten auf: WordPress ist leicht zu installieren und zu warten, das Erstellen neuer Seiten oder Blogbeiträge geht leicht von der Hand, die Auswahl an Themes (Gestaltungsvorlagen) und Plugins ist riesig! Wie sieht es mit den Kosten aus? WordPress kostet – nichts! Auch die meisten Plugins und Themes sind gratis! Die Anbieter verdienen ihr Geld mit Support und mit sogenannten «Pro» Versionen. Wenn Sie beispielsweise ein schönes Theme wie «GeneratePress» verwenden, kostet es sie in der Basisversion nichts. Wenn Sie aber alle Funktionen von GeneratePress verwenden möchten, müssen Sie doch noch zur Kreditkarte greifen! Die meisten Themes kosten zwischen 30 und 70 Franken pro Jahr! Dies ist das übliche Geschäftsmodell in der WordPress Welt. Und es funktioniert hervorragend, wie die Praxis zeigt. Rund um WordPress ist in den letzten Jahren eine gigantische Softwareindustrie entstanden.

Und es gibt noch etwas, das für WordPress spricht: Gemäss aktuellen Erhebungen (Januar 2022) verwenden mehr als 40% aller CMS-basierten Webseiten weltweit WordPress.

WordPress Dashboard
WordPress Dashboard

Rein ins Dashboard!

Nun ist WordPress also installiert und Sie haben das Administrator Login für das Dashboard erhalten – oder es selbst definiert. Sie können Ihre Seite im Webbrowser jetzt auch wie folgt aufrufen, ich werde von nun an die Domain hockey-masters.ch als Beispiel verwenden:

Seite aufrufen: http://www.hockey-masters.ch
Dashboard: http://www.hockey-masters.ch/wp-admin

Der Begriff «Dashboard» sagt Ihnen noch nichts? Bei WordPress ist das Dashboard der Admin Bereich. Also der Ort, an dem Sie Ihre Webseite verwalten, Texte schreiben, Bilder hochladen, Themes und Plugins installieren, und so weiter. Kurz: Alles, was benötigt wird, um eine Webseite von A-Z zu erstellen und zu warten.

Falls Sie WordPress noch nicht so gut kennen, empfehle ich Ihnen, sich etwas Zeit für die WordPress Online-Kurse zu nehmen, hier finden Sie aktuelle Workshops und Kurse für einen schnellen Einstieg in unser CMS. Alle Anleitungen sind in englischer Sprache, wenn Sie eine deutsche Dokumentationen bevorzugen, werden Sie auf der Schulhomepage fündig. Hier werden zahlreiche aktuelle Tutorials in freundlichem Deutsch gelistet.

Themes und der Full Site Editor

Sie haben sich etwas eingelesen? Prima, weiter geht’s! Das erste, was nun folgt, ist die Installation eines Themes. Vorab noch etwas zur Terminologie: Themes sind Gestaltungsvorlagen, die das Aussehen Ihrer Webseite in groben Strichen vorzeichnen. Seit der Version 5.9 unterscheidet WordPress zwischen zwei verschiedenen Theme Typen, auf die wir hier kurz eingehen müssen:

Standard Themes: Bis zum 25. Januar 2022 waren alle Themes Standard Themes. Jedes Theme legte selbst fest, welche Bereiche der Seite von Ihnen verändert werden können – und in welcher Form. Bei Standard Themes sind der Kopf- und Fussbereich meist nur eingeschränkt änderbar. Auch der Standort der Menus ist meist vorgegeben, heisst statisch. Und nicht selten sind Standard Themes für eine bestimmte Anwendung oder Branche optimiert, wie zum Beispiel ein Photo-Blog oder ein Online-Shop. Natürlich gibt es aber auch viele Themes, die Wert auf eine allgemeine Einsatzmöglichkeit legen! Beliebte Themes beim Abfassen dieses Beitrages sind Astra, OceanWP und GeneratePress.

Rückblick: WordPress startete 2005 als Blogging Plattform, die Entwicklung von Websiten war nur am Rande ein Thema; erst in den kommenden Jahren wurden Webseiten-Bausteine wie Menus, Seiten und Themes ergänzt. Einen ersten grossen Schritt hin zum Page-Designer kam 2018 mit dem Block-Editor (auch Gutenberg genannt). Mit dem FSE Editor folgt nun ein weiterer Schritt!

Block Themes: Block Themes können mit dem neuen Fullseite Editor verwendet werden, der seit dem 25. Januar 2022 (Version 5.9) zu WordPress gehört (wir kommen gleich auf diesen neuen Editor zu sprechen…) Block Themes haben gegenüber den Standard Themes einen entscheidenden Vorteil: Ein Block Theme erlaubt das Verändern aller Bereiche einer Webseite. Sie können sich das wie ein leeres blatt Papier vorstellen, auf dem nun Inhalte wie Bilder, Texte, Titel und Zitate platziert werden. Sie können dabei selbst bestimmten, was, wo und in welcher Formatierung zu stehen kommt!

Blocks spielen bei WordPress eine entscheidende Rolle! Alle Inhalte einer Seite bestehen aus Blocks: Text, Bild, Liste, Titel, etc. Und jeder dieser Blöcke kann grundsätzlich überall auf der Seite platziert werden: Im Kopf- Fuss- oder Navigationsbereich – überall halt. Es gibt rund 100 verschiedene Blocktypen, die sie auch gruppieren und als eigene Vorlagen speichern können.

Moment, wenn bei einem Block Theme alles verändert werden kann, wozu braucht es dann überhaupt noch ein Theme? Antwort: Block Themes bestimmen das Aussehen Ihrer neuen Seite mit einer Reihe von Vorlagen (z.B. Header, Inhalt, Footer). Aendern Sie daran nichts, bekommen Sie das für ein Theme charakteristische Aussehen. Sie können aber alles, auch die Vorlagen, nach Ihren eigenen Vorstellungen verändern.

Eine (ganz!) kurze Einführung in den Full Site Editor

Formulieren wir es pathetisch: Der Full Site Editor (im Folgenden kurz FSE genannt) macht WordPress zu einem komplett neuen CMS! Mit dem FSE nimmt WordPress Abschied von seinen Wurzeln als Blogging Plattform, es wird zum Page Generator, also zum einem Werkzeug, dass die Gestaltung der kompletten Webseite von einem zentralen Werkzeug aus ermöglicht. Eben, dem FSE! Und so sieht er aus:

WordPress Full Site Editor
Full Site Editor

Auf der linken Seite sehen Sie die hierarchische Listenansicht aller Blöcke auf der Seite mit Header, Inhalt (Abfrage) und einem Fussbereich. Jeder dieser Blöcke hat mehrere untergeordnete Blöcke, beim Header zum Beispiel das Logo, den Titel und das Menu. Wenn Sie diese Baumstruktur jetzt nicht sehen, dann klicken Sie auf das Symbol mit den drei versetzten Strichen oben links auf der Seite. Blicken Sie nun bitte nach rechts, dort erkennen Sie jetzt das Panel zum Verändern der einzelnen Inhaltsblöcke; ein Klick auf das Zahnradsymbol schaltet es ein oder aus. Hier können Sie ganz nebenbei auch die Eigenschaften der ganzen Seite anpassen.

Ganz wichtig: Den Full Site Editor können Sie nur mit Block Themes verwenden. Mit Standard Themes funktioniert der Block Editor nicht!

Und so funktioniert der Full Site Editor, ganz grob beschrieben: Klicken Sie oben links auf das Plus Symbol, um einen Block oder eine Vorlage in Ihre Seite einzufügen; die Eigenschaften können Sie anschliessend im Block Panel verändern. Ferner gibt es noch die Werkzeugleiste, die direkt über dem Block angezeigt wird, mit Ihr können Sie jeden Block auf der Seite verschieben oder ihn ausrichten. Alles ganz einfach? Ok, gehen wir weiter!

…Wenn Ihnen das mit dem FSE nun doch etwas zu schnell voran geht, dann ist das überhaupt kein Problem. Nehmen Sie sich genug Zeit, um sich mit dem FSE und dem Block-Editor anzufreunden. Hier finden Sie das offizielle Block-Editor Handbuch.

Auswahl eines passenden Themes

Kehren wir noch einmal zurück zu den Themes: Jetzt geht es darum, für Ihre schöne neue Seite ein passendes Theme zu finden. Da wir im Folgenden ausschliesslich mit dem FSE arbeiten, ist die Auswahl an Themes zurzeit ziemlich eingeschränkt, es gibt im Moment (Stand 21. Januar 2022) nur etwa 40 Block Themes! Aber keine Sorge, es ist etwas passendes für Sie dabei und die Zahl der Block Themes nimmt rasend schnell zu! Nun also, wählen Sie im Menu Design > Themes und klicken Sie dann auf Theme hinzufügen. Als nächstes wählen Sie die Option ⚙️Nach Funktionen filtern, aktivieren Sie die Option Full Site Editing und wenden Sie den Filter an.

WordPress Block Themes
Block Themes zur Auswahl

Jetzt also stehen nur noch wenige Themes zur Auswahl, aber alle ermöglichen es Ihnen, in kurzer Zeit eine attraktive Seite zu generieren. Ich bleibe für den folgenden Beitrag beim vorinstallierten Thema Twenty-Twenty-Two, weil es zu 100% für den FSE optimiert worden ist – und weil es mit den schönen Vogelbildern cool aussieht!

Tipp: Wenn Ihnen Twenty Twenty Two nicht gefällt (…weil zehntausend andere es auch nutzen werden), versuchen Sie es mit Blockbase, einem schlanken Block Theme, das auf jegliche Zierart verzichtet und den Fokus auf den Inhalt legt. Es sieht gut aus und ist blitzschnell!

Die Hockey Masters

Photo Hockey Masters
Photo: Markus Kammermann

Um die nun folgenden Erläuterungen anschaulicher gestalten zu können, erstelle ich eine fiktive Webseite, die Homepage der Hockey Masters. Eine Seite also, bei der sich alles um eine Eishockey Fangemeinschaft dreht. Ich benötige dazu ein Photo von Markus Kammermann, das Sie auf Pixabay finden können. Natürlich können Sie das Photo und die Texte gemäss Ihrem eigenen Projekt anpassen.

Mit dem Kopf voran…

Und nun sind Sie endgültig bereit, um Ihre Seite ins Leben zu rufen. Als erstes geht es darum, die Startseite für die eigenen Inhalte vorzubereiten, dazu werden zuerst alle (!) Vorlagen gelöscht. Und das geht so: Wählen Sie im Menu Design > Editor um den FSE für Ihre Startseite zu öffnen. Aktivieren Sie nun die Listenansicht, was mit der Tastenkombination Alt+Shift+o besonders schnell geht und klicken Sie auf das oberste Element in der Liste: Header (Dark Small). Drücken Sie dann die Delete Taste, um dieses Element zu löschen. Wiederholen Sie dies nun mit den Einträgen Abfrage-Loop und Footer. Und jetzt? Nun, jetzt ist Ihre Startseite leer. Vielleicht sehen Sie noch einen leeren Textblock, aber den können Sie so stehen lassen. Und jetzt platzieren Sie einen Header nach Ihren Wunsch auf der leeren Seite. Das erledigen Sie mit wenigen Klicks:

WordPress Vorlagen Auswahl
Header Vorlage auswählen
  1. Klicken Sie auf das Plus Symbol, um eine neue Vorlage einzufügen. Wählen Sie das Register Vorlagen.
  2. In der darunter stehenden Drop-Down wählen Sie als nächstes die Option Header. Jetzt sehen Sie eine Liste der verfügbaren Header-Vorlagen. Wenn Ihnen diese Ansicht zu unübersichtlich ist, klicken Sie auf Explore. Jetzt öffnet sich ein weiteres Fenster und zeigt die Vorlagen grösser an!
  3. Wählen Sie als nächstes eine Header Vorlage, die Ihnen gefällt, ein Klick darauf platziert sie sofort auf Ihrer Seite! Ich entscheide mich hier für «Header with Image Background». Nach dem Einfügen sieht unsere Seite etwa so aus:
Webseiten Header ohne Aenderung
Ein neuer Header auf der Seite

Ich gebe Ihnen recht, das Bild will irgendwie nicht so recht zum Titel der Seite passen… also ersetzen wir es. Markieren Sie dazu als erstes den Cover-Block, der das Hintergrund-Bild anzeigt. Sie haben zwei Möglichkeiten, um dies zu tun: A. Öffnen Sie die Listenansicht aller Blöcke und klicken Sie auf Cover. B. Klicken Sie irgendwo über dem Seitentitel, so dass im Block-Panel der Cover Block angezeigt wird. Auf der Werkzeugleiste wählen Sie nun die Option Ersetzen:

WordPress FSE Werkzeug-Leiste
Die Werkzeugleiste für den Cover Block. Mit Ersetzen kann das Bild geändert werden.
Webseiten Header
Der neue Header

Dies öffnet einen Dialog, der Ihnen das Hochladen eines neuen Bildes anbietet. Machen Sie davon Gebrauch und laden Sie ein Photo Ihrer Wahl hoch. Anschliessend sieht die Seite aus wie rechts dargestellt.

Einige Dinge fallen dabei auf: A. Der Titel ist wegen der Farbe kaum mehr lesbar, bei der Navigation siehts nicht viel besser aus (darum kümmen wir und später)! B. Das Photo füllt fast die ganze Seite. Lassen Sie und das nun rasch korrigieren:

Seitentitel anpassen

Was sind Styles? Kleine, überaus praktische Helfer! Mit Styles können Sie global die Farben und verwendeten Schriften Ihrer Seite bestimmen. Und Sie können auch für jeden Blocktyp (Text, Titel, etc.) Farben und Schriftauszeichnungen vordefinieren. Diese werden dann auf jeden neuen Block angewendet, den Sie in Ihre Seite einfügen.

WordPress Styles
WordPress Styles
  1. Der Titel der Seite ist auf dem dunklen Hintergrund kaum lesbar (beim mir half auch die Brille nichts). Kein Beinbruch, wir können ja einfach andere Farben wählen. Nun ist es aber so, dass die Farben des Seitentitels (noch) nicht direkt im Block Panel verändert werden können; wir müssen dazu die Styles bemühen! Die Styles aktivieren Sie durch einen Klick auf das runde, halbseitig eingefärbte Icon.
  2. Wählen Sie Blöcke, dann Seitentitel. Nun können Sie in der Rubrik Farben festlegen, welche Farben für den Seitentitel gelten sollen: Text weiss, Links weiss, Hintergrund blau. Ich verwende hier ein Blau, das ich mit der Pipette in einem Bildprogramm ermittelt habe.
  3. Unter Typographie können Sie einen etwas grössere Schrift bestimmen und unter Layout kann der Innenabstand des Titelblocks vergrössert werden!

Grösse des Headers korrigieren

Ich weiss nicht, wie Sie es halten, aber ich mag es, wenn schon auf den ersten Blick möglichst viel von einer Seite zu sehen ist. Mit Käse fängt man bekanntlich Mäuse, und mit Bequemlichkeit Menschen…(hey, war nur Spass). Also wird nun die Höhe des Headers etwas zurechtgestutzt:

  1. Öffnen Sie die Listenansicht und markieren Sie in der Header Gruppe den Abstandhalter.
  2. Passen Sie in den Block Eigenschaften die Höhe des Abstandhalters an, ich habe von 500 auf 300 korrigert. Wenn Sie diese beiden Anpassungen (Farben, Höhe) vorgenommen haben, sieht das Ergebnis schon um einiges besser aus:
Webseiten Header angepasst
Angepasster Header

Tipp: Den Fokuspunkt des Bildes im Header können Sie natürlich anpassen. Wählen Sie in der Listenansicht den Cover Block und passen Sie den Fokuspunkt an; hier können Sie auch die Deckkraft, den Farbverlauf und einiges mehr anpassen. Interessant für Header Photos sind ferner die Farbverläufe und der Duotone Modus.

Das Menu reparieren

Der Header steht nun also! Aber das Menu da oben am rechten Rand vermag noch nicht zu überzeugen. Es soll nun auch passendere Farben erhalten. Dies kann direkt in den Eigenschaften des Navigations-Blockes erledigt werden – ohne Umweg über die Styles! Und so gehts: Markieren Sie in der Listenansicht den Block Navigation, wählen Sie in den Block Eigenschaften eine weisse Textfarbe und eine für Sie passende Hintergrundfarbe.

Noch etwas über Menus: WordPress unterscheidet zwischen automatischen und selbst erstellten Menus. Automatische Menus, die die Vorgabe sind, listen einfach alle Seiten auf, die Sie erstellen. Sie können sehr einfach von Automatisch auf Manuell wechseln, indem Sie einen Navigations-Block anklicken und dann in der Werkzeugleiste auf Bearbeiten klicken. Bei manuellen Menus sind Sie vollkommen frei; jeder Eintrag kann eine WordPress Seite oder auch ein ganz allgemeiner Link sein.

Kaffeepause…

Kaffee Pause

Vielen Dank, dass Sie bis hierher durchgehalten haben! Nun habe Sie bereits einiges erreicht: Ein neues WordPress vorbereitet, den FSE kennengelernt, einen Seitenheader erstellt und diesen farblich angepasst. Wie wärs mit einer Kaffeepause? Im nächsten Schritt geht es dann zügig voran mit den Inhalten!

Titel und Text für die Startseite

Eine Startseite soll gefällig aussehen und so aufgebaut sein, dass sie den Besucher beim ersten Blick anspricht und ihm innert Sekunden vermittelt, was hier angeboten wird. Farben spielen ein wichtige Rolle, Bilder ebenso; und manchmal ist weniger mehr! Ich werde als Inhalt einige ganz klassiche Elemente wählen: Einen Titel und dann drei Spalten mit Untertiteln und Texten. Dies entspricht einem Schema, das heute häufig anzutreffen ist.

Beginnen wir mit dem Titel: Willkommen bei den Hockey Masters! Sicher wissen Sie jetzt bereits, wie Sie einen Block auf Ihre Seite bekommen: Klicken Sie das Plus Symbol und wählen Sie aus dem Block-Verzeichnis die Überschrift. Klicken Sie den neuen Block auf der Seite an, geben Sie den Text ein und bestimmen Sie die Grösse; am besten indem Sie in der Werkzeugleiste H1 als Titelgrösse wählen. Eigentlich wird damit nicht die Grösse des Titels festgelegt, sondern dessen Stellenwert, H1 steht dabei für einen Titel der obersten Ebene H2 ist ein Untertitel, H3 ein Untertitel von H2, usw. Und wenn Sie gerade dabei sind, generieren Sie doch auch noch einen Lauftext unter dem Titel. Hier ist das Ergebnis:

Titel und Text im FSE
Titel und Text im FSE

Tipp: Um neuen Blöcke einzufügen müssen Sie nicht jedesmal das Plus Symbol bemühen. Sobald der Cursor in einem leeren Block steht, geben Sie einen Schrägstrich ein (/), um eine Block-Auswahlmenu zu öffnen. Wenn Sie das Ansichtsmenu des FSE ( ⋮ ) oben rechts auf der Seite öffnen, finden Sie zudem eine Hilfsseite für alle Tastenkombinationen. Noch einfacher gehts mit der Tastenkombination Shift+Alt+h.

Nun steht das ganze Sortiment der Blöcke für Ihre Seite offen: Text, Bilder, Galerien, Cover, Listen, etc. Wenn Sie neue Inhalte einfügen, sehen Sie sich immer auch die Vorlagen an, sie bieten Ihnen viele Ideen für die Gestaltung Ihres Inhalts.

Als nächstes folgt auf der Beispielseite der Hockey Masters ein Bereich mit drei Spalten, in der Fachsprache gerne auch Feature List genannt. Sie werden dabei auch sehen, wie einfach Blöcke ineinander verschachtelt werden können:

  1. Erstellen Sie einen neuen Block: Spalten. Dies öffnet ein Menu, in dem Sie die Spaltenzahl definieren können. Wählen Sie die Option für drei Spalten.
  2. Nun wird der Spaltenblock angezeigt, in jeder der drei Spalten ist ein + Symbol zu erkennen. Klicken Sie dieses an, um innerhalb der jeweiligen Spalte einen Titel zu erstellen, darunter dann einen Text/Absatz.
Drei Spalten
Drei Spalten

Spalten statt Tabellen: Verwenden Sie Spalten, um Inhalte vertikal zu gruppieren, niemals Tabellen! Warum nicht? Tabellenlayouts werden auf kleinen Bildschirmen nicht optimal dargestellt. Zudem bietet Ihnen das Spaltenlayout wesentlich mehr Gestaltungsmöglichkeiten, zum Beispiel das horizontale und vertikale Ausrichten des Inhalts.

Text und Spalten

Der rechts stehende Screenshot zeigt die drei Spalten, die je einen Titel und einen Text enthalten. Ich habe für die Titelgrösse H4 gewählt, dazu noch Fettschrift. Für den Spalteninhalt stehen Ihnen alle Möglichkeiten des Block Editors offen. Das Ergebnis können Sie wiederum im Screenshot rechts sehen. Es sieht schon ganz nett aus, aber es liegt noch mehr drin. Es folgt ein Vorschlag, wie das Aussehen der Spalten noch etwas «aufgepeppt» werden könnte:

  1. Wählen Sie für jede einzelne Spalte eine eigene Hintergrundfarbe – eine Spalte auswählen geht am einfachsten über die Listenansicht! Ich habe für mein Beispiel zwei Farben aus dem Foto gewählt, rot und blau. Um bestimmte Farben aus einem Photo herauszupicken verwenden Sie ein Bildbearbeitungsprogramm und wählen Sie die Funktion Pipette. Die Textfarbe muss nun natürlich auf Weiss angepasst werden!
  2. Definieren Sie für jede der drei Spalten einen Innenabstand von 10 Pixeln. Ohne diesen Abstand, «klebt» der Text am Rand der Spalte!
  3. Nun noch die Titel: Ich verwende neu H5, fett und zentriert. Um das Aussehen etwas kompakter zu gestalten, habe ich zudem bei jedem Titel den Aussenabstand auf 0 gesetzt. Hier ist das Ergebnis:
Hockey Masters Webseite
Webseite Hockey Masters

Was fehlt nun noch? Ach ja, ein Fussbereich! Den können Sie abermals mit ein paar wenigen Mausaktionen am Ende der neuen Seite einsetzen: Erstellen Sie einen neue Block, dann wählen Sie bei den Vorlagen Footers und finden Sie einen passende Vorlage. Ich habe mich für die Vorlage «Footer with social links and copyright» entschieden. Erstellen Sie für Ihre Seiten immer einen Fussbereich. Dieser gibt dem Besucher ein klares visuelles Feedback, dass dies das Ende der Seite ist. Zudem können hier wichtige Elemente wie ein Impressum oder die Datenschutzerklärung platziert werden. Datenschutzerklärung? Igitt!! Ich weiss, aber sie ist eben wichtig, verwenden Sie im Zweifelsfall diejenige, die WordPress Ihnen anbietet.

Weitere Seiten

Eigentlich sind wir jetzt fertig. Die Seite steht! Gratuliere! Aber sicher werden auch Sie nun fragen: Wie weiter? Und vor allem: Wie kommen zusätzliche Seiten dazu? Neue Seiten erstellen Sie mit WordPress im Menu Seiten > Neu. Wählen Sie einen Titel für die Seite und erstellen Sie dann den Inhalt – genau so wie auf der Startseite! Wenn Sie dann eine Vorschau generieren, sind Sie möglicherweise etwas enttäuscht! Von all den Seitenelementen wie Header und Footer ist überhaupt nichts mehr zu erkennen!

Warum das? Weil Sie bisher erst das Template für die Startseite verändert haben, es heisst Home. Nün müssen Sie auch noch das Template für einzelnen Seiten anpassen, dieses heisst in aller Regel Page. Um dieses Template ebenfalls mit einem gefälligen Header und Footer zu versehen, machen Sie folgendes:

Template Auswahl im FSE
Template Auswahl im FSE
  1. Starten Sie den FSE und klicken Sie oben auf das Symbol zum Wechseln des Templates. Dieses ist beim Start mit dem Wort Home und einem nach unten weisenden Pfeil zu erkennen.
  2. Klicken Sie auf Alle Templates anzeigen. Nun sehen Sie eine Liste aller Templates.
  3. Klicken Sie auf Page und passen Sie das Template an.

Wie kommen die Blog Beiträge auf Ihre Seite? Bis und mit WordPress 5.8 wurde mit dem Seiten-Customizer geregelt, was auf der Startseite zu sehen ist: Blogbeiträge oder eine statische Startseite. Neu können Sie auf jeder Seite eine Blog-Beitragsliste einbauen: Erstellen Sie eine neue Seite und fügen Sie eine passende Abfrage-Vorlage ein – voilà!

Vielen Dank, dass Sie bis zum Schluss mitgemacht haben, ich hoffe, das Tutorial hat Ihnen gefallen und Ihnen ein Bild vemittelt, wie WordPress 5.9 funktioniert.

Vergessen Sie ob all den Neuerungen nicht, dass WordPress weiterhin wie zuvor verwendet werden kann! Dass bestehende Seiten weiterhin funktionieren ist ein zentrales Anliegen der WordPress-Entwickler. Einzig den Customizer werden Sie nicht mehr finden, er ist aber noch da! Geben Sie in der Adresszeile hinter /wp-admin/ folgendes ein: customize.php. Der Customizer wird mindestens noch zwei Jahre zu WordPress gehören – keine Sorge also!