WebMasterService N3rds@Work

UpFront Theme Framework

Willkommen bei UpFront!

Dieser Leitfaden führt Dich in Upfront als Theme Framework ein. Hier erfährst Du, wie Du den UpFront Core, die UpFront-Starter-Themes und das UpFront Kreator-Plugin installierst.

Um tiefer in die Magie von UpFront einzutauchen, möchten wir Dich bitten, Dich dem UpFront Kurs anzuschließen in der N3rd-Akademie!

1.1 Upfront-Grundlagen

UpFront ist ein revolutionäres Themen-Framework, mit dem sich schöne, anspruchsvolle Websites intuitiv erstellen lassen und Spaß machen! Unser UpFront-Team hat das einfache Ziehen und Ablegen für Anfänger mit einem erweiterten Funktionsumfang kombiniert, der sowohl für professionelle Designer als auch für Entwickler perfekt ist.

UpFront-Komponenten

UpFront besteht aus drei Hauptkomponenten:

  • Upfront Framework — Dies ist der Rahmen selbst. Der Upfront-Core muss installiert sein, um eines unserer Upfront-Starter-Themes oder das Upfront Builder-Plugin verwenden zu können.
  • Upfront Starter Themes — Dies ist unsere wachsende Bibliothek vorgefertigter Upfront-Themen. In Kapitel 2 wird erläutert, wie Du ein UpFront-Starter-Theme installierst.
  • Upfront Kreator Plugin — Mit dem Kreator-Plugin kannst Du Deine eigenen UpFront-Designs von Grund auf neu erstellen oder ein vorhandenes Design ändern, das Du auf mehreren Webseiten verwenden möchtest. Das BKreator-Plugin hat ein eigenes Dokument, „Using Upfront Builder“, in dem Du mehr über die Funktionsweise des Plugins neben UpFront erfahren kannst. In Kapitel 3 dieses Dokuments wird die Installation des UpfFront Kreator-Plugins erläutert.

Upfront Struktur

uf-layers-800x581

Das obige Diagramm zeigt die Struktur eines UpFront-Themas am Beispiel der Homepage des Panino-Themas. Die Struktur besteht aus drei Ebenen: Global Theme Hintergrund, Regionen und Elemente. Der Global Theme BG-Layer ist auf der Panino-Homepage nicht zu sehen. Wenn jedoch für eine der Regionen eine Volltonfarbe mit einer Deckkraft von 0% festgelegt wird, wird Global Theme BG angezeigt.

Das folgende Diagramm ist eine Verknüpfung und beschreibt, wo auf die oben genannten Ebenen zugegriffen und diese bearbeitet werden können.

updated_areas-access-800x392

Hinter den Kulissen von UpFront

UpFront funktioniert etwas anders, je nachdem, mit welcher Methode Du Dein Design änderst.

  • Wenn Du Dein Theme mit dem UpFront-Editor änderst, auf den Du durch Klicken auf den UpFront-Link in Deiner WordPress-Administrationsleiste zugreifst, werden alle Änderungen in Deiner WordPress-Datenbank gespeichert.
  • Wenn Du ein Starter-Design änderst oder ein neues Design von Grund auf im UpFront Kreator erstellst, werden PHP-Dateien und eine Ordnerstruktur erstellt, die ein normales WordPress-Designs widerspiegelt. Diese Methode wird für Benutzer benötigt, die die von ihnen erstellten UpFront-Starter-Designs verteilen möchten.

1.2 Auswählen und Installieren eines UpFront Starter-Themas

Wir haben einige erstaunliche Starter-Themes erstellt, um Dir den Einstieg in UpFront zu erleichtern. Jedes wurde für eine bestimmte Nische entworfen, und die Schönheit unserer Starterthemen liegt in ihrer Flexibilität. Wenn es kein Starter-Thema gibt, das Deinen speziellen Anforderungen entspricht, kannst Du ganz einfach ein Theme mit Elementen finden, die Dir gefallen, und es an Deine Anforderungen anpassen.

Um ein Starter-Theme zu installieren, hast Du zwei Möglichkeiten:

  1. Lade UpFront Core und das Starter-Theme Deiner Wahl von den Projektseiten hier auf WMS N@W herunter (Links folgen jedem Vorschaubild unten) und lade es über Designs>Themes> Neu hinzufügen> In Deinen WordPress-Administrationsbereich hoch.
  2. Lade es wie oben beschrieben herunter, entpacke die Dateien und lade die Ordner mit den Startthemen per FTP in Dein Verzeichnis wp-content/themes / hoch.

Fixer

Fixer ist ein kühnes, unterhaltsames Thema, das Kunden zum Kauf Ihrer Dienste verleitet.

Fixer Upfront theme preview

Download Fixer

Gillie

Gillie ist ein Thema für YouTube-Nutzer, die eine Webseite zur Bewerbung ihres Kanals mit einem Hauch Avantgarde haben möchten.

Gillie Upfront theme preview

Download Gillie

Issue

Issue ist ein Traum für Blogger. Mit einer Titelseite, bei der Ihre Leser nicht widerstehen können, Sie anzuklicken .

Issue Upfront theme preview

Download Issue

Luke & Sara

Luke & Sara wurde für Fotografen entwickelt und ist ein ideales Thema, um Fotos zum Platzen zu bringen.

Luke and Sara Upfront theme preview

Download Luke & Sara

Panino

Panino wurde für Restaurants gebaut und hat bekanntermaßen mehrere WPMU DEV-Teammitglieder hungrig gemacht, während sie daran arbeiteten. Panino kombiniert eine reichhaltige Verwendung von Farben mit wunderschönen Bildern und trendiger Typografie.

Panino Upfront theme preview

Download Panino

Parrot

Parrot soll Ihnen beim Verkauf Ihrer App helfen. Parrot ist unkompliziert und minimalistisch und hilft dabei, eine App auf saubere und effiziente Weise zu präsentieren, um die Aufmerksamkeit auf sich zu ziehen.

Parrot Upfront theme preview

Download Parrot

Schriftsteller und Typografie-Liebhaber werden sich über den eleganten und raffinierten Ton von Scribe freuen.

scribe700x448-1

Download Scribe

Spirit

Spirit ist ein beruhigendes, erhebendes Thema, das sich perfekt für Yoga und Tanzstudios eignet. So können Sie Ihre Räumlichkeiten und Unterrichtsstunden wunderschön präsentieren.

Spirit Upfront theme preview

Download Spirit

1.3 Installieren des UpFront Kreator-Plugins

Wie der Name schon sagt, der UpFront Kreator wird nicht zusammen mit Deinen UpFront-Themes oder dem UpFront-Framework in wp-content/themes / installiert. Es ist in /wp-content/plugins / installiert.

Wie bei unseren anderen Produkten kannst Du die Installation durch Herunterladen von der UpFront Builder-Produktseite und Hochladen über FTP oder über Plugins> Neu hinzufügen> Hochladen durchführen.

Aktiviere das Plugin über die Registerkarte Installierte Plugins in Deiner WordPress-Administration.

Wenn die Installation erfolgreich war, wird im Admin-Menü Ihres WordPress-Administrationsbereichs eine erweiterte Registerkarte „UpFront“ angezeigt.

0 0Produkte

Dein Warenkorb ist leer.

Produkte welche dem Warenkorb hinzugefügt wurden, werden hier angezeigt