So erstellen Sie ein benutzerdefiniertes WordPress-Theme

Veröffentlicht: 2021-03-26

Was wäre, wenn wir Ihnen sagen würden, dass Sie zum Erstellen eines benutzerdefinierten WordPress-Themes nur ein oder zwei Stunden Freizeit benötigen? Das ist richtig, es sind keine Programmierkenntnisse mehr erforderlich, um ein schönes Thema zu erstellen, das Ihren Vorlieben entspricht. In der Vergangenheit mussten Sie entweder professionellen WordPress-Support beauftragen oder zumindest über Programmierkenntnisse verfügen. Glücklicherweise haben sich Zeiten und Technologie geändert und heute brauchen Sie nur noch ein sehr nützliches Plugin – Beaver Builder. Dieser Seitenersteller verfügt über ein Add-On namens Beaver Themer, das auf benutzerdefinierte Themen abzielt. Werfen wir einen Blick darauf, wie auch Sie Beaver Themer verwenden können, um ein ansprechendes Layout zu erstellen, das jeder lieben wird.

Bevor Sie ein benutzerdefiniertes WordPress-Design erstellen, müssen Sie das Plugin installieren

Das erste, woran Sie denken müssen, ist, dass Beaver Themer ein zusätzliches Plugin ist und nicht automatisch erscheint, sobald Sie Beaver Builder installieren. Sie müssen beide Plugins installieren und aktivieren, bevor Sie mit der Arbeit beginnen können . Unterschätzen Sie diesen Teil der Arbeit nicht – er ist wichtig!

Eine Frau, die auf eine Uhr schaut.
Sie sollten den Prozess der Erstellung eines benutzerdefinierten WordPress-Themes nicht unterschätzen.

Wählen Sie ein Thema, mit dem Sie arbeiten möchten

Das Endziel ist, dass Sie am Ende ein Thema haben, das für Ihre Website völlig einzigartig ist, aber das bedeutet nicht, dass Sie eines von Grund auf neu erstellen können. Nun, Sie können, aber das erfordert viel Wissen und Können. Aber keine Sorge – WordPress hat viele Vorlagen, die als guter Ausgangspunkt dienen können, danach wird es einfach sein, sie anzupassen und zu aktualisieren . Wenn Sie derzeit auf all die Auswahlmöglichkeiten starren, die Sie haben, könnte es gut sein, unsere Top-Auswahl zu kennen:

  • Astra
  • Unterstriche
  • StudioPress-Designs

Viele WordPress-Themes verfügen über eine integrierte Unterstützung für Beaver Builder, sodass das Erstellen Ihres benutzerdefinierten WordPress-Themes ein Kinderspiel sein sollte. Ach ja, und haben wir schon erwähnt, dass alles über eine Drag-and-Drop-Oberfläche erledigt wird? Ja, jetzt weißt du es!

Es ist wichtig zu beachten, dass Sie sicherstellen müssen, dass der Beaver-Themer Zugriff auf den gesamten Inhalt der Seite hat, von einem Rand zum anderen. Leider enthalten einige Layouts Seitenleisten, die es schwierig machen, ein benutzerdefiniertes Design mit Beaver Themer zu erstellen. Aber es gibt eine Lösung für das Problem! Gehen Sie zu Aussehen – Anpassen – LayoutSeitenleisten und wählen Sie einfach die Option „Keine Seitenleiste“. Problem gelöst!

Erstellen von benutzerdefinierten Designelementen

Indem Sie sich auf die beliebtesten benutzerdefinierten Designelemente konzentrieren, erreichen Sie Ihr Ziel effizient. Zu den Elementen, auf die Sie sich konzentrieren müssen, gehören Kopfzeile, Fußzeile, der Inhaltsbereich für Beiträge und Seiten sowie Archivlayouts für Ihr benutzerdefiniertes Design. Also, legen wir gleich los!

Ein Mann, der sich eine Website ansieht, nachdem er es geschafft hat, ein benutzerdefiniertes WordPress-Theme zu erstellen.
Um am Ende ein schönes Finishing-Produkt zu erhalten, müssen Sie zunächst etwas Arbeit investieren.

Erstellen eines benutzerdefinierten Headers

Sobald Sie das fertige Produkt zur Hand haben, können Sie die Farbe und den Hintergrund ändern und sogar Spalten und Zeilen hinzufügen, indem Sie die Drag-and-Drop-Funktion verwenden. Doch wie kommt man zum fertigen Produkt? Klicken Sie zunächst auf Beaver Builder – Neue Seite hinzufügen, um einen Titel für Ihre Kopfzeile anzugeben . Wir hoffen sehr, dass Sie einen guten im Sinn haben.

Sobald Sie damit fertig sind, sollten Sie „Themer-Layout“ als Typ und „Header“ als Layout-Option auswählen und dann auf die Schaltfläche „Themer-Layout hinzufügen“ klicken, die Sie zur Seite mit den Layout-Einstellungen bringt. Klingt kompliziert, aber Sie werden den Dreh schnell herausbekommen. Wählen Sie nun „Gesamte Website“ als Ort, an dem der Header angezeigt wird, und voila – Sie erhalten einen einfachen Header, mit dem Sie arbeiten können. Und jetzt kommen die eingangs erwähnten erweiterten Einstellungen ins Spiel.

Erstellen einer benutzerdefinierten Fußzeile

Der Startvorgang ist sehr ähnlich wie beim Erstellen einer benutzerdefinierten Fußzeile. Klicken Sie zunächst auf Beaver Builder – Neue Seite hinzufügen, geben Sie den Fußzeilentitel ein und wählen Sie „Themer-Layout“ als Typ und „Fußzeile“ als Layoutoption aus. Durch Klicken auf „Themer-Layout hinzufügen“ gelangen Sie zur nächsten Seite, der Seite mit den Layout-Einstellungen. Wählen Sie die Option „Gesamte Site“ und dann „Beaver Builder starten“. Dieses Layout ist Ihr Ausgangspunkt, danach können Sie Module hinzufügen, Farbe und Text ändern und die Fußzeile anpassen.

Erstellen eines Inhaltsbereichs für Beiträge und Seiten

Inzwischen konnten Sie wahrscheinlich feststellen, dass Beaver Builder ziemlich genau nach einer Reihe von Mustern funktioniert. Und der Startprozess ist ungefähr derselbe wie beim Erstellen von Kopf- und Fußzeilen, mit dem Unterschied, dass Sie jetzt den Hauptteil der gesamten Website erstellen. Und das ist der Prozess, der dem Erstellen von konvertierenden Landingpages unweigerlich vorausgeht – Sie müssen sich zuerst mit dem Design befassen. Sie können ein Layout auswählen, das nur für Ihre Posts, nur für Ihre Seiten oder sowohl für Posts als auch für Seiten funktioniert . Dann sollten Sie „Beaver Builder starten“, um die Benutzeroberfläche zu öffnen, wo Sie ein Beispiel des Layouts sehen, mit der Option, auf eine der Komponenten der Seite zu klicken und sie zu bearbeiten.

Layouts archivieren

Inzwischen bekommt Ihr benutzerdefiniertes Design bereits sein Aussehen und Sie nähern sich der Ziellinie. Und wenn Sie noch nie von Archivseiten gehört haben, sind dies die Seiten, die Ihre Kategorien und Tags anzeigen. Mit einem Wort, sie sind wichtig. Auch hier können Sie separate Layouts für Kategorien, Tags und Monatsarchive erstellen. Sobald Sie sich auf den mittlerweile bereits bekannten Prozess einlassen, der mit einem Klick auf die Seite Beaver Builder – Add New beginnt, wissen Sie intuitiv, was zu tun ist. Wenn Sie mit der Bearbeitung fertig und mit dem fertigen Produkt zufrieden sind, vergessen Sie nicht, auf „Fertig“ zu klicken. '

Code auf dem Display.
Sie haben es geschafft, ein benutzerdefiniertes Design zu erstellen, ohne eine Zeile Code zu schreiben.

Wenn Sie ein benutzerdefiniertes WordPress-Theme erstellen, tun Sie viel mehr als nur ein ansprechendes Design

Sie verbessern auch die Funktionalität Ihrer Website und gewinnen neue Besucher/Kunden. Wie Sie wissen, verkauft sich das Aussehen. Und sobald Sie ein benutzerdefiniertes WordPress-Theme erstellt haben, können Sie Ihre Website noch weiter entwickeln und verbessern . Von der mobilfreundlichen Gestaltung Ihrer WordPress-Website bis hin zur Erstellung eines Online-Shops sind die Möglichkeiten endlos.