Mit WordPress einen Onepager erstellen ganz einfach

Ganz einfach Schritt für Schritt:

Zunächst müssen wir natürlich über Design > Themes das Theme „twenty twenty“ auswählen. In der Regel ist dieses Theme bereits vorinstalliert, so dass eine Installation nicht notwendig ist.

Schon mal vorab: Da nur einige wenige Anpassungen bezogen auf CSS benötigt werden, brauchen wir dafür nicht unbedingt ein Child Theme erstellen.

Wir fangen mit der Startseite an, die wir ganz normal über den Block-Editor erstellen. Es reicht zunächst, wenn wir die Seite anlegen und als H1-Überschrift „Startseite“ schreiben.

Die Seite wird gespeichert und steht dann zur Verfügung. wir haben noch ein wenig zusätzlichen Text eingegeben:

Jetzt müssen wir die Startseite auch als Startseite in WordPress eintragen. Das machen wir im linken Menü unter Einstellungen > Lesen.

Eine andere Möglichkeit besteht über
Design > Customizer > Startseiteneinstellungen.

Das Logo und Website-Icon einfügen

Über die Reihenfolge der Inhaltselemente im Onepager kann man durchaus geteilter Meinung sein: Bild, Überschrift, Text oder Überschrift, Bild, Text. Die Reihenfolge sollte aber innerhalb einer Website einheitlich sein.

Zunächst fügen wir eine Überschrift ein. Dazu wählen wir den Block „H“ (Überschrift)

Danach wählen wir als Block den Cover-Block. Rechts in den Einstellungen für den Block können neben vielen Einstellungen auch die Overlay-Einstellungen geändert werden. Interessant ist dabei die Einstellung für die Hintergrunddeckkraft. Einfach mal probieren.

Unter dem Bild können wir anschließend einen entsprechenden Text eingeben: In der Regel reicht es, wenn man einfach den Text eingibt. Ansonsten kann man oben links auf das (+) klicken und einen Absatz-Block wählen.

Genau so gehen wir auch wieder bei den folgenden Abschnitten vor: Überschrift notieren, Bild als Cover-Bild einfügen, Text erfassen.

Kommen wir jetzt zum Menü. Bevor wir loslegen, brauchen wir Sprungmarken.

Sprungmarken benötigen eine eindeutige Bezeichnung Diese wird durch das Attribut id=“bezeichnung“ innerhalb eines HTML-Befehls verwendet. 

Das hört sich jetzt kompliziert an, ist aber über den Block-Editor einfach zu lösen. Man klickt auf die Überschrift der ersten Seite und trägt rechts bei „Erweitert“ unter „HTML-Anker“ z. B. „erste“ ein.

Beim Menü müssen die Sprungmarken berücksichtigt werden. Da wird es jetzt ein wenig schwierig, weil hier als Menüpunkt individuelle Links angegeben werden müssen.

1. Wir gehen also folgendermaßen vor: Design > Menüs
2. Anschließend wählen wir „Individuelle Links“
3. Dann tragen wir unter der URL die Sprungmarke nach folgendem Muster ein:
   https://example.com/#uberschrift
   Die Sprungmarke wird also mit einem # hinter der URL angegeben.
4. Anschließend klicken wir auf den Button „Zum Menü hinzufügen“.
5. Auf diese Art verfahren wir bei den folgenden Seiten genauso.
6. Zum Schluss muss das Menü noch gespeichert werden. Dazu geben wir oberhalb der Menüpunkte den Namen des Menüs an, z. B. „Hauptmenü“.
7. Abschließend klicken wir rechts oben auf Button „Menü speichern“.

1. Design/Menüs wählen.
2. Name des Menüs angeben, z.B. Hauptmenü
3. Position im Theme die Hacken bei Horizontales Desktop-Menü und Mobil-Menü lassen.
4. Menü erstellen – klicken.

1. Anschließend wählen wir Startseite und „Individuelle Links“
2. Dann tragen wir unter der URL die Sprungmarke nach folgendem Muster ein:
3. https://example.com/#erste
4. Die Sprungmarke wird also mit einem # hinter der URL angegeben.
5. Anschließend klicken wir auf den Button „Zum Menü hinzufügen“.
6. Auf diese Art verfahren wir bei den folgenden Seiten genauso.
7. Zum Schluss muss das Menü noch gespeichert werden. Dazu oberhalb der Menüpunkte den Namen des Menüs eingeben, z. B. „Hauptmenü“.
8. Abschließend rechts oben auf Button „Menü speichern“ klicken.

1. Erstellen ein neues Menü – klicken.
2. Name des Menüs in den Fall Footer angeben.
3. Welche Seiten in Footer Menü angezeigt werden sollen , auswählen.
4. Menü Einstellungen Footer Menü auswählen.
5. Abschließend klicken wir rechts oben auf Button „Menü speichern“.

1. Auf „+“ und Alle durchsuchen – klicken.
2. Medien / Galerie auswählen.
3. Dateien hochladen oder wenn schon vorher geladen wurden , aus der Mediathek die Bilder auswählen.
4. Anschließend Ausrichtung ändern klicken und Weite Breite oder Gesamte Breite wählen.