GeneratePress | Das perfekte WP-Theme – 12 Tipps

GeneratePress – ein WordPress-Theme

Generate Press ist zunächst nur einer von vielen Entwicklern, die insgesamt 9665 (Stand: September 2023), in der Grundversion kostenlose WordPress-Themes anbieten. Während GeneratePress in den › WordPress Statistiken der meistgenutzten Themes (bezogen auf die Top 1 Millionen Websites) 2024 „nur“ Platz 4 belegte,

1. Hello Elementor – 1,56 %
2. Astra Theme – 1,1 %
3. Divi – 0,95 %
4. GeneratePress – 0,84 %
5. Newspaper – 0,52 %
6. Avada – 0,45 %
7. Genesis Framework – 0,39 %
8. Twenty Seventeen – 0,29 %
9. Flatsome – 0,28 %
10. Kadence Theme – 0,27 %

sagt das wenig über dessen tatsächliche Qualität aus. Bei den davor liegenden Themes handelt es sich um sogenannte Page-Builder (Baukasten-Systeme) bzw. ein Theme (Astra), das ebenfalls die Nutzung von Page-Buildern empfiehlt. Deren Spitzenstellung lässt sich wohl eher darauf zurückführen, dass zunehmend mehr „Laien“ ihre Website selbst bauen möchten und mangels Know-How Baukästen wählen, die in der Werbung mit „Website erstellen in wenigen Minuten“ angepriesen werden. Hinsichtlich der Beliebtheit bzw. den Empfehlungen von Webdesignern fehlen zwar auch hier die üblichen Verdächtigen wie Divi, Astra und Avada nicht, GeneratePress ist dort jedoch zunehmend häufiger unter den 10 beliebtesten oder sogar unter den ersten 5 bei den Empfehlungen anzutreffen.

Lass dich von Statistiken nicht in die Irre führen
Die Ergebnisse beziehen sich auf alle Arten von Websites jeglichen Alters und auch auf solche, die nicht unbedingt von Profis erstellt wurden. Viele Nutzer lassen sich eher vom äußeren Erscheinungsbild und der Auswahl an vorgefertigten Layouts als von der Qualität der Programmierung, der Individualität und dem Support beeindrucken. Wäre das der Fall, sähe das Ergebnis mit Sicherheit anders aus.

Was ist ein Theme?

Grundsätzlich handelt es sich bei einem Theme um

„… eine Zusammenstellung von grafischen Elementen, die das Aussehen von […] Webseiten bestimmen. Innerhalb eines Systems bildet ein Theme eine in sich geschlossene Einheit, die ausgelagert ist und einzeln geladen wird. Dieser Ansatz erlaubt es, das Theme mit geringem Aufwand auszutauschen, ohne dabei andere Funktionseinheiten des Systems zu beeinflussen. – Die meisten Themes werden in PHP geschrieben. Sie enthalten HTML und Stylesheets (CSS) und bilden damit die programmierte Fassung vom einfachen Webdesign. Daneben bieten einige Themes aber auch die Möglichkeit an, ein Custom-Stylesheet zu verwenden, in welchem z. B. Farben oder Schriften angepasst werden können.“
Quelle: arocom

Das Theme legt also die Basisfunktionen und das Gerüst für das Erscheinungsbild und die Funktion fest und besteht somit aus einzelnen Design-Elementen wie Layout (Header, Footer, …), Farben, Schriften, Icons, Buttons, usw. Dies erleichtert die Arbeit beim Erstellen einer Website insofern, dass die seitenübergreifenden Einstellungen nicht einzeln immer wieder neu programmiert, sondern nur noch angepasst und/oder bei Bedarf ergänzt werden müssen.

Dennoch ist Theme nicht gleich Theme. Viele der beliebtesten Themes bringen neben den Grundelementen mehrere fertige Vorlagen sowie die Vorgaben für Sonderelemente mit, wodurch die volle Funktionsfähigkeit häufig erst durch die Installation zusätzlicher Plug-ins erreicht wird. Andere sind zwar einfach konzipiert, lassen sich aber auch nur begrenzt individualisieren oder erweitern.

Ziele von GeneratePress

Häufig nutzen Theme-Entwickler Aktualisierungen u. a. für das Integrieren immer neuer Funktionen und Vorlagen. Einerseits wollen sie damit vor allem den Laien- / Hobby-Designern entgegenkommen, die eine Website nur per Drag & Drop schnell gestalten und möglichst wenig selbst „programmieren“ wollen. Andererseits führt das dazu, dass der Code immer mehr aufgebläht wird. Normalerweise wird dieser beim Aufrufen jeder Website zunächst komplett geladen, unabhängig davon, ob die betreffende Website tatsächlich auch alle darin enthaltenen Elemente verwendet.

GeneratePress geht da seit mehr als 7 Jahren einen anderen Weg. Im Vordergrund stehen für Tom Usborne, den Entwickler des GeneratePress Themes, Geschwindigkeit und Nutzerfreundlichkeit.

„Von Beginn an beabsichtigte GeneratePress, eine leichtgewichtige Grundlage zu sein, die jedes Website-Projekt bewältigen kann. Das Ziel ist es, genau die richtige Menge an Anpassungsmöglichkeiten anzubieten, gleichzeitig aber unglaublich leicht und stabil zu bleiben.“
Quelle: About GeneratePress (aus dem Englischen übersetzt)

Zwar wird auch dieses Theme kontinuierlich aktualisiert und weiterentwickelt, jedoch handelt es sich neben Fehlerbehebungen bzw. Code-Optimierungen nur um neue Optionen. Wenn du diese nicht aktivierst / nutzt, bleibt die Programmierung weiterhin auf die Programmzeilen beschränkt, die für die jeweilige Website tatsächlich benötigt werden. Falls du nur wenige Elemente oder Funktionen einsetzt, ist der Code entsprechend kurz. Aktivierst du eine zusätzliche Funktion, erweitert sich der Code nur um genau die dafür notwendigen Zeilen. Das sorgt nicht nur für kurze Ladezeiten, sondern es treten auch weniger Programmierfehler auf. Außerdem behältst du immer die Kontrolle über alles, woraus sich deine Website zusammensetzt.

GeneratePress – Kostenloses Theme

Wie bei vielen anderen Themes bietet GeneratePress (kurz GP) eine freie Basis- und eine kostenpflichtige Premium- bzw. Pro-Version an. Um das kostenlose Theme zu installieren, loggst du dich in dein WordPress-CMS ein. Anschließend klickest du in der Menüleiste des Dashboards auf

1. Design
2. Themes

Auf der sich nun öffnenden Seite nutzt du oben links den Button Theme hinzufügen und gibst in das Suchfeld (= Themes durchsuchen) GeneratePress ein, dass darauf unterhalb angezeigt wird. Wenn du mit dem Cursor über das Vorschaubild des Themes fährst, erscheinen mehrere Schaltflächen. Einerseits kannst du dir die Details oder eine Live-Vorschau ansehen, andererseits aber auch direkt auf Installieren klicken.

Nachdem die Installation abgeschlossen ist, hast du die Möglichkeit, GeneratePress sofort zu aktivieren oder du wechselst auf deine WordPress Theme-Seite und aktivierst es dort. Wenn du nun deine Website im Browser aufrufst, siehst du, dass sich das Erscheinungsbild verändert hat.

Bei einer neuen Website wurde das WordPress-Standard-Theme mit Header-Bild und verschiedenen Platzhaltern durch eine sehr minimalistische, in den Farben von GeneratePress gestaltete Startseite mit einer Menü-Leiste oben, einem Platzhalter im Inhaltsbereich, einer Beispiel-Seitenleiste sowie einer einfachen Leiste am Ende der Seite ersetzt.

Auch bei einer bereits erstellten Website wechselt das Layout, deine Inhalte bleiben jedoch erhalten. Abhängig davon, welches Theme du für deine alte Website benutzt hattest, musst du unter Umständen einige Elemente wie Bildgrößen, Spalten oder Theme-spezifische Bestandteile anpassen. Etwas aufwendiger ist die Anpassung bei Websites, die ursprünglich mit einem Page Builder oder vorgefertigten Designs erstellt wurden.

Kostenlos oder Premium?
Dank der inzwischen recht umfangreichen Gestaltungsmöglichkeiten, die der Gutenberg-Editor von WordPress bietet, reicht für eine einfache Website das kostenlose Theme eventuell aus. Natürlich sind die Anpassungsoptionen wie bei allen kostenlosen Programmen eingeschränkt. So gibt es nur eine begrenzte Auswahl an Farben, Schriften sowie einige Grundelemente. Darüber hinaus erscheint in der Fußleiste ein Hinweis auf GeneratePress, den du auch nicht so einfach entfernen kannst.

Premium-Theme

Sobald es sich um eine umfangreichere (Unternehmens-) Website handelt, solltest du auf jeden Fall in die Premium-Version von GeneratePress investieren. Damit stehen dir dann alle Werkzeuge für das Erstellen einer wirklich individuellen Website zur Verfügung. Auch kannst du dann natürlich den Hinweis auf GeneratePress im Footer entfernen, was ebenfalls zum professionellen Eindruck der Website beiträgt. Um GeneratePress Premium zu installieren, besuchst du zunächst die Website des Anbieters.

Dort klickst du im Hauptmenü auf Premium und erhältst zunächst Informationen über alle Premium-Features. Wenn du weiter scrollst oder den Button Pricing am Seitenanfang nutzt, gelangst du zur Preisliste. Dort hast du die Wahl zwischen zwei Varianten. Beide beinhalten alle Premium Features, vollen Zugang zur Site Library (Vorlagen-Sammlung) und eine 30 Tage Geld-zurück-Garantie.

Die Lizenz kannst du auf bis zu 500 Websites nutzen – auch bei Kunden, solange du die Websites tatsächlich als Administrator erstellst. Ein Weiterverkauf der Lizenz oder das ausschließliche Installieren und Aktivieren des Produkts auf einer Website ist nicht gestattet.
Leider gibt es nur noch Jahres-Abonnements und keine „Lebenslange Lizenz“ z. B. für professionelle Webdesigner mehr.

• GP Premium: 100+ Starter-Websites, lokale Schriften-Bibliothek, „Theme-Builder“, 100e Anpassungsoptionen, 1 Jahr Updates und Support = 59 US-Dollar pro Jahr (Stand 2024)
• GeneratePress One: GeneratePress Premium + GenerateBlocks Pro + GenerateCloud, voller Zugriff auf alle Features, 1 Jahr Priority E-Mail-Support und Updates = 149 US-Dollar pro Jahr (Stand 2024)

Wenn du dich für eine der Varianten entschieden hast, gelangst du zu einer Formular-Seite. Zur Abwicklung des Kaufs benötigt GeneratePress (EDGE22 Studios) folgende Informationen: Zahlungsmethode (PayPal oder Kreditkarte), deine E-Mail-Adresse und deinen Vornamen sowie „dein“ Land und Bundesland. Darüber hinaus musst du einen Nutzername und ein Passwort anlegen.

Nachdem du den Kauf abgeschossen und eine Bestätigungs-E-Mail / Rechnung erhalten hast, loggst du dich bei GeneratePress ein und klickst rechts oben auf Account > Downloads. Dort findest du eine Liste deiner Käufe sowie dein Profil, dessen Angaben du hier ggf. auch ändern kannst.

Anmeldedaten abspeichern
Bewahre den von dir gewählten Nutzernamen und das zugehörige Passwort sicher, z. B. in einem Password Safe auf. Spätestens wenn du eine zweite Website mit GeneratePress erstellen oder dein Abonnement ändern / verlängern möchtest, wirst du wieder auf deinen Account zugreifen müssen.

Installation

Wichtig für das weitere Vorgehen ist der Kasten mit Informationen über dein GP Premium. Einerseits sind dies Angaben zum Typ (Plugin), zur aktuellen Version, ein Link zur Installationsanleitung (Englisch) sowie das Ablaufdatum (bei einer Jahreslizenz von Bedeutung). Andererseits beginnt hier sozusagen die Installation.

1. Klick auf den Download-Button
2. Lade das Plugin auf deinen PC herunter
3. Kopiere den Lizenzschlüssel
4. Speichere ihn ebenfalls als Notiz auf deinem PC

Zum Fortfahren öffnest du dein WordPress-CMS (wordpress.org) und im Menü der Seitenleiste den Punkt Plugins – nicht Themes!

1. Klick oben links auf Installieren =
2. eine neue Seite mit der Plugin-Auswahl von WordPress öffnet sich.
3. Klick wiederum oben auf Plugin hochladen,
4. darunter auf Datei auswählen, dann
5. auf deinem PC auf die zuvor heruntergeladene zip-Datei (nicht entpacken!)
6. und zum Schluss auf Jetzt installieren.

Sobald der Installationsvorgang abgeschlossen ist, erscheint GP Premium in der Liste deiner installierten Plugins. Dort aktivierst du das Plugin und gehst anschließend auf Konfigurieren. Auf der neuen Seite (auch unter Design > GeneratePress zu finden) schließt du die Installation ab.

Zuerst kopierst du den zuvor gespeicherten Lizenzschlüssel und fügst ihn oben in das entsprechende Feld ein. Sofern der Schlüssel korrekt eingetragen wurde, erscheint oberhalb die grün hinterlegte Mitteilung, dass du Premium Updates erhältst (Receiving premium updates).

Dein Jahres-Abonnement verlängert sich automatisch bei Ablauf des Jahres, sofern du es nicht vorher kündigst. Das ist jederzeit in deinem GP Account möglich. Wenn du es gekündigt hast und das Abonnements-Jahr abgelaufen ist, erscheint unter dem Lizenzschlüssel-Feld die rote Warnung, dass du keine Premium Updates mehr erhältst. Dies hat jedoch keine Auswirkungen auf deine bestehende Website. Es endet nur der Premium-Support und das Plugin wird nicht mehr aktualisiert, sondern lediglich das Basis-Theme.

Premium Version als Plugin
Beachte, dass es sich bei GeneratePress Premium nicht um ein eigenständiges Theme handelt, sondern um ein zusätzliches Plugin mit Erweiterungsmöglichkeiten für das kostenlose Basis-Theme. Lösche deshalb auf keinen Fall das GeneratePress Theme aus deiner Theme Bibliothek!

GeneratePress Module

Unterhalb des Lizenzschlüssels befindet sich auf der Einrichtungsseite eine Liste der sogenannten Module. Einige Optionen ermöglichen es dir, zusätzliche Features in deine Website zu integrieren. Andere erweitern die schon im kostenlosen GeneratePress Theme vorhandenen Anpassungsmöglichkeiten. Im Einzelnen betreffen sie …

• den Customizer:
  • Hintergründe für Seiten, Footer-Widgets, Footer
  • Blog = Beitrags-Übersichts-Seite/n
  • Copyright (s. kostenloses Theme)
  • Menu Plus = erweiterte Optionen für das Hauptmenü
  • Sekundäre Navigationsleiste = zusätzliches Menü im Kopfbereich
  • Typografie = erweiterte Anpassung von Überschriften und Text
• den Editor:
  • Elemente = Deaktivieren einzelner Elemente auf Seiten/in Beiträgen
  • Innenabstand = individuelle Abstände einzelner Elemente zueinander
• Sonstiges:
  • Elements = Seiten-/Beitrags-abhängiges oder Seiten-/Beitrags-übergreifendes individuelles Layout
  • Seiten-Bibliothek (Site Library) = vorgefertigte Designs z.B. für deine Startseite
  • WooCommerce^[1] = zusätzliche Optionen für die Gestaltung von Verkaufs-Websites

^[1] Kann nur nach der Installation des WooCommerce Plugins von WordPress aktiviert werden.

Wie bereits zuvor erwähnt, zeichnet sich GeneratePress durch sein „Leichtgewicht“ aus. Ein Grund dafür sind diese Module. Im Gegensatz zu vielen anderen Themes sind nicht alle Funktionselemente automatisch in die Programmierung für alle Websites integriert. Daher erscheint bei GeneratePress der z. B. für eine sekundäre Navigation notwendige Code nicht in der Programmierung deiner Website, solange du dieses Modul nicht aktiviert hast.

Unterhalb der Modulliste hast du die Möglichkeit, direkt mit der Anpassung einiger Einstellungen zu beginnen. Ich empfehle jedoch, dies im Customizer zu tun, wo du systematisch jeden einzelnen Punkt durchgehen solltest. Wie du mit diesem Customizer arbeitest, erfährst du in einem eigenen Beitrag über den GeneratePress Customizer.

Am Ende dieser Seite bietet dir GeneratePress noch an, alle oder einige deiner Einstellungen zu exportieren bzw. aus einer zuvor auf deinem PC gespeicherten Datei zu importieren. Über den Button am Ende der Seite kannst du alle Einstellungen mit einem Klick zurücksetzen.

Nur die benötigten Module aktivieren
Du selbst bestimmst bei GeneratePress, welche Erweiterungen du auf deiner Website tatsächlich einsetzt. Aktiviere nur die Module, die du tatsächlich verwenden willst und lasse alle anderen deaktiviert. Natürlich kannst du deine Auswahl auch jederzeit ändern, falls du später ein neues Modul hinzufügen möchtest oder ein aktives doch nicht (mehr) benötigst.

Abschnitte

Das in älteren Versionen von Generatepress noch wählbare Modul „Abschnitte“ wird eingestellt. Stattdessen empfehlen ich der Entwickler von GeneratePress und auch ich als Webdesignerin die Installation des Plugins GenerateBlocks – aus demselben Haus. Insbesondere wenn du auf vielen Seiten Bereiche individuell gestalten möchtest, lässt es sich damit sehr flüssig und intuitiv arbeiten.

GeneratePress Elements

Auf vielen Websites dürfte sich das Modul Elements als sehr nützlich erweisen. Es ermöglicht dir beispielsweise, das als Standard seitenübergreifend eingestellte Erscheinungsbild nur für (eine) spezielle Seite(n) zu ändern, ohne dass andere Seiten/Inhalte davon betroffen sind.

Im Menü des WordPress Dashboards unter Design findest du den entsprechenden Unterpunkt. Sobald du darauf klickst, öffnet sich eine neue Übersichtsseite mit den bereits vorhandenen Elementen bzw. einem Button, über den du ein neues Element erstellen kannst.

Nach einem Klick auf Neues Element hinzufügen, erscheint ein kleines Auswahlmenü, wo du den gewünschten Element-Typ (Block, Hook, Layout oder Kopfbereich) auswählst. Welcher der richtige ist, hängt davon ab, welchen Bereich du modifizieren möchtest. Falls beispielsweise das Design für den Fußbereich individuell gestaltet werden soll, wäre dies ein „Block“.

Unabhängig davon, für welchen Typ du dich entschieden hast, bestimmst du im Editor für jedes Element selbst die Anzeigeregeln. Das bedeutet, dass du festlegst, ob dein neugestaltetes Element den Standard nur auf bestimmten Seiten, in bestimmten Kategorien, für bestimmte Benutzer, etc. ersetzen soll. Außerdem hast du die Möglichkeit, bei einem eigentlich für die gesamte Website wirksamen Element beispielsweise einzelne Seiten auszuschließen.

Editor für Elements

Je nach Elements-Typ verändert sich der Editor und bietet dir genau die Anpassungsmöglichkeiten an, die zur Veränderung des gewünschten Bereichs notwendig sind. Während es bei den Typen Layout und Kopfbereich (Navigation) nur wenige Optionen gibt, gleicht der Editor für den Typ Block dem für die Bearbeitung von Seiten/Beiträgen. Um das Ergebnis auf der Website sehen zu können, musst du deine Eingaben immer zuerst speichern. Falls du weitere Änderungen vornehmen möchtest, klickst du in der Elements-Übersicht unter dem betreffenden Element auf „Bearbeiten“ und nach der Bearbeitung wieder auf „Speichern“.

Beispiel: Du möchten den Titel-Bereich um eine kurze Inhaltsbeschreibung, Angaben zur Kategorie oder Ähnliches ergänzen und mit einem besonderen Layout versehen. Dazu wählst du den Typ Block aus. Zuerst trägst du in die oberste Zeile den Namen des Elements ein. Dieser dient nur zu deiner Orientierung und erscheint nicht auf deiner Website. Anschließend bestimmst du in der rechten Seitenleiste mittels Auswahllisten, wo du den neuen Bereich einsetzen möchtest:

1. Element Typ: Page Hero (soll auf einer Standard-Seite einen Bereich hinzufügen oder ersetzen), Seitenleiste, Footer, etc.
2. Quick Hook Select: Stelle, an der das Element sich festhaken soll, z. B. after header (unter dem Seitenkopf), before content /-container (vor dem Inhalt/s-Container), …
3. Hook name (Name des Haken): z. B. after header

Darüber hinaus hast du noch die Möglichkeit, den Titel, das Beitragsbild und/oder die primären Post-Metadaten zu deaktivieren. Dies ist immer dann sinnvoll, wenn du z. B. einen neuen Seitenkopf erstellst und eine doppelte Anzeige des Titels oder Beitragsbilds vermeiden möchtest. Anschließend kreierst du im Eingabefeld des Editors mit Hilfe der Gutenberg-Blöcke wie gewohnt ein/dein neues Layout.

Vergiss nach der Fertigstellung nicht, anzugeben, wo dieses Element den ursprünglichen, im Customizer festgelegten Standard ersetzen soll. Natürlich hast du auch die Möglichkeit, die Vorlage jederzeit zu bearbeiten, indem du Teile davon löschst, verschiebst, etwas hinzufügst oder sonstige Design-Anpassungen vornimmst bzw. das Element komplett entfernst.

Templates als Inspiration
Falls es dir an Ideen mangelt oder du zwar eine Vorstellung von einem Layout hast, aber nicht weißt wie du sie umsetzt, findest du ebenfalls in der rechten Seitenleiste unter Templates einige Design-Vorlagen. Per Klick fügst du eine Vorlage in den Editor ein und kannst diese direkt übernehmen oder ggf. weiter anpassen.

Weiterlesen – Site Library, Documentation

GeneratePress Theme | Teil 2