So erstellen Sie ein benutzerdefiniertes WordPress-Theme (Anfängerleitfaden)

Möchten Sie ein benutzerdefiniertes WordPress-Theme erstellen? Etwas Schönes schaffen, ohne programmieren zu müssen? Die volle Kontrolle über das Theme Ihrer WordPress-Website zu haben, ist eine großartige Möglichkeit, den Umsatz zu steigern und ein professionelles Erlebnis mit Ihrer Marke zu bieten.

In diesem Artikel zeigen wir Ihnen, wie Sie die volle Kontrolle über Ihr Theme haben. Sie können es großartig aussehen lassen, auch wenn Sie Anfänger sind. Genau so, wie Sie es möchten. Und Sie müssen keinen benutzerdefinierten Code schreiben oder einen teuren Designer oder Entwickler beauftragen.

Legen wir los!

• Was ist ein WordPress-Theme?
• Die Herausforderung bei der Anpassung von Themes
• So passen Sie an oder erstellen Ihr eigenes Theme ohne Programmierung
• Eine kurze Einführung in SeedProd + EDD

Hinweis: Dieser Artikel ist für die Arbeit an WordPress.org-Sites gedacht, nicht an WordPress.com-Sites. Klicken Sie hier für einen Artikel, der den Unterschied erklärt. 

---

Was ist ein WordPress-Theme?

Jede WordPress-Site verwendet ein Theme. Ein Theme ist die Vorlage, das Aussehen oder das Gesamtdesign Ihrer Website. Themes steuern die Funktionalität und das Erscheinungsbild des Front-Ends Ihrer Website. Sie sind eine Sammlung von PHP-, CSS-, Javascript- und HTML-Vorlagendateien. 

Eine WordPress-Site kann mehrere installierte Themes haben, aber nur eines kann aktiviert und auf dem Front-End Ihrer Website angezeigt werden. Themes werden im Ordner wp-content gespeichert.

Wenn Sie WordPress installieren, wird es mit einem Standard-Theme geliefert, das vom WordPress-Kernteam erstellt wurde. Sie benennen ihre Themes nach dem Jahr, in dem sie geschrieben wurden (z. B. Twenty Twenty Two, Twenty Nineteen usw.).

Easy Digital Downloads (EDD) bietet zwei kostenlose benutzerdefinierte WordPress-Themes, mit denen Sie einen digitalen Shop erstellen können: Themedd und Vendd. Wir bieten auch eine Liste von kostenlosen und kostenpflichtigen Themes von anderen Designern/Entwicklern an, die Sie verwenden können.

➡️ Sehen Sie sich die EDD Themes-Seite an

---

Die Herausforderung bei der Anpassung von Themes

Eine zentrale Herausforderung bei WordPress-Themes ist, dass sie schwer zu erstellen oder anzupassen sein können. Sie benötigen zumindest Erfahrung oder Kenntnisse in WordPress, HTML und CSS-Programmierung.

Hier sind einige Dinge, die Sie lernen müssen, um WordPress-Theme-Entwicklung oder -Anpassung durchzuführen:

• Verstehen Sie Programmierkonzepte wie 'the loop', bei dem es sich um PHP-Code zum Laden von Inhalten handelt
• Nutzen Sie die Template-Hierarchie, indem Sie ein Child-Theme in seinem eigenen Theme-Verzeichnis erstellen. Dies ermöglicht es Ihnen, Code von einem Parent-Theme zu erben und begrenzt die Anzahl der Dateien, die Sie von Grund auf neu schreiben müssen (wie page.php und single.php).
• Die Verwendung der function.php-Datei, Widget-Bereiche und Permalinks
• Stellen Sie sicher, dass Ihre Theme-Dateien nicht zu viele Codezeilen beanspruchen. Zu viele Codezeilen können dazu führen, dass Ihre Website langsam geladen wird, was sich negativ auf Ihre SEO (Suchmaschinenoptimierung) auswirkt.
• Richten Sie eine Entwicklungsumgebung ein, die einen Code-Editor und lokal auf Ihrem Computer laufende Websites zum Testen umfasst

Werkzeuge zur Erleichterung

WordPress ist bekannt für seine Benutzerfreundlichkeit. Besonders im Vergleich zu allem anderen, was es gibt. Es gibt einen Grund, warum es 43% des Internets antreibt!

Es gibt mehrere Lösungen, die im WordPress-Ökosystem entwickelt wurden, um die Herausforderungen der Theme-Anpassung und -Erstellung zu bewältigen.

Eine Lösung besteht darin, eines der Tausenden von Premium-Themes zu verwenden, die auf verschiedenen Marktplätzen erhältlich sind. Sie können ein Theme auswählen, das bereits so aussieht und sich anfühlt, wie Sie es möchten.

Wir werden Ihnen unten weitere Lösungen vorstellen. 👇🏽

---

So passen Sie Ihr eigenes Theme an oder erstellen es ohne Code

Wir zeigen Ihnen vier Lösungen zum Anpassen oder Erstellen eines WordPress-Themes. Einige ermöglichen es Ihnen sogar, Ihr eigenes Theme von Grund auf ohne Code zu erstellen!

SeedProd Theme Builder

Der beste Weg, Ihr eigenes Website-Theme zu erstellen – ganz ohne Code – ist die Verwendung des SeedProd Theme Builders.

SeedProd ist ein Drag-and-Drop-WordPress-Builder. Es ist ein leistungsstarkes visuelles Design-Tool, das von mehr als einer Million Website-Profis verwendet wird.

Es ist einfach zu bedienen und ermöglicht es Ihnen, benutzerdefinierte Landingpages oder sogar Ihr gesamtes Website-Theme zu erstellen! Es funktioniert perfekt mit dem Gutenberg-Block-Editor.

SeedProd begann als einfache Möglichkeit, Ihre „Coming Soon“-Seite, Ihre Wartungsseite oder Ihre 404-Seite zu erstellen. Es wurde ständig aktualisiert und erweitert, um Landingpages und jetzt auch vollständige Theme-Erstellung zu ermöglichen.

Eine wirklich beliebte und leistungsstarke Funktion von SeedProd ist die riesige Bibliothek mit Vorlagen und vorgefertigten Themes. Es kann sehr hilfreich sein, mit etwas Vorgefertigtem zu beginnen, anstatt mit einer leeren Seite. Dann können Sie es einfach anpassen und von dort aus aufbauen.

⏭ Klicken Sie hier, um vorzuspringen und zu sehen, wie Sie SeedProd + EDD verwenden

Unten sind drei weitere Lösungen zum Anpassen oder Erstellen Ihres WordPress-Themes aufgeführt.

---

Der Customizer

Eine Lösung, die viele Themes anbieten, wird „der Customizer“ genannt. Der Customizer ermöglicht es Ihnen, viele visuelle Elemente des Themes ohne Code zu steuern. Diese Customizer-Oberflächen sind oft wirklich großartig und geben Ihnen ziemlich viel Freiheit. Unsere kostenlosen Themes Themedd und Vendd bieten den Customizer.

Viele Themes haben sogar eine Box namens „Zusätzliches CSS“ in ihrem Customizer, die es Ihnen ermöglicht, das Erscheinungsbild des Themes mit Ihrem eigenen CSS-Code manuell zu überschreiben. Geringe Code-Kenntnisse oder viel Google-Suche sind erforderlich, um dies nutzen zu können.

🟢 CUSTOMIZER VORTEILE	🔴 CUSTOMIZER NACHTEILE
Der Customizer ist ziemlich einfach zu bedienen und leistungsstark	Sie sind immer noch an das Framework und das Designkonzept des Themes gebunden, das Sie verwenden.
	Manche Themes nutzen den Customizer besser als andere. Möglicherweise stellen Sie fest, dass Sie nicht über die gewünschten Steuerelemente verfügen, ohne das Feld „Zusätzliches CSS“ für benutzerdefinierten Code zu verwenden.

Page Builder Plugins

Es gibt mehrere Unternehmen, die Page Builder für WordPress herstellen. Diese bieten eine visuelle Oberfläche zum Erstellen von Seiten. Einige von ihnen bieten sogar die Möglichkeit, das gesamte Theme mit Header-, Footer-, Sidebar- und Seitenvorlagen anzupassen.

Diese Page Builder bearbeiten und steuern komplizierte PHP-Dateien, CSS-Dateien und Javascript, damit Sie es nicht tun müssen.

🟢 PAGE BUILDER VORTEILE	🔴 PAGE BUILDER CONS
Sie haben viel Macht und Kontrolle	Einige können Ihre Website verlangsamen
Visuelle Oberfläche	Viele Seitenersteller sind teuer, einige haben einen kostenlosen Plan
	Bei einigen Seitenerstellern müssen Sie immer noch ein Theme installieren, und es kann verwirrend sein, sowohl mit dem Theme als auch mit dem Seitenersteller zu arbeiten

Full Site Editing (FSE)

Sie hören wahrscheinlich viel über WordPress Full Site Editing. Frühe Versionen von FSE wurden kürzlich in WordPress 5.8 und 5.9 veröffentlicht. Dies ist ein neues Projekt des Kernteams, um es möglich zu machen, Ihre gesamte Website mit einem 'Block-Editor'-Tool zu bearbeiten.

Der WordPress-Block-Editor (Gutenberg) existiert seit mehreren Jahren. Es ist eine kostenlose, seitenerstellerähnliche visuelle Oberfläche zum Erstellen von Beiträgen und Seiten. Er ist kostenlos bei jeder WordPress-Website enthalten.

Jetzt oder bald können Sie jedes FSE-integrierte Theme mit einer ähnlichen Block-Editor-ähnlichen Funktionalität und Oberfläche bearbeiten. Verwenden Sie es, um jedes Element auf einer Seite zu steuern, einschließlich Menüs, Kopfzeilen, Fußzeilen, Seitenleisten und Widgets.

Das ist aufregend! Es wird eine großartige Möglichkeit sein, das Theme Ihrer Website zu steuern. Es ist noch nicht ganz bereit für die Hauptsendezeit, zum Zeitpunkt des Schreibens dieses Artikels befindet sich FSE noch in der Beta-Phase.

🟢 FSE PROS	🔴 FSE CONS
Wird bald eine großartige Option sein, besonders wenn Sie den Gutenberg Page Builder bereits mögen und verwenden	Befindet sich noch in der Beta-Testphase, zum Zeitpunkt des Schreibens dieses Artikels
	Erfordert ein mit 'Full Site Editing' kompatibles Theme, von denen derzeit nicht viele verfügbar sind

---

Ein kurzer Überblick über SeedProd + EDD

🎉 SeedProd ermöglicht es Ihnen, Ihr eigenes Website-Theme ganz einfach zu erstellen. Ohne jegliche Codierung. Und ohne die oben genannten Nachteile.

Wir zeigen Ihnen, wie einfach es ist, Ihr eigenes WordPress-Theme mit SeedProd zu erstellen. Wir werden die Verwendung mit dem Easy Digital Downloads (EDD) E-Commerce-Plugin demonstrieren.

Stellen Sie sich vor, was Sie tun können! Sie haben die vollständige Kontrolle über jedes Detail des Kundenerlebnisses. Kein Warten auf Wochen oder Monate, bis teure Designer oder Entwickler an Ihrer Website arbeiten.

Sie kennen Ihre Kunden und Ihren Shop am besten! Und Sie kümmern sich mehr um Ihre Website als jeder andere. SeedProd ist eine großartige Option für fantastische Ergebnisse… SCHNELL!

Hier ist, was Sie tun:

1. SeedProd installieren und aktivieren
2. Klicken Sie auf eine Schaltfläche, um ein Theme zu erstellen!
3. Grundlegende Anpassungen vornehmen
4. Benutzerdefinierte Vorlagen für Ihre Downloads (für EDD) erstellen
5. Noch mehr tun

SeedProd installieren und aktivieren

Zuerst müssen Sie SeedProd kaufen. Die Theme Builder-Option erfordert eine Pro- oder Elite-Lizenz.

🤚🏾Klicken Sie hier, um 50% Einführungsrabatt auf SeedProd zu erhalten

Nachdem Sie SeedProd Pro oder Elite gekauft haben, installieren Sie es wie jedes andere Plugin. Wenn Sie neu bei der Installation von Plugins sind,  hier ist ein großartiges Tutorial.

Sobald das SeedProd-Plugin installiert ist, geben Sie unbedingt Ihren Lizenzschlüssel ein.

Jetzt können Sie Ihr eigenes neues Theme erstellen!

Stellen Sie außerdem sicher, dass Sie Easy Digital Downloads installieren, falls Sie es noch nicht haben.

EDD ist kostenlos und beinhaltet:

• Warenkorb
• Auflistung Ihrer Produkte/Downloads
• Geschützte Produktdaten, nur zahlende Kunden haben Zugriff auf automatisch ablaufende Links
• Flexible Checkout-Optionen
• Rabattcodes
• Kundenverwaltung (Basis-CRM)
• E-Commerce-Berichte
• Stripe- und/oder PayPal-Integration

EDD-Pässe

Holen Sie sich einen EDD-Pass, um erweiterte E-Commerce-Funktionen wie E-Mail-Integration, Abonnements, Softwarelizenzen, Amazon S3/DropBox-Integration und mehr hinzuzufügen.

Klicken Sie auf eine Schaltfläche, um ein Theme zu erstellen!

Suchen Sie auf der linken Seite Ihres WordPress-Adminbereichs nach SeedProd. Klicken Sie auf Theme Builder.

Klicken Sie als Nächstes auf die orangefarbene Schaltfläche mit der Aufschrift Themes. Dies öffnet die vorgefertigten Themes, aus denen Sie wählen können. Wir werden im folgenden Beispiel das vorgefertigte Theme Starter verwenden.

Sobald Sie auf das vorgefertigte Theme Starter klicken, erstellt SeedProd jeden Theme-Vorlagenteil wie z. B. Einzelseite, Homepage, Header, Footer, Sidebar usw.

Sie haben gerade mit EINEM KLICK ein ganzes Theme erstellt!

Sie mussten kein footer.php, header.php oder sidebar.php, archive.php oder eine Stylesheet erstellen. Alles wurde für Sie erledigt! 

Stellen Sie sicher, dass Sie das Theme aktivieren, indem Sie oben rechts auf den Schalter SeedProd Theme aktivieren klicken. Dadurch wird Ihr aktuelles Theme deaktiviert. Stellen Sie sicher, dass Sie bereit sind, dies der Öffentlichkeit zu zeigen, oder probieren Sie dies auf einem Staging-Server aus.

Beachten Sie, dass Sie bei der Verwendung von SeedProd nicht mehr das WordPress-Theme-System verwenden. Sie werden kein neues Theme mit einem Theme-Namen im Theme-Ordner unter wp-content/themes sehen. Stattdessen hat das SeedProd WordPress-Plugin die Kontrolle über das Erscheinungsbild der Website übernommen.

Grundlegende Anpassung

Es gibt einige Anpassungen, die Sie sofort vornehmen können. Passen Sie Ihr Logo und grundlegende Farben und Stile an.

Passen Sie Ihr Logo an

Ein guter erster Schritt ist das Hinzufügen Ihres Logos. Tun Sie dies, indem Sie die Vorlage Header bearbeiten.

Angepasste Gesamtstile

Zweitens können Sie schnell alle globalen Stileinstellungen bearbeiten. Klicken Sie auf die Vorlage Global CSS.

Hier können Sie viele visuelle Einstellungen für die Website ändern, wie z. B. Schriftarten, Überschriften, Links (href) sowie Farben und Größen. Dies ersetzt die Notwendigkeit, CSS zu kennen und die style.css-Datei anzupassen.

Erstellen Sie benutzerdefinierte Vorlagen für Ihre Downloads

Die Produkte, die Sie mit Easy Digital Downloads verkaufen, werden als benutzerdefinierter Post-Typ namens Downloads auf Ihrer WordPress-Website gespeichert.

Ihre Downloads werden dann entweder als Einzelbeitrag oder als Archivseite angezeigt.

• Ein Einzelbeitrag ist, wenn ein Download allein auf seiner eigenen Seite erscheint.
• Eine Archivseite (WordPress-Sprache) ist eine Liste mehrerer Downloads.

Sie müssen nicht bei Null anfangen. Anstatt neue Vorlagen hinzuzufügen, duplizieren Sie einfach diese beiden Vorlagen, die SeedProd gerade für Sie erstellt hat:

• Blog-Index, Archive, Suche und
• Einzelbeitrag

Geben Sie diesen Vorlagen den Titel „EDD Single Download“ und „EDD Download List“, damit Sie sie nicht mit anderen Vorlagen verwechseln.

Bearbeiten Sie die Bedingungen Ihrer Download-Vorlagen

Sie müssen diese Seiten so einstellen, dass nur Downloads geladen werden. Es ist einfach. Klicken Sie einfach auf den Text-Button unter dem Titel, auf dem Bedingungen bearbeiten steht.

Konfigurieren Sie die Vorlage EDD Single Download wie folgt:

• Priorität 10
• Einbeziehen: Download-Beitragstyp

Verwenden Sie für die EDD Download List diese Einstellungen:

• Priorität 30
• Einbeziehen: Beitragstyp-Archiv, und dann geben Sie „download“ ein

Hinweis: Diese Prioritätseinstellungen sollen sicherstellen, dass Ihre Bedingungen nicht von anderen überschrieben werden, wenn Sie zwei ähnliche Bedingungen haben. Erfahren Sie hier mehr über Prioritäten und Bedingungen.

Passen Sie Ihre Download-Seiten an

Nachdem Sie separate Vorlagen für Ihre EDD Downloads erstellt haben. Sie können sie nach Belieben anpassen.

In meinem Beispiel habe ich eine saubere und einfache EDD Download-Seite erstellt. Eine einzelne Spalte zentriert, ohne Seitenleiste oder etwas anderes, um die Konversionen zu steigern. 

Hier ist sie im Backend, während sie in SeedProd bearbeitet wird.

Dann sieht sie im Frontend so aus.

Auf dieser Beispiel-EDD-Download-Listen-Seite habe ich mich für ein 2-Spalten-Raster entschieden. Sie können tun, was immer Sie wollen. Es ist erstaunlich einfach, neue Dinge auszuprobieren und sie in der Vorschau anzuzeigen.

Auf dem Backend, bearbeitet mit SeedProd:

So sieht es im Frontend aus:

Machen Sie mehr. Der Himmel ist die Grenze!

Oder vielleicht ist der Weltraum die Grenze. Diese obigen Beispiele sind nur eine kleine Vorschau auf all die Dinge, die Sie mit SeedProd tun können.

Stellen Sie sich nur vor, was Sie mit voller Kontrolle und grenzenloser Experimentierfreude tun können.

SeedProd kommt mit Hunderten von Vorlagenblöcken und Seiten-Vorlagen.

Hier sind nur ein paar Beispiele, die für digitale Kreative wie uns von besonderem Interesse sein könnten!

SeedProd ist eine großartige Möglichkeit, Ihr EDD-Shop-Theme einzurichten. Es ist eine großartige Option, egal ob Sie gerade erst anfangen oder etwas Neues ausprobieren möchten, das Kunden beeindrucken wird.

---

Fazit

Hervorragend! Sie haben gerade gelernt, wie Sie Ihr Theme ohne Code schön aussehen lassen. Stellen Sie sich vor, was Sie tun können, um das Kundenerlebnis zu verbessern, wenn Sie alles selbst anpassen können. 

Wir haben noch viel mehr Ressourcen für digitale Kreative und Unternehmer. Worüber möchten Sie als Nächstes lernen?!

• 🤑 Die erstaunlichen Vorteile des Verkaufs von digitalen Downloads
• 💰 Die vollständige Liste der digitalen Downloads, die Sie verkaufen können
• 💸 Die 14 beliebtesten digitalen Downloads, die Sie 2022 verkaufen können
  

Folgen Sie uns auf Facebook und Twitter, um mehr über WordPress und den Verkauf digitaler Produkte zu erfahren.