Produktbeschreibung

Möchten Sie mit Ihrer WordPress-Seite auffallen, geht nichts über ein individuelles Design. Webprofi Jonas Hellwig zeigt Ihnen in diesem umfassenden Praxis-Training, wie Sie ein maßgeschneidertes WordPress-Theme entwickeln und gestalten. Sie verfolgen live am Bildschirm, wie die Beispielseite Schritt für Schritt entsteht und mit zahlreichen modernen Funktionen erweitert wird. Dabei lernen Sie jede Menge nützliche Werkzeuge und Plug-ins kennen und erweitern Ihr WordPress-System um effektive Funktionen wie Multisite oder das Shop-System WooCommerce.

Trailer

YouTube

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.

Video laden

Demo-Lektionen

Lektion »2.9. Themes anpassen mit Widgets« [07:22 Min.]

Das Text-Widget können Sie nutzen, um Design-Änderungen vorzunehmen, die mit dem Customizer nicht möglich sind. Jonas Hellwig zeigt Ihnen, wie Sie mit dem Text-Widget CSS-Code einfügen, um einen transparenten Hintergrund zu erhalten.

YouTube

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.

Video laden

 

Lektion »4.4. Template-Dateien erstellen und verknüpfen« [14:44 Min.]

In diesem Video sehen Sie, wie Sie die Verbindung zur Datenbank herstellen und die responsive Basisgestaltung mithilfe von Klassenattributen vornehmen. Anschließend erstellen Sie die grundlegende Template-Struktur für Ihr Theme.

YouTube

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.

Video laden

 

Lektion »5.6. Navigation und Suche für Mobilgeräte integrieren« [16:37 Min.]

Für die Darstellung auf kleinen Bildschirmen werden gern Aufklappmenüs verwendet. Sie lernen in diesem Video, wie Sie mit jQuery ein solches aufklappbares Menü erstellen. Jonas Hellwig zeigt Ihnen außerdem, wie Sie das Suchformular für Mobilgeräte optimieren.

YouTube

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.

Video laden

 

Lektion »7.7. Eine Lightbox-Funktion ohne Plug-in« [05:45 Min.]

Mithilfe einer sogenannten Lightbox-Funktion können Sie Bilder auf Ihrer Webseite ansprechend präsentieren. In diesem Video zeigt Ihnen Jonas Hellwig, wie Sie eine Lightbox mithilfe von JavaScript umsetzen.

YouTube

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.

Video laden

 

Lektion »9.4. Den Customizer integrieren« [11:37 Min.]

Der Customizer kann um Einstelloptionen erweitert werden, die WordPress nicht als Standard bereitstellt. Jonas Hellwig zeigt Ihnen in diesem Video, wie Sie eigene Menüpunkte im Customizer erstellen. Im Praxisbeispiel integrieren Sie einen Farbwähler für die Schriftfarbe und Optionen für den Blendmodus.

YouTube

Mit dem Laden des Videos akzeptieren Sie die Datenschutzerklärung von YouTube.

Video laden

Inhaltsverzeichnis

1. WordPress installieren und einrichten [01:22 Std.]

Willkommen zu WordPress! In diesem Kapitel machen Sie sich mit WordPress vertraut und lernen, wie Sie die Software installieren. Jonas Hellwig zeigt Ihnen, wie Sie Testumgebungen unter Windows und OS X einrichten, um Webseiten zunächst lokal zu testen.

  1. Einleitung [00:19 Min.]
  2. WordPress.com, WordPress.org und WordPress VIP [04:23 Min.]
  3. So funktioniert WordPress [03:22 Min.]
  4. Werkzeuge für Ihre Arbeit – Editor, FTP-Programm, Browser und Co. [11:57 Min.]
  5. Eine lokale Serverumgebung unter Windows einrichten [08:03 Min.]
  6. WordPress für Windows installieren [07:44 Min.]
  7. Eine lokale Serverumgebung unter OS X einrichten [09:43 Min.]
  8. WordPress für OS X installieren [07:50 Min.]
  9. Der Administrationsbereich [16:41 Min.]
  10. Die WordPress-Ordnerstruktur [03:00 Min.]
  11. Themes und Plug-ins installieren [08:30 Min.]

2. Bestehende Themes anpassen [01:06 Std.]

WordPress bietet Ihnen viele Möglichkeiten, das Seitendesign der Vorlagen an Ihre Wünsche anzupassen. In diesem Kapitel lernen Sie, wie Sie bestehende Themes mithilfe des Customizers, Plug-ins oder Child-Themes individuell gestalten.

  1. Einleitung [00:22 Min.]
  2. Die Funktion eines Themes [03:01 Min.]
  3. Die verschiedenen Theme-Arten [06:45 Min.]
  4. So finden Sie gute Themes [02:48 Min.]
  5. Native Theme-Optionen von WordPress [12:06 Min.]
  6. Spezifische Funktionen [04:12 Min.]
  7. Qualitätskriterien für Themes [03:05 Min.]
  8. Themes per Customizer anpassen [07:28 Min.]
  9. Themes anpassen mit Widgets [07:22 Min.]
  10. Themes anpassen mit Plug-ins [04:04 Min.]
  11. Themes anpassen mit Shortcodes [02:58 Min.]
  12. Child-Themes verwenden [12:18 Min.]

3. Die Anatomie eines WordPress-Themes [01:38 Std.]

Bevor Sie eigene Webseiten und Themes entwickeln, sollten Sie den Aufbau und die Funktionsweise von Themes verstehen. In diesem Kapitel erklärt Jonas Hellwig die Theme-Struktur und macht Sie mit Template-Tags, API-Hooks und dem WordPress-Loop vertraut.

  1. Einleitung [00:22 Min.]
  2. Die Dateistruktur des Themes [04:57 Min.]
  3. Die Template-Hierarchie [08:20 Min.]
  4. Template-Dateien verknüpfen [15:05 Min.]
  5. Inhalte über Template-Tags laden [17:04 Min.]
  6. Schnittstellen für Plug-ins, Styles und Skripte integrieren [03:00 Min.]
  7. Beiträge und Seiten mit dem Standard-Loop ausgeben [15:27 Min.]
  8. Das Theme mit CSS strukturieren [12:05 Min.]
  9. Bedingte Abfragen integrieren [07:36 Min.]
  10. Individuelle Loops mit WP_Query erstellen [14:03 Min.]

4. Das Grundgerüst des Beispielprojekts [01:24 Std.]

Jetzt wissen Sie, wie Themes in WordPress aufgebaut sind – höchste Zeit, dieses Wissen in der Praxis anzuwenden. Gemeinsam mit Jonas Hellwig erstellen Sie in diesem Kapitel ein eigenes WordPress-Theme, bauen Navigationsstrukturen auf und integrieren ein Suchformular.

  1. Einleitung [00:24 Min.]
  2. Die Planung des Beispielprojekts [06:29 Min.]
  3. Ordnerstruktur und Basis-Dateien anlegen [06:18 Min.]
  4. Template-Files erstellen und verknüpfen [14:44 Min.]
  5. Den News-Blog erstellen [12:06 Min.]
  6. Eine Artikelnavigation einbauen [03:14 Min.]
  7. Beiträge auf Blog-Übersicht und Startseite anzeigen [14:20 Min.]
  8. Die Suche integrieren [14:06 Min.]
  9. Archive anlegen [11:55 Min.]

5. Kommentare, Widgets und Navigationsmenüs [01:47 Std.]

In diesem Kapitel zeigt Ihnen Jonas Hellwig, wie Sie das Basis-Theme gestalten und erweitern. Sie lernen, wie Sie individuelle Hintergründe einrichten, die Navigation für Mobilgeräte optimieren und Widgets und Kommentare in Ihre Webseite integrieren.

  1. Einleitung [00:24 Min.]
  2. Die »functions.php« und seitenspezifische Plug-ins [08:25 Min.]
  3. Navigationsmenüs integrieren [13:36 Min.]
  4. Den Hintergrund gestalten [15:13 Min.]
  5. Die Navigationsbereiche gestalten [19:26 Min.]
  6. Navigation und Suche für Mobilgeräte integrieren [16:37 Min.]
  7. Widgets integrieren [10:31 Min.]
  8. Die Kommentarfunktion einbauen [06:55 Min.]
  9. Die Antworten-Funktion für Kommentare aktivieren [03:38 Min.]
  10. Die Kommentarfunktion gestalten [11:56 Min.]

6. Beitragstypen, Taxonomien und Vorlagen [01:18 Std.]

Jonas Hellwig stellt Ihnen in diesem Kapitel die CMS-Funktionen von WordPress vor. Dabei lernen Sie, wie Sie benutzerdefinierte Inhaltstypen und Taxonomien anlegen, Seitenvorlagen erstellen und individuelle Archivseiten gestalten.

  1. Einleitung [00:25 Min.]
  2. Inhalte, Auszüge und der Weiterlesen-Link [08:54 Min.]
  3. Seitenvorlagen hinzufügen [04:46 Min.]
  4. Beitragsformate hinzufügen [11:21 Min.]
  5. Zusätzliche Beitragstypen [20:01 Min.]
  6. Eigene Taxonomien hinzufügen [09:49 Min.]
  7. Taxonomie-Archive erstellen [06:19 Min.]
  8. Die Programmübersicht aufbauen [08:59 Min.]
  9. Die Startseite umbauen [07:50 Min.]

7. Medien verwalten und darstellen [01:08 Std.]

In diesem Kapitel widmet sich Jonas Hellwig der Darstellung von Bildern und Videos auf Ihrer Webseite. Sie erfahren, wie Sie Beitragsbilder einrichten, Bilder mit Slidern oder einer Lightbox präsentieren und Videos in einer Seite einbetten.

  1. Einleitung [00:22 Min.]
  2. Beitragsbilder hinzufügen [13:17 Min.]
  3. Eigene Bildgrößen definieren [05:53 Min.]
  4. Einen Slider integrieren [08:10 Min.]
  5. Skripte und Stylesheets registrieren [07:49 Min.]
  6. Bilder im Inhaltsbereich gestalten [06:03 Min.]
  7. Eine Lightbox ohne Plug-in [05:45 Min.]
  8. Die Anhang-Seiten gestalten [11:35 Min.]
  9. Bildergalerien integrieren [05:06 Min.]
  10. Weitere Inhaltselemente [04:11 Min.]

8. Eigene Feldtypen und Vorlagen definieren [00:35 Std.]

Jonas Hellwig zeigt Ihnen in diesem Kapitel, wie Sie die CMS-Funktionen von WordPress individuell erweitern. Sie erfahren unter anderem, wie Sie benutzerdefinierte Felder erstellen und Metadaten dynamisch auslesen. Sie lernen ebenfalls, wie Sie eigene Shortcodes erstellen.

  1. Einleitung [00:23 Min.]
  2. Benutzerdefinierte Felder [11:08 Min.]
  3. Veranstaltungen nach dem Startdatum sortieren [03:49 Min.]
  4. Advanced Custom Fields (ACF) [02:56 Min.]
  5. ACFs integrieren [06:58 Min.]
  6. Selbstschließender Shortcode [06:45 Min.]
  7. Umschließender Shortcode [03:28 Min.]

9. Besondere Design-Funktionen im Backend bereitstellen [01:01 Std.]

Ein gutes Theme sollte auch über das Backend individuell gestaltbar sein. Jonas Hellwig zeigt Ihnen in diesem Kapitel, wie Sie eigene Formatvorlagen für den Editor erstellen, editierbare Hintergründe und Header-Grafiken einrichten und das WordPress-Dashboard erweitern.

  1. Einleitung [00:22 Min.]
  2. Einen editierbaren Seitenhintergrund einfügen [10:22 Min.]
  3. Eine eigene Kopfgrafik einfügen [17:58 Min.]
  4. Den Customizer integrieren [11:37 Min.]
  5. Vorlagen für den WordPress-Editor ergänzen [07:02 Min.]
  6. Den Editorbereich optimieren [04:19 Min.]
  7. Das Dashboard erweitern [03:35 Min.]
  8. Die Log-in-Maske gestalten [05:40 Min.]

10. Mehrsprachige Websites [00:47 Std.]

Jonas Hellwig zeigt Ihnen in diesem Kapitel, wie Sie das Theme und Ihre Inhalte mit wenig Aufwand mehrsprachig zur Verfügung stellen. Sie lernen, wie Sie multilinguale Beiträge über Plug-ins verfassen und mehrsprachige Blog-Netzwerke mit der Multisite-Funktion verwalten.

  1. Einleitung [00:23 Min.]
  2. Die Übersetzung vorbereiten und Elemente übersetzen [15:49 Min.]
  3. Das Plug-in »qTranslateX« [07:18 Min.]
  4. Das Plug-in »WPML« [07:54 Min.]
  5. WordPress-Multisite [15:54 Min.]

11. Ein eigener Shop mit »WooCommerce« [01:02 Std.]

WordPress ermöglicht es Ihnen, einen professionellen Onlineshop zu betreiben. In diesem Kapitel lernen Sie, wie Sie mit dem populären Plug-in »WooCommerce« einen eigenen Shop aufbauen und diesen für den Betrieb in Deutschland rechtskonform einrichten.

  1. Einleitung [00:19 Min.]
  2. WooCommerce im Überblick [04:41 Min.]
  3. WooCommerce einrichten [05:48 Min.]
  4. Die WooCommerce-Einstellungen [15:50 Min.]
  5. Ein Produkt anlegen [06:05 Min.]
  6. Navigation und Widgets anpassen [04:40 Min.]
  7. WooCommerce integrieren [06:17 Min.]
  8. Produkte anzeigen [10:06 Min.]
  9. Das Styling anpassen [03:30 Min.]
  10. Template-Dateien überschreiben [04:16 Min.]

12. Website-Projekt und Theme veröffentlichen [00:27 Std.]

Um Ihre Webseite und das Theme zu veröffentlichen, müssen Sie diese aus der lokalen Testumgebung auf den Live-Server übertragen. In diesem Kapitel zeigt Ihnen Jonas Hellwig, was Sie beim Umzug beachten sollten und wie Sie Ihre Datenbank auf dem Server importieren.

  1. Einleitung [00:25 Min.]
  2. Den Code des Themes testen [08:57 Min.]
  3. Alle Dateien per FTP hochladen [02:45 Min.]
  4. Die Datenbank exportieren und umschreiben [06:42 Min.]
  5. Die Datenbank auf den Live-Server übertragen [03:60 Min.]
  6. Die Installation überprüfen [04:14 Min.]

Feedback und Ergänzungen – 25 Kommentare

  1. Tanja
    schrieb am 18.10.2020 um 13:14 Uhr:

    Guten Tag, Das Training wurde ja 2016 veröffentlicht. Bevor ich das Training kaufe, würde ich gerne wissen, ob ich es 2020 immer noch verwenden kann oder gibt es ein neues Training inkl. Buch? Funktioniert es auch mit dem Gutenberg-Editor?

    LG Tanja

    • Jonas Hellwig
      schrieb am 19.10.2020 um 07:39 Uhr:

      Hallo Tanja, natürlich merkt man einem Training zum Thema Webtechnologie an, dass es mehrere Jahre alt ist. WordPress hat sich in dieser Zeit weiterentwickelt, so dass die Techniken aus dem Training fast alle nach wie vor gültig und aktuell sind. Es sind allerdings neue Funktionen und Techniken hinzugekommen, u.a. Gutenberg. Diese Themen werden natürlich nicht behandelt.

      Eine Neuauflage oder eine Aktualisierung des Trainings ist nicht geplant.

Kommentar zu dieser Seite

Ihr habt Anregungen, Ergänzungen, einen Fehler gefunden oder dieser Inhalt ist nicht mehr aktuell? Dann freuen wir uns über einen Kommentar. Wir lesen jeden Eintrag, veröffentlichen aber nur, was den Inhalt sinnvoll ergänzt.

Unsere Agentur in Berlin realisiert vom durchgestylten One-Pager bis zur funktionalen Konzern-Website Projekte mit sehr unterschiedlichem Umfang. Wir haben u.a. mit folgenden Kunden erfolgreich zusammengearbeitet: