UpFront 7: Arbeiten mit Seiten und Beiträgen

1. Egal, ob Du Deinem Geschäftsportfolio eine detaillierte Produkt- und Dienstleistungsseite hinzufügen möchtest oder nur einen kurzen Blogbeitrag schreiben musst, UpFront bietet eine leistungsstarke und dennoch intuitive Plattform für die schnelle Erstellung von Seiten und Beiträgen im Frontend Deiner Webseite.

Mit UpFront kannst Du sogar Seiten und Beiträge so gestalten, wie Du möchtest, und Deine Inhalte sind immer noch vorhanden, wenn Du das Theme wechselst, frei von unerwünschten Shortcodes und unordentlichen Formatierungen.

Im heutigen Beitrag, dem letzten in unserer Serie, in dem ich die Verwendung von UpFront vorstelle, zeige ich Dir, wie einfach es ist, Seiten und Beiträge zu erstellen.

Im Rahmen dieser Serie adaptieren wir ein bestehendes UpFront-Theme – in diesem Fall Spirit – und verwandeln es in eine völlig andere Webseite, komplett mit eigenem Branding, Bildern, benutzerdefinierten Schriftarten und responsivem Layout.

Im Laufe dieser Serie werden wir Dir anhand vieler Beispiele zeigen, wie Du UpFront verwenden kannst:

• Teil 1: Die Grundlagen, Themenfarben und Typografie
• Teil 2: Strukturieren Deiner Webseite mit Regionen
• Teil 3: Gestalten der Webseite mit Elementen
• Teil 4: Optimieren von Elementen und benutzerdefiniertem Code
• Teil 5: Hinzufügen von Plugins und Formatieren von Gravity-Formularen
• Teil 6: Erstellen von responsiven Webseiten
• Teil 7: Arbeiten mit Seiten und Beiträgen

Wir nehmen das Spirit-Thema und überarbeiten seine Regionen und Inhalte komplett und verwandeln es in ein Produktthema, komplett mit eigenem Branding, Farben, Schaltflächen, Bildern, Typografie, Newsletter-Anmeldeformular und anderen Elementen.

In dieser Serie haben wir Designfarben aktualisiert, benutzerdefinierte Schriftarten hinzugefügt, Bereiche gelöscht, das Headerbild aktualisiert, einen Videobereich in voller Breite hinzugefügt, ein Newsletter-Anmeldeformular mit Gravity Forms erstellt und gestaltet und das responsive Layout für mobile Geräte aktualisiert.

Erstellen eines neuen Beitrags

Um einen Beitrag zu erstellen, musst Du nur auf „Neuer Beitrag“ in der linken Seitenleiste klicken. Der UpFront-Post-Editor wird geladen, sodass Du Text und Bilder zu Deinem Beitrag hinzufügen kannst (doppelklicke einfach auf die Textbereiche), aber keine UpFront-Elemente (dazu kommen wir bald).

Wenn die rechte Seitenleiste bekannt aussieht, liegt das daran, dass sie fast identisch mit den Veröffentlichungsoptionen im ClassicPress-Post-Editor ist. In der Seitenleiste kannst Du einen Entwurf speichern, eine Vorschau Deines Beitrags anzeigen und den Status, die Sichtbarkeit und das Veröffentlichungsdatum des Beitrags aktualisieren. Wichtig ist, dass Du in der Seitenleiste auf „Veröffentlichen“ klickst und Deinen Beitrag mit der Welt teilst.

Am unteren Rand der Seitenleiste gibt es weitere Optionen zum Hinzufügen von Kategorien und Tags, und Du kannst auch die URL aktualisieren.

Wenn Du auf „Veröffentlichen“ klickst, werden Deine Inhalte gespeichert und veröffentlicht und die übliche UpFront-Seitenleiste wird auf der linken Seite wieder angezeigt.

Wenn Du auf „Abbrechen“ klickst, kehrst Du auch zum UpFront-Editor zurück. Vergiss nicht, Deinen Entwurf zu speichern, da Du sonst Deine Inhalte verlierst.

Erstellen einer neuen Seite

Das Erstellen einer Seite ist fast identisch mit der Art und Weise, wie Du einen neuen Beitrag erstellen würdest. Der einzige Unterschied besteht darin, dass Du, wenn Du in der linken Seitenleiste auf „Neue Seite“ klickst, aufgefordert wirst, Deiner Seite einen Namen zu geben und eine Seitenvorlage auszuwählen.

Wenn du auf „Seite erstellen“ klickst, wirst du zum Seiteneditor weitergeleitet, wo du Text und Bilder sowie Elemente zu deiner Seite hinzufügen kannst.

Es ist wichtig zu beachten, dass Du, wenn Du keine Seitenvorlage verwendest, der Seite keine Elemente hinzufügen kannst (dazu kommen wir auch in Kürze).

Vorgefertigte Vorlage im Vergleich zu keiner Vorlage

UpFront arbeitet nach einem Paradigma, das auf Layouts basiert, mit dem Du komplexe Seiten für Deine Webseite erstellen und dennoch Zugriff auf Deine Inhalte hast, wenn Du das Theme wechselst. Dies bedeutet, dass Du nie an die Verwendung von UpFront gebunden bist oder Zeit damit verschwenden musst, Shortcodes von Deinen Seiten zu entfernen, wenn Du Dich entscheidest, Themes zu wechseln.

Wichtig ist jedoch, dass Du beim Erstellen einer neuen Seite die richtige Vorlage auswählst, wenn Du Dich später entscheidest, dass Du ein anderes Theme verwenden möchtest.

Wenn Du eine neue Seite erstellst, die keine Vorlagen verwendet, d. H. Du wählst „Keine“ in der Dropdown-Box „Seitenvorlage“, erstellt im Grunde eine Standard-ClassicPress-Seite. Der einzige Unterschied besteht darin, dass Deine Inhalte als neues Element gespeichert werden. Das heißt, wenn Du Deine neue Seite speicherst oder veröffentlichst und zum UpFront-Editor wechselst, kannst Du Deinen Text und/oder Deine Wörter wie jedes andere Element verschieben. Um den Inhalt Deiner Seite zu bearbeiten, doppelklicke einfach darauf und Du kehrst zum Seiteneditor zurück.

Wenn Du Dich dagegen für eine vorgefertigte Vorlage entscheidest, wird Dein Inhalt Teil des Layouts und nicht in der Datenbank Deiner Webseite gespeichert. Das bedeutet, dass Du, wenn Du zu einem anderen Theme wechselst, z. B. Twenty Fifteen, nicht auf Deine Inhalte zugreifen kannst. Wenn Du das Design jedoch erneut aktivierst, wird der Inhalt ebenfalls erneut aktiviert, sodass Du ihn nie verlierst.

Hinzufügen von Upfront-Elementen zu Seiten und Beiträgen

Wenn Du eine Seite oder einen Beitrag speicherst oder veröffentlichst, kehrst Du zum UpFront-Editor zurück, wo Du auf Elemente zugreifen kannst. Das bedeutet, dass Du Deinem Beitrag oder Deiner Seite neue Elemente hinzufügen oder Deine Inhalte verschieben, in der Größe ändern oder löschen kannst (da sie jetzt als Element behandelt werden).

Verwenden eines globalen Headers.

Derzeit bietet UpFront Benutzern die Möglichkeit, globale Kopf- und Fußzeilenbereiche zu erstellen. In Spirit ist die globale Kopfzeile die Navigationsleiste und die Fußzeile ist, nun ja, die Fußzeile.

Wenn Du einen beliebigen Aspekt einer Region änderst, die als globale Region definiert ist, werden die restlichen Seiten, die diese Region verwenden, ebenfalls aktualisiert, um die Region mit Deinen Änderungen zu verwenden.

Dies ist sehr praktisch, da die meisten Seiten Deiner Webseite wahrscheinlich globale Kopf- und Fußzeilen haben. Das bedeutet, dass Du diese nur an einer Stelle aktualisieren musst.

Im Spirit-Design verwendet die Startseite keine globale Kopfzeile. Stattdessen haben wir eine „Helden“-Region, gefolgt von der Navigationsregion. Alle anderen Seiten in Spirit verwenden eine globale Navigationskopfzeile. Das bedeutet, dass Du, wenn Du diese auf ein anderes Design aktualisieren möchtest, den Navigationsbereich auf der Homepage manuell aktualisieren und ihn dann auf einer der von Spirit bereitgestellten Seiten ändern musst (wo er als globaler Bereich definiert ist).

Es sei darauf hingewiesen, dass wir bereits an einer Funktion arbeiten, die es Benutzern ermöglicht, mehrere globale Regionen (nicht nur Kopf- und Fußzeilen) zu erstellen und sie überall auf Deiner Webseite zu laden. Diese Funktion wird ziemlich bald ausgeliefert, also beobachte diesen Bereich.

Zugriff auf Beiträge und Seiten

Um auf Deine vollständigen Listen mit Beiträgen und Seiten zuzugreifen, klicke in der linken Seitenleiste auf Posts/Seiten/Kommentare . Es wird ein Overlay angezeigt, in dem Du auswählen kannst, ob Du Deine Inhalte bearbeiten, anzeigen oder löschen möchtest. Klicke einfach oben auf die Registerkarten „Beiträge“ und „Seiten“, um zwischen den beiden zu wechseln.

Zusammenfassung

In diesem Beitrag haben wir gelernt, wie einfach es ist, Seiten und Beiträge in UpFront zu erstellen.

Dies ist der letzte Beitrag in unserer Serie zur Nutzung unserer Themenplattform. In sieben Beiträgen haben wir das Spirit-Theme angepasst und es in eine vollständig responsive One-Pager-Site für ein Produkt verwandelt. Auf dem Weg dorthin haben wir die Typografie aktualisiert, Bilder und Videos in voller Breite hinzugefügt sowie ein Gravity Forms-Newsletter-Anmeldeformular erstellt und gestaltet.

Ich hoffe, Du fandest diese Serie hilfreich! UpFront macht es wirklich einfach, das Design Deiner Webseite so einfach anzupassen, dass Du nie wieder ein ClassicPress-Theme benötigst.

Lese den ersten Beitrag in dieser Serie: Teil 1: Die Grundlagen, Themenfarben und Typografie

Wenn Du Fragen zu dem hast, was wir in diesem Beitrag behandelt haben, kannst Du gerne im Forum unten nachfragen.

[forum id=“7″]

So verwendest Du die UpFront-Serie in der optimalen Reihenfolge:

• Teil 1: Die Grundlagen, Themenfarben und Typografie
• Teil 2: Strukturieren Deiner Webseite mit Regionen
• Teil 3: Gestalten der Webseite mit Elementen
• Teil 4: Optimieren von Elementen und benutzerdefiniertem Code
• Teil 5: Hinzufügen von Plugins und Formatieren von Gravity-Formularen
• Teil 6: Erstellen von responsiven Webseiten
• Teil 7: Arbeiten mit Seiten und Beiträgen