Artikel zum Stichwort Anleitung

von Kirsten

Anleitung Childtheme anlegen (Update)

Dieser Artikel stammte ursprünglich aus dem Jahr 2017. Er wurde im Februar 2020 überarbeitet und aktualisiert.

Ein WordPress-Theme an die eigenen Bedürfnisse anzupassen ist gar nicht so schwer. Die meisten Anpassungen kannst du über zusätzliche CSS-Angaben umsetzen. Das machst du entweder über den Customizer oder über ein Child-Theme.

CSS im Customizer

Deine CSS-Angaben schreibst du in das Customizer Panel „zusätzliches CSS“. Du siehst gleich, ob deine Anweisung greift, weil der Customizer die Seite mit dem neuen CSS sofort nachlädt.
Es gibt sogar ein Syntax-Highlighting und Fehlermeldungen, falls in der Schreibweise mal was nicht stimmt.

Der Customizer eignet sich sehr gut für kleine Anpassungen. Wenn dir das Theme im Großen und Ganzen gut gefällt und du nur ein paar wenige Details verändern möchtest, dann kannst du das sehr gut über den Customizer machen.

Sobald du aber etwas tiefer in das Design des Themes eingreifst, sammeln sich schnell viele Zeilen CSS an. Dann wird es unübersichtlich im Customizer. In diesem Fall ist es sinnvoller, ein Child-Theme anzulegen.

Was ist ein Child-Theme?

Ein Childtheme ist ein kleiner Ableger des Original-Themes. Das Original-Theme wird zum Parent (=Eltern)-Theme.

Der Vorteil dabei: Das Eltern-Theme bleibt wie es ist und wird nicht angetastet. Wenn die Entwickler des Themes ein Update zur Verfügung stellen, kannst du das Parent-Theme updaten, ohne dass deine Anpassungen verloren gehen.

Im Childtheme-Ordner liegen nur die Dateien, die tatsächlich verändert wurden. Das macht es leichter, die Änderungen nachzuhalten und den Überblick zu behalten.

Weiterlesen Anleitung Childtheme anlegen (Update)
von Kirsten

Den Gutenberg-Editor um eine eigene Farbpalette erweitern

Für einige Gutenberg-Blöcke kann man Farben auswählen, eine Hintergrundfarbe und eine Textfarbe. Diese Farben kann man sich aus einer Farbpalette aussuchen.

In der Standardeinstellung bringt der Gutenberg-Editor eine Farbpalette mit vordefinierten Farben mit. Zusätzlich gibt es noch die Option, eine eigene Farbe auszuwählen: Wenn man auf den Link „individuelle Farbe“ klickt, öffnet sich ein Color-Picker.

Eine individuelle Farbpalette für mein Theme

Die Standardfarben sind einfach irgendwie bunt und passen wahrscheinlich nicht so recht zum Theme. Deshalb bringen gutenberg-kompatible Themes in der Regel ihr eigenes Farbschema mit. Meistens muss man hier nichts machen. Nur wer eigene Themes entwickelt muss selbst Hand anlegen.

Die Farbpalette findet man in der rechten Seitenleiste unter „Farbeinstellungen“.

Weiterlesen Den Gutenberg-Editor um eine eigene Farbpalette erweitern
von Kirsten

Im Gutenberg-Editor mit CSS-Klassen arbeiten

Eine relativ einfache Methode, das Aussehen eines Gutenberg-Blocks anzupassen, ist das Arbeiten mit CSS-Klassen.

Bei jedem Gutenberg-Block gibt es die Möglichkeit, eine CSS-Klasse einzutragen. Ich arbeite viel mit solchen Helfer-Klassen. Sie lassen sich gut in die CSS-Systematik eines Projekts integrieren.

Das Feld dafür findest du unter Erweitert/Zusätzliche CSS-Klassen(n).
Hier die CSS-Einstellung für den Absatz-Block:

Weiterlesen Im Gutenberg-Editor mit CSS-Klassen arbeiten
von Kirsten

Mit Text- und Überschrift-Blöcken arbeiten im Gutenberg-Editor

Mit dem Gutenberg-Editor hat sich das Arbeiten mit Texten verändert. Jede Überschrift, aber auch jeder Absatz, ist jetzt ein eigener Block.

Man muss sich beim Schreiben von Texten also ein bisschen umgewöhnen. Man schreibt nicht mehr alles hintereinander weg ein einen „Kasten“ hinein, sondern man produziert einzelne Blöcke. Diese Blöcke kann man dann einzeln bearbeiten.

ZUM WEITERLESEN
Was ändert sich für meine Website mit Gutenberg

Absatz oder Überschrift verschieben

Man kann zum Beispiel Absätze und Überschriften im Text verschieben. Ich nutze das sehr viel. Im alten Editor konnte man einen Text nur durch ausschneiden und einfügen von der Stelle bewegen. So geht es viel schneller.

Weiterlesen Mit Text- und Überschrift-Blöcken arbeiten im Gutenberg-Editor
von Elisabeth

Anleitung: Test-Seite mit .htaccess schützen

Eine Webseite, die noch im Aufbau ist, soll nicht jeder sehen können. Erst wenn alles fertig ist, soll die Seite für alle Besucher und Suchmaschinen sichtbar werden. Auf diese Weise kann man in Ruhe arbeiten und sich mit Kunden und Kollegen abstimmen.

Eine einfach Möglichkeit, einer Website einen „Sichtschutz“ zu verpassen, ist eine Coming-Soon-Seite davor zu schalten. Dafür gibt es viele gute Plugins bei wordpress.org.
Damit ist die Seite vor unbefugten Blicken abgeschirmt. Wer Zugangsdaten zum WordPress-Backend hat, kann sich anmelden, alle anderen sehen nur die Coming-Soon-Seite.

In der Regel landet man mit diesen Plugins nach der Anmeldung im Backend. Für Laien kann das irritierend sein. Sie verstehen nicht, wo sie sich befinden und finden den Weg zur Vorderseite nicht.
Die meisten Coming Soon Plugins haben aber inzwischen eine Option, bei der die Benutzer direkt ins Frontend geleitet werden.

Schritt für Schritt zum .htaccess-Schutz

Ein anderer, klassischer Weg ist das Abschirmen der Website per .htaccess.

Weiterlesen Anleitung: Test-Seite mit .htaccess schützen