Die Startseite deiner Website verdient besondere Aufmerksamkeit, sie ist oft die erste Seite deiner Website, die deine Besucher zu sehen bekommen. Als Startseite kannst du bei WordPress entweder die letzten Beiträge anzeigen lassen oder eine statische Seite festlegen.

Frankfurt kommt mit einem eigenen Template für die Startseite mit großem Headerbild über die volle Seitenbreite inklusive Call to Action Element – Conversion-Optimierung ist somit bereits in der Theme-Architektur integriert.

Frankfurt Stratseiten-Header
Frankfurt Stratseiten-Header

Was musst du tun, um in den Genuss der Frankfurt-spezifischen Startseite zu gelangen? Nicht viel, denn sobald du das Theme zum ersten Mal aktivierst, generiert Frankfurt diese Seite automatisch.
(Möchtest du die Seite noch einmal generieren?)

Du findest sie im Backend unter Seiten aufgelistet, der Titel lautet Startseite, das zugewiesene Seiten-Template heißt ebenfalls Startseite.

Nun musst du sie lediglich konfigurieren und nach deinen Wünschen gestalten. Solltest du die Startseite versehentlich gelöscht haben, kannst du sie natürlich von Hand neu erzeugen.

Wichtig: Frankfurt unterscheidet bei der Startseite zwischen Installationen mit aktiviertem WooCommerce (Shops) und Installationen ohne WooCommerce (Blogs/statische Webseiten). Beiden gemeinsam ist der große Header. Wir zeigen dir hier, wie du den Header einrichtest und welche Gestaltungsmöglichkeiten du mit und ohne WooCommerce hast.

PermalinkHeader einrichten

Um das große Headerbild und die darüber liegenden Elemente einzurichten, gehe wie folgt vor:

  1. Öffne die automatisch generierte Seite Startseite zum Bearbeiten.
  2. Lege ein eigenes Beitragsbild fest, das am besten mindestens 1500px breit ist. Dieses Bild wird als Headerbild angezeigt.
  3. Gehe in den Editor und bearbeite den Text. Am besten du benutzt nicht den visuellen Editor, sondern den Texteditor. So siehst du, welches Markup für die einzelnen Elemente notwendig ist, um so dargestellt zu werden wie in der Theme Demo. Das erste Element mit dem Markup

    kannst du entfernen, das haben wir für den Hinweis an dich verwendet.

    Frankfurt Startseite bearbeiten.
    Die Frankfurt-Startseite im Backend.

    PermalinkGestaltung mit WooCommerce

    Hast du WooCommerce installiert und aktiviert, gehe ins Frontend und öffne den Customizer. Im Abschnitt Statische Startseite findest du drei Optionen, über die du auf der Startseite Elemente aus deinem Shop anzeigen kannst.

    1. Empfohlene Produkte anzeigen: zeigt bis zu 4 Produkte an, die du als empfohlen markiert hast. Ein Produkt kannst du auf empfohlen setzen, indem du im Backend unter Produkte den Stern bei den betreffenden Produkten anwählst.
    2. Neue Produkte anzeigen: zeigt die Produkte sortiert nach Datum der Veröffentlichung in einem Slider an.
    3. Produktkategorien anzeigen: zeigt die Produktkategorien in einem Slider an.
    Optionen für Frankfurt Startseite mit WooCommerce
    Optionen im Customizer für die Frankfurt Startseite mit aktiviertem WooCommerce

    PermalinkGestaltung ohne WooCommerce

    Möchtest du keinen Shop betreiben, so machen die im vorherigen Abschnitt genannten Optionen keinen Sinn. In diesem Fall kannst du die Frankfurt-Startseite ähnlich einer normalen statischen Seite einrichten:

    1. Öffne die Startseite zum Bearbeiten und gehe in den Editor.
    2. Nach den Elementen, die über dem Headerbild liegen, findest du das more-Tag. Alles was du nach dem more-Tag einfügst, wird als normaler Seiteninhalt im Anschluss an das Headerbild ausgegeben.
    3. Füge Text, Bilder etc. ein und gestalte dir auf diesem Wege deine individuelle Startseite.
    Frankfurt Startseite mit more-Tag
    Die Frankfurt Startseite mit zusätzlichem More-Tag und Inhalt für Websites ohne WooCommerce.
    Startseite ohne WooCommerce im Frontend
    Und so sieht das Ganze dann im Frontend aus – Headerbild und Seiteninhalt.

    PermalinkStartseite neu generieren

    Sobald du Frankfurt zum ersten Mal in deiner WordPress-Installation aktivierst, generiert es seine beispielhafte Startseite einmalig automatisch. Dabei wird eine Theme Modification (theme mod) gesetzt. Diese verhindert bei der nächsten Aktivierung das erneute Generieren einer weiteren Beispielseite – besser so, immer wieder neu generierte Startseiten könnten beim Testen des Themes schnell stören.

    Wenn du die automatische Startseite aus bestimmten Gründen noch einmal generiert haben möchtest, kannst du das folgende Code-Snippet nutzen, um die entsprechende theme mod, sowie die zuerst generierte Startseite und ihr Beitragsbild zu löschen. Bei der nächsten Aktivierung wird Frankfurt dann wieder eine Startseite generieren.

    Für das folgende Vorgehen sollte Frankfurt als Theme aktiviert sein:

    1. Öffne die Datei functions.php von Frankfurt zum Bearbeiten in einem Texteditor.
    2. In Zeile 35 beginnt die Setup-Funktion function frankfurt_setup(). Kopiere in die darauf folgende Zeile den folgenden Code-Schnipsel:

    1. Speichere die Datei und rufe einmalig irgendeine Seite im Frontend oder Backend auf.
    2. Der Code in der functions.php wurde ausgeführt, wenn du nach dem Neuladen auf der Seite Themes im Backend landest und das Standard-Theme aktiv ist.
    3. Entferne nun den Code-Schnipsel aus der functions.php von Frankfurt wieder und speichere die Datei.
    4. Aktiviere Frankfurt im Backend erneut als Theme: die theme-eigene Startseite wird noch einmal generiert und du wirst auf die neue Startseite weitergeleitet.