Wie man ein Child-Theme in WordPress erstellt

Offenlegung der Leser

Die Mitgliedschaftsseite Ihrer WordPress-Website Das Design beeinflusst, wie die Nutzer auf die Website reagieren. Wenn Sie jedoch nicht bereit sind, für ein benutzerdefiniertes WordPress-Theme zu bezahlen, scheinen Ihre Möglichkeiten, das Aussehen Ihrer Website zu optimieren, begrenzt zu sein. Selbst wenn Sie ein Theme finden, das alles tut, was Sie wollen, kann Ihre Website am Ende ähnlich aussehen wie andere Websites.

WAS IST INNEN

Glücklicherweise können Sie Ihre WordPress-Website noch besser anpassen, indem Sie ein Child-Theme erstellen. So können Sie ein Theme, das Ihnen gefällt, übernehmen und eigene Änderungen vornehmen, z. B. Schriftarten und Farben anpassen und vieles mehr. Tatsächlich ist es möglich, das Aussehen eines Themes mit dieser Technik drastisch zu verändern.

In diesem Leitfaden erfahren Sie, wie Sie ein Child-Theme in WordPress erstellen und warum dies dazu beiträgt, Ihre Mitgliederseite hervorzuheben. Legen wir los!

Warum Sie vielleicht ein Child-Theme erstellen sollten

Ein WordPress-Theme ist eine Codesammlung, die das Aussehen und Layout Ihrer Website bestimmt. Mit dieser Funktion können Sie Ihrer Website ganz einfach ein brandneues Aussehen verleihen, ohne dass Sie sich mit Code auskennen müssen. Beliebte WordPress-Themes werden jedoch oft von Hunderten von Websites verwendet, was bedeutet, dass Ihre Website "wie aus einem Guss" aussehen könnte, wenn Sie nicht aufpassen.

Die Verwendung eines benutzerdefinierten Designs kann Ihre Website hervorhebenindem Sie ein einzigartiges Erscheinungsbild schaffen, das die Besucher mit Ihrer Marke in Verbindung bringen. Dies kann auch dazu beitragen, dass Sie sich von Ihrer Konkurrenz abheben. Wenn jede Website, die eine Person besucht, ein ähnliches Design hat, Ihre jedoch ein aufmerksamkeitsstarkes Aussehen hat, das sie einzigartig erscheinen lässt, wird der Besucher Ihre Website eher zur Kenntnis nehmen und sich an sie erinnern.

Es kann jedoch sehr schwierig sein, als Anfänger ein Thema von Grund auf zu entwerfen. Außerdem ist es ziemlich teuer, einen Designer zu engagieren um ein komplett individuelles Thema zu erstellen. Zum Glück gibt es noch eine dritte Möglichkeit. Bei der Erstellung eines untergeordneten Themes können Sie Elemente eines bestehenden Themes übernehmen und Ihre eigenen Änderungen hinzufügen.

Ein Child-Theme ist basiert auf einem bereits vorhandenen Thema, das als "übergeordnetes" Thema bezeichnet wird. Es ist möglich, die Dateien eines Themas direkt zu bearbeiten, aber Sie riskieren Ihre Website zerstören wenn Sie eine falsche Änderung vornehmen. Die Erstellung eines Child-Themes birgt weitaus weniger Risiko, da es sich um eine sichere Kopie Ihres Themes handelt, mit der Sie nach Herzenslust experimentieren können.

Wie man ein Child-Theme für WordPress erstellt (in 5 Schritten)

Da Sie nun wissen, warum Sie ein Child-Theme für Ihre Mitgliederseite verwenden sollten, gehen wir nun darauf ein, wie Sie es einrichten. Zu Beginn müssen Sie sicherstellen, dass Sie die richtigen Tools haben.

Schritt 1: Einrichten einer Entwicklungsumgebung

Zunächst benötigen Sie einen Arbeitsbereich. Eine Entwicklungsumgebung (auch als "Test-Site" oder "Staging-Site" bezeichnet) ist ein lokaler Server, der auf Ihrem Computer läuft. Damit können Sie private Websites erstellen - entweder völlig neue oder Kopien Ihrer Live-Site -, an denen Sie alle gewünschten Änderungen vornehmen können.

Mit anderen Worten: Mit einer Entwicklungsumgebung können Sie Websites "hinter den Kulissen" erstellen, so dass sich die Änderungen erst dann auf Ihre echte Website auswirken, wenn Sie bereit sind. Auf diese Weise können Sie Ihr Child-Theme erstellen und anpassen, bevor Sie es verwenden. Weitere Hilfe zu diesem Schritt finden Sie in dieser Anleitung zu Einrichten einer lokalen WordPress-Website. In den folgenden Schritten werden wir mit MAMP als unser Entwicklungswerkzeug.

Schritt 2: Wählen Sie einen Code-Editor

Sobald Sie Ihre Entwicklungsumgebung eingerichtet haben, benötigen Sie einen Code-Editor, mit dem Sie die Dateien Ihres Themes bearbeiten können. Ein Code-Editor ist ein einfaches Werkzeug, das Sie beim Schreiben von Code unterstützt. Viele erkennen sogar automatisch Fehler, so dass Sie sie schnell beheben können.

Es gibt viele beliebte, kostenlose Code-Editoren, die Sie ausprobieren können, wie z. B. Atom und Visual Studio-Code. Wenn Sie sich für eine Lösung entschieden haben, installieren Sie sie auf Ihrem Computer, damit Sie Ihre Child-Theme-Dateien problemlos bearbeiten können.

Schritt 3: Installieren Sie WordPress auf Ihrer Testseite

Jetzt können Sie Ihre Test-Site einrichten. Um zu beginnen, laden Sie die neueste Version von WordPress:

Archivieren Sie die .zip Datei (Doppelklick auf einem Mac; unter Windows mit der rechten Maustaste und wählen Sie Auszug). Erstellen Sie dann einen Ordner auf Ihrem Computer (z. B., Dokumente > Standorte) und platzieren Sie die nicht archivierten WordPress-Dateien darin:

Als nächstes müssen Sie Ihre Entwicklungsumgebung auf diesen Ordner verweisen. Um dies im MAMP zu tun, öffnen Sie Einstellungen > Webserver. Unter Wurzel des Dokumentsklicken Sie auf Wählen Sie und wählen Sie den Ordner mit Ihrer WordPress-Installation:

Klicken Sie dann auf dem MAMP-Startbildschirm auf WebStart-Seite öffnen:

Auf der nächsten Seite finden Sie Werkzeuge > PHPMYADMIN:

Richten Sie eine Datenbank ein, indem Sie einen Namen wie "wp_test" eingeben und auf erstellen.:

Besuchen Sie dann localhost in einem Webbrowser. Sie sollten den WordPress-Installationsbildschirm sehen:

Presse Weiter und folgen Sie den Aufforderungen, geben Sie "wp_test" als Datenbanknamen und "root" als Benutzernamen und Passwort:

Sobald Ihre neue Website eingerichtet ist, können Sie sich mit dem Passwort und dem Benutzernamen anmelden, die Sie während der Installation festgelegt haben.

Schritt 4: Erstellen Sie Ihr Child-Theme

Das nächste, was Sie tun müssen, ist das Thema installieren das Sie als Basis für Ihr Child-Theme verwenden möchten. Greifen Sie dann in dem von Ihnen gewählten Code-Editor auf Ihren WordPress-Ordner zu:

Öffnen Sie wp-Inhalt, Rechtsklick auf das Themen und erstellen Sie darin einen neuen Ordner mit dem Namen "themename_childtheme" (ersetzen Sie den ersten Teil durch den Namen des Ordners des übergeordneten Themas).

Als Nächstes erstellen Sie eine neue Datei mit dem Namen "style.css" und speichern sie in Ihrem Child-Theme-Ordner:

Richten Sie Ihr style.css Datei wie unten gezeigt (ersetzen Sie "TwentyFifteen" durch den Namen des übergeordneten Themas):

Dadurch werden alle erforderlichen Daten aus dem übergeordneten Thema importiert.

Danach können Sie sich bei Ihrer lokalen WordPress-Website anmelden. Wenn Sie besuchen Erscheinungsbild > Themeskönnen Sie Ihr neues Child-Theme sehen und aktivieren:

Natürlich wird Ihre Website erst dann anders aussehen, wenn Sie Änderungen am Child-Theme vornehmen:

Um zu testen, ob es funktioniert, können Sie eine kleine Änderung an Ihrer Website vornehmen. Fügen Sie einen Codeblock wie "p {font-family: cursive; color:red;}" zum style.css file:

Wenn sich der Absatztext Ihrer Website in rot und kursiv ändert, haben Sie erfolgreich ein Child-Theme erstellt:

Danach können Sie an Ihrem neuen Child-Theme alle gewünschten Änderungen vornehmen.

Schritt 5: Laden Sie das Child-Theme auf Ihre WordPress-Mitgliedschaftsseite hoch

Sobald Ihr Child-Theme fertig ist, können Sie es auf Ihre Live-WordPress-Website hochladen. Erstens, Sichern Sie Ihre Website (nur für den Fall). Als nächstes komprimieren Sie den gesamten Ordner, der Ihr Child-Theme enthält (auf einem Mac klicken Sie mit der rechten Maustaste und wählen Sie Komprimierenunter Windows, klicken Sie mit der rechten Maustaste und wählen Sie Senden an > Komprimieren).

Besuchen Sie dann auf Ihrer Live-Site Erscheinungsbild > Themes. Wählen Sie Neu hinzufügenund dann Thema hochladen. Wählen Sie die gezippte Child-Theme-Datei und installieren Sie sie:

Sobald der Upload abgeschlossen ist, müssen Sie Folgendes auswählen Aktivieren Sie:

Ihr Child-Theme ist jetzt auf Ihrer Live-Site einsatzbereit!

Schlussfolgerung

Wenn Sie nur über ein begrenztes Budget verfügen und es sich nicht leisten können, ein individuelles Theme zu kaufen, kann es schwierig sein, Ihre WordPress-Mitgliedswebsite hervorzuheben. Glücklicherweise sind Child-Themes eine relativ einfache Möglichkeit, ein vorgefertigtes Theme anzupassen.

Sie können ein Child-Theme in nur fünf Schritten erstellen, indem Sie: