WordPress Theme anpassen - Theme Optionen & Theme Customizer
WPC - Dein WordPress Blog

WordPress Theme anpassen Teil 1: Theme Optionen & Theme Customizer

WordPress ist wie eine Droge! Diesen Satz habe ich vor Kurzem in einem Blogbeitrag gelesen und kann dem Autor auf jeden Fall zustimmen. Die Software hat durchaus ein gewisses Suchtpotential. Mal eben schnell eine einfache Vereins- oder Hochzeits-Website erstellen und ehe man sich versieht, steckt man mitten drin in der Theme Anpassung und erstellt sogar eigene WordPress Themes, weil die übrigen 100.000 Themes, die es bereits gibt, niemals den eigenen Vorstellungen entsprechen können ;-). So in etwa lässt sich auch mein Start in das WordPress Leben kurz zusammenfassen.

(*) = Affiliate Links

Die folgende Artikelreihe wird hoffentlich auch dich in den WordPress Bann ziehen. Denn du wirst sehen, wie einfach es ist, ein bestehendes WordPress Theme an die individuellen Bedürfnisse anzupassen.

Die Artikelserie „WordPress Theme anpassen wie ein Profi“ wird aus folgenden Artikeln bestehen:

Die Serie startet mit der einfachsten Möglichkeit, ein Theme anzupassen, nämlich nur über die vom Theme Entwickler zur Verfügung gestellten Optionen. Die Theme Optionen findest du entweder auf einer Unterseite im Adminbereich (old fashion way) oder im Theme Customizer, wie es bei modernen und neueren Themes der Fall ist.

WordPress Theme Anpassung über Theme Optionen im Adminbereich

Da es jedem Entwickler frei steht, wo er die Theme Optionen platziert, sind diese teilweise gar nicht so einfach zu finden. Man aktiviert ein Theme und muss dann erst mal überprüfen, welche Menü-Punkte bzw. Untermenü-Punkte im Adminbereich neu dazugekommen sind.

Historisch bedingt ist es leider immer noch gängige Praxis, dass die Theme-Optionen im Adminbereich zu finden sind. Selbst beim beliebtesten WordPress Theme Divi (*) befinden sich die Einstellungen im Adminbereich. Da es Divi schon lange vor der Theme Customizer Funktion gab, gehe ich davon aus, dass die Entwickler die schön gestylten Theme Optionen nicht nachträglich umswitchen wollten.

Divi Theme anpassen mit Theme Optionen - leider immer noch im Adminbereich
Divi Theme anpassen mit Theme Optionen – leider immer noch im Adminbereich

Als Ersatz für die Anpassung im Customizer bekam Divi einen komfortablen Page Builder, der eine einfache Handhabung mit Live-Vorschau bietet.

WPC Tipp:

Ich lehne mich jetzt mal aus dem Fenster und sage: Falls du ein neues/junges Theme verwendest, welches die Theme Optionen anstatt im Customizer im Adminbereich hat, rate ich dir ein anderes Theme zu wählen. Da ich selbst schon WordPress Themes erstellt habe, weiß ich, dass die Entwicklung / Programmierung für den Customizer nicht ganz einfach ist. Ein Entwickler, der diese Hürden scheut, wird sehr wahrscheinlich auch an anderen Stellen im Code den Weg des geringsten Widerstands gehen und möglicherweise eine Code-Qualität produzieren, die nicht „state of the art“ ist.

WordPress Theme Anpassung über Theme Customizer

Der größte Vorteil des Theme Customizers gegenüber der Anpassung im Adminbereich ist die Live-Vorschau. Übrigens den Begriff Live-Vorschau darfst du ruhig wörtlich nehmen. Wenn du deine Seite erst aktualisieren musst, damit die Änderungen sichtbar werden, ist es keine Live-Vorschau. Das darf man gerne auch als Quailtätsmerkmal eines Themes bezeichnen, wenn jede Anpassung sofort sichtbar wird.

Zu dem Customizer gelangst du im Adminbereich über Design > Customizer oder indem du in der Adminbar auf Customizer klickst. Hier am Beispiel des WordPress Themes Twenty Seventeen.

WordPress Theme anpassen mit dem Theme Customizer
WordPress Theme anpassen mit dem Theme Customizer an Beispiel von Twenty Seventeen

Seit WordPress Version 4.9 ist es möglich, die Customizer Einstellungen zu speichern, ohne diese gleich zu veröffentlichen (Punkt 1 im oberen Screenshot). Praktisch ist auch, dass die gespeicherten Design-Optionen per Link an Mitarbeiter, Kunden oder Lieferanten verschickt werden können. Außerdem lassen sich die Änderungen planen und zu einem späteren Zeitpunkt veröffentlichen.

Darüber hinaus gibt es bestimmte Sektionen, die standardmäßig bei jedem Theme enthalten sind (Punkt 2 bis 7 sowie Punkt 9 im oberen Screenshot). Im Großen und Ganzen können hier die gleichen Anpassungen vorgenommen werden, wie im Adminbereich . Das sind z. B. Titel und Beschreibung der Seite ändern (2), ein allgemeines Farbschema auswählen (3), Header-Bild hochladen (4), Menüs erstellen (5), Widgetbereiche mit Widgets befüllen (6) oder Startseite festlegen (7). Standard bedeutet jedoch nicht, dass diese Optionen auch automatisch in deinem Theme zu finden sind. Der Theme Entwickler kann nämlich bestimmte Default-Optionen auch entfernen.

Die Theme Optionen wurden beim Theme Twenty Seventeen unter einer eigenen Sektion zusammengefasst.

Zusätzliches CSS (9) ist wiederum eine Funktion, die standardmäßig enthalten ist. Wir werden uns im 2. Teil dieser Artikelreihe näher mit dieser Option befassen.

Sehr nützlich sind auch die 3 Icons am unteren Rand des Customizers (10), mit denen man überprüfen kann, wie gut die eigene Website für mobile Geräte optimiert ist.

Es gibt WordPress Themes, wie z. B. das tolle OceanWP (*), die durch die zahlreichen Theme Optionen im Customizer die Theme Anpassung selbst für WordPress Einsteiger erheblich vereinfachen.

WordPress Theme Anpassung über die Theme Optionen im Customizer beim besten kostenlosen Theme OceanWP
WordPress Theme Anpassung über die Theme Optionen im Customizer beim besten kostenlosen Theme OceanWP

Die Optionen (Settings) wurden übersichtlich einzelnen Sektionen zugeordnet, die wiederum in Panels zusammengefasst wurden. Selbst bei der kostenlosen Version des Themes ist die Anzahl der Theme Optionen sehr beeindruckend.

Export/Import Funktion für den Customizer

Zum Abschluss des ersten Teils möchte ich dir noch ein wirklich tolles Plugin vorstellen: Customizer Export/Import. Damit kannst du alle deine Einstellungen im Customizer exportieren und auf einer anderen WordPress Seite wieder importieren. Das Tolle an dem Plugin ist, dass nicht nur die Standard-Einstellungen exportiert werden, sondern alle theme-spezifischen Optionen, die sich im Customizer befinden.

Vermisst du bestimmte Optionen bei deinem WordPress Theme?

Viele WordPress Einsteiger kommen irgendwann an den Punkt, an dem die individuellen Änderungswünsche über die verfügbaren Theme Optionen hinausgehen. Dann wird es Zeit für den zweiten Teil unserer Artikelserie „WordPress Theme anpassen wie ein Profi“ mit dem Browser Entwickler Tools und zusätzlichem CSS.

Du kannst noch Einfluss auf die Artikelreihe nehmen. Sollen in den folgenden Artikeln bestimmte Themen bzgl. Theme Anpassung behandelt werden? Hast du Schwierigkeiten dein WordPress Theme anzupassen? Hinterlasse einfach unten einen Kommentar.

Artikel Empfehlung: WordPress Theme anpassen Teil 2: Eigenes CSS & Browser Entwicklertools

ZUM ARTIKEL
Vielen Dank fürs Teilen dieser Seite

11 Kommentare zu „WordPress Theme anpassen Teil 1: Theme Optionen & Theme Customizer“

  1. R

    Der neue Customizer ist wirklich klasse. Leider habe ich es bis jetzt nicht geschafft Shortcode dort unterzubringen (von Polylang). ICh habe die Funktion wp_filter_nohtml_kses ausgeblendet, in der Hoffnung, wenn HTML funktioniert nimmt der Customier auch Shortcode. Tut er leider nicht. Gibt es einen Trick?

    Viele Grüße
    Ralf

    1. D

      Hallo Ralf,
      ich weiß nicht, ob ich deine Frage richtig verstehe. Wo hast du denn versucht den Shortcode im Customizer einzugeben? Die einzige mir bekannte Möglichkeit im Standard Customizer Shortcodes zu verwenden, ist das Text Widget. Seltsamerweise akzeptiert nicht einmal das neue HTML Widget Shortcodes. Aber wenigstens kann man seit der Version 4.9 in das Text Widget Shortcodes eingeben, ohne zusätzlichen Code in die functions.php Datei einzutragen.
      Übrigens im nächsten Teil unserer Artikelserie wird es genau um das Thema Shortcodes gehen 🙂
      Viele Grüße, Danijel

  2. N

    Hallo Danijel,
    ich benutze das Theme und versuche seit geraumer Zeit meine Animation, als mp4 Video angespeichert und
    im Customizer-Bereich hochegalden, mit Ton auf der Startseite zu hören. Das Video geht gleich auf der Startseite im Header los. Im Customizer-Bereich wird die kleine Vorschau mit Ton abgespielt, leider nicht auf der Startseite. Kannst du mir da einen Tipp geben? Muß ich noch ein Plugin istallieren oder habe ich eine Einstellung übersehen?
    Meine Seite ist noch nicht online!
    Danke
    LG Nicola

    1. D

      Hallo Nicola,
      welches Theme verwendest du – OceanWP oder Divi? Werden beide im Artikel erwähnt. Bei welcher Customizer Einstellung hast du die mp4-Datei hochgeladen?
      LG, Danijel

  3. N

    Hallo Danijel,

    ich verwende Twenty Seventeen…. ich hatte da Foto oben gesehen, welches dort auch als Vordesign hochgeladen ist…
    Ja, habe im Customizer Bereich die MP4 Datei unter Video hochgeladen. Wie gesagt in dem kleinen Vorschauviedeo kann ich es mit ton Starten, dann auf der website im Header nicht.
    Kannst du mir da weiter helfen?

    Sonnige Grüße
    Nicola
    Danke für deine schnelle Reaktion 😉

  4. N

    Hi Danijel,

    ach, ok, besten Dank für dein Mühe und Rückmeldung!
    Lese ich dann mal nach .

    Sonnige Grüße aus HH
    Nicola

  5. M

    Hi Danijel,

    ich starte gerade mit WP und würde gerne bei dem Theme „Hemingway“ von Anders Norén den schwarzen Balken, auf dem Header-Bild liegt, nehmen. Geht das irgendwie? Falls Du noch Kommentar beanwortest.

    Danke für Info.

    Gruß aus Tölz 😉
    Monika

  6. M

    Sorry, es fehlen immer mal wieder Buchstaben oder Wörter, wenn ich den Text nicht durchlese bevor ich ihn abschicke, weil ich immer wieder umdenke, wie ich mich am verständlichsten artikuliere. Ich möchte den schwarzen Balken herausnehmen, der die Schrift über dem Header-Bild unterlegt, so daß nur die weiße Schrift übrig bleibt. Und natürlich, falls Du noch Kommentare beantwortest.

Kommentar verfassen

Deine E-Mail-Adresse wird nicht veröffentlicht. Erforderliche Felder sind mit * markiert.

Table of Contents

QUIZ: Teste dein WordPress Wissen!

0%

Wann erschien die erste Version von WordPress?

Correct! Wrong!

Die erste Version von WordPress erschien am 27.03.2003. Damit ist WordPress älter als Facebook und Twitter.

Welches der genannten Optionen ist kein WordPress Page-Builder?

Correct! Wrong!

Gravity Forms ist eins der beliebtesten Premium Formular Plugins.

In welcher Datei befinden sich die Sicherheitsschlüssel?

Correct! Wrong!

In der wp-config.php Datei.

Wie werden WordPress Themes wie Genesis und Beans noch genannt?

Correct! Wrong!

Ein Theme Framework ist ein vorprogrammiertes Set an Funktionen und Features, um die (Child) Theme Entwicklung zu beschleunigen.

Um den Adminbereich aufzurufen, muss die eigene Domain wie folgt erweitert werden:

Correct! Wrong!

Um beispielsweise von der Domain https://wpconsultant.de den Adminbereich aufzurufen, muss die Domain wie folgt ergänzt werden: https://wpconsultant.de/wp-admin. Möglich ist auch die URL-Endung https://deine-domain.de/wp-login.php

Welche Dateien braucht ein WordPress Theme mindestens, um zu funktionieren?

Correct! Wrong!

Damit ein WordPress Theme richtig funktioniert, benötigt es mindestens 2 Dateien: index.php und style.css. Die index.php Datei ist das Standard Template für das Theme und im Header der style.css Datei werden die notwendigen Informationen über das Theme eingetragen wie z. B. Name, Autor etc.

Was ist kein typischer Anwendungsfall für eine WordPress Multisite?

Correct! Wrong!

Um eine Landing Page zu erstellen, benötigt man nicht die Multisite Installation. Dafür reicht entweder ein wenig HTML und CSS oder eins der vielen Landing Page Plugins. Mein Tipp: Mit dem kostenlosen Plugin Elementor kannst du professionelle Landing Pages schnell erstellen. Hier erfährst du mehr über WordPress Multisite - Anwendung & Installation.

Welche Sprache spricht die WordPress Software nicht?

Correct! Wrong!

Die WordPress Software basiert auf den Sprachen PHP und MySQL. 10% der Software besteht mittlerweile aus Javascript (Tendenz steigend).

Was ist kein typischer Anwendungsfall für ein Child-Theme?

Correct! Wrong!

Eine Kopie der gesamten Website erstellt man z. B. mit dem Plugin Duplicator. Die verschiedenen Anwendungsfälle eines Child Themes und die richtige Erstellung erfährst du in dem Artikel WordPress Child Theme erstellen 2020.

Was ist ein WordPress Loop?

Correct! Wrong!

Eine Funktion, die Daten aus der Datenbank holt und sie verändert, bevor sie im Browser angezeigt werden, nennt man in WordPress einen Filter bzw. einen Filter-Hook. Eine Aktion, die an einer bestimmten Stelle im Programmablauf ausgeführt wird nennt man Action oder Action-Hook. Ein Loop ist ein PHP Code, der vordefinierte Beiträge (oder Custom Post Types) aus der Datenbank holt, um sie auf speziellen Template Dateien innerhalb eines Themes anzuzeigen.

In welchen Ordner (Verzeichnis) werden Medien wie z. B. Bilder hochgeladen?

Correct! Wrong!

In der Regel besteht der uploads-Ordner aus den einzelnen Jahres-Ordnern, die wiederum aus mehreren Monats-Ordnern bestehen.

Welches Feature ist keine Empfehlung für das WordPress Hosting (gemäß wordpress.org)?

Correct! Wrong!

Auf wordpress.org unter Requirements findest du die Empfehlung für das WordPress Hosting. Hier auf WPC findest du auch meine Hosting Empfehlung für 2020.

Welche Einstellungen gehören nicht in die wp-config.php Datei?

Correct! Wrong!

Die Integration von Javascript- und CSS-Dateien in das jeweilige Theme erfolgt in der functions.php Datei und zwar mittels wp_enqueue_scripts bzw. wp_enqueue_style.

Welche Rolle gehört nicht zu den 6 Standard User-Rollen?

Correct! Wrong!

Die 6 User Rollen in WordPress sind: Super Admin, Administrator, Editor, Author, Contributor und Subscriber.

Was kann man unter dem Menüpunkt "Einstellungen" im Adminbereich nicht tun?

Correct! Wrong!

Website Daten exportieren erfolgt unter dem Menüpunkt "Werkzeuge".

WordPress Quiz
Kein Grund zur Sorge!

Schau doch öfters mal hier auf WPC vorbei und melde dich am besten gleich für unseren Newsletter an! Du kannst auch den WPC YouTube Kanal abonnieren mit vielen kostenlosen WordPress und Elementor Tutorials. Und falls es ein bisschen mehr sein darf, gibt es da noch den WordPress Kurs von WPC ;-)
Gar nicht so schlecht!

Du weißt schon einiges über WordPress! Um dein Wissen noch weiter auszubauen, empfehle ich dir die Beiträge hier auf WPC, meinen YouTube Kanal mit vielen kostenlosen WordPress und Elementor Tutorials und natürlich meinen WordPress Kurs von WPC :-)
Wow! Das kann sich sehen lassen!

Herzlichen Glückwunsch! Du bist auf dem besten Weg, ein WordPress Experte zu werden. Bleib am Ball, am besten mit den Beiträgen hier auf WPC, meinem YouTube Kanal mit vielen kostenlosen WordPress und Elementor Tutorials und natürlich meinem WordPress Kurs von WPC :-)
Hast du dich gerade ein wenig gelangweilt? :-)

Aber keine Sorge, bald erscheint hier auf WPC ein Quiz für Fortgeschrittene WordPress User. Am besten du meldest dich gleich für den Newsletter an, damit du es nicht verpasst! ;-) In der Zwischenzeit kannst du ja mal dein Datenschutz-Wissen mit dem DSGVO Quiz testen.

KURS: WordPress schneller lernen!

Related Posts

Ähnliche Beiträge