WordPress-Themes mit Bootstrap

Zusätzliche Formatierungen bereitstellen

LinkedIn Learning kostenlos und unverbindlich testen!

Jetzt testen Alle Abonnements anzeigen
Der WordPress-Editor kann um zusätzliche benutzerdefinierte Styles oder Überschriften erweitert werden. Bei Bedarf lassen sich bestehende Formatierungen innerhalb des Themes auch deaktivieren.
03:25

Transkript

Fällt Ihnen in dieser Ansicht etwas auf? Ich mache hier mal die zweite Leiste hier hinein und gehe mal auf Absatz und vielleicht fällt Ihnen jetzt etwas auf. Zum einen gibt es hier einen neuen Button, der heißt Styles, der ist standardmäßig nicht vorhanden, und zum anderen gibt es hier viel weniger Überschriften. Bisher hat man da die Überschrift 1 bis 6 gehabt. Und was es auch neu gibt ist, wenn ich jetzt hier beispielsweise diesen Absatz hier markiere und sage das Ganze soll roter Text werden, dann wird der in rot angezeigt und das hier hätte ich gerne in blau angezeigt und zusätzlich Überschriften kann ich gar nicht vergeben. Das ist etwas, um den Arbeitsalltag eines Redakteurs vielleicht zu erleichtern. Wir können also eigene Absatz-Styles definieren und wir können vor allem auch nicht erlaubte Tags hier unten auch herausnehmen, weil die Überschrift 4, 5 und 6 ist vielleicht gar nicht möglich bei Ihnen in Ihrem Theme, und dann können wir einfach nur diejenigen Möglichkeiten einem Redakteur bereitstellen, die auch tatsächlich Verwendung finden dürfen, und das macht, denke ich, den Arbeitsalltag etwas einfacher. Es geht relativ einfach, wenn man so etwas umsetzen möchte. Ich bin hier in der Datei functions.php und das ist eigentlich der gesamte Code, um den es hier geht. Zum einen habe ich hier einen Bereich, ein add_filter tiny_mce_before_init. Das muss man sich nicht merken, am besten ist, man macht copy und paste. Wir können also, bevor dieser tiny_mce, dieser Editor initialisiert wird, noch zusätzlich Informationen übergeben und das mache ich hier in der Funktion berge_mce_format, die habe ich hier oben definiert. Die bekommt eine init Variable übergeben, die später auch wieder zurückgegeben wird. Und hier sage ich jetzt, das hier sind auch vorgefertigte Werte. Ich habe hier einerseits meine zusätzlichen Styles, roter Text, das ist das, was der Redakteur sieht, blauer Text, roter Text, hier ein Komma in der Mitte und red Text, das ist dann später der Klassenname innerhalb von CSS, der hier vergeben wird. Hier oben sage ich bei den Blockformats, ich möchte die Überschrift zwei haben, das soll eine h2 werden, die Überschrift 3 soll eine h3 werden. Ich könnte hier natürlich auch sagen, das Ganze soll nicht Überschrift 3 heißen, sondern zum Beispiel Zwischenüberschrift und das wird dann später als h3 formatiert. Auf dieses red_text habe ich natürlich ganz normal Einfluss über meine stylesheets Datei, das brauche ich nicht zu erklären, aber wie sorge ich dafür, dass es hier im Back-End auch schon dieser rote Text wird. Ich kann im Back-End eine zusätzliche stylesheet Datei definieren. Das mache ich mit add_action_init, und dann sage ich berge_add_editor_styles. Diesen Funktionsnamen kann ich hier frei vergeben, aber dann sage ich: add_editor_style berge-editor-style.css. Eine Datei, die ich in meinem Theme ganz normal angelegt habe, und hier sage ich red_text soll die Colour Rot haben und blue_text soll entsprechend blau sein. Das heißt mit diesem kleinen Codeblock kann ich dem Redakteur nur die Möglichkeiten zur Verfügung stellen, die auch tatsächlich in meinem Theme verwendet werden und darüber hinaus sogar noch eigene CSS Klassen vergeben.

WordPress-Themes mit Bootstrap

Verwirklichen Sie Ihre eigenen Designvorstellungen bei Ihrem Webauftritt und sehen Sie, wie Sie WordPress-Seiten über Plug-ins und Themes wie z.B. Bootstrap erweitern können.

2 Std. 33 min (39 Videos)
Derzeit sind keine Feedbacks vorhanden...

Dieser Online-Kurs ist als Download und als Streaming-Video verfügbar. Die gute Nachricht: Sie müssen sich nicht entscheiden - sobald Sie das Training erwerben, erhalten Sie Zugang zu beiden Optionen!

Der Download ermöglicht Ihnen die Offline-Nutzung des Trainings und bietet die Vorteile einer benutzerfreundlichen Abspielumgebung. Wenn Sie an verschiedenen Computern arbeiten, oder nicht den ganzen Kurs auf einmal herunterladen möchten, loggen Sie sich auf dieser Seite ein, um alle Videos des Trainings als Streaming-Video anzusehen.

Wir hoffen, dass Sie viel Freude und Erfolg mit diesem Video-Training haben werden. Falls Sie irgendwelche Fragen haben, zögern Sie nicht uns zu kontaktieren!