Archiv des Autors: Juergen Schulze

Entwicklungsumgebung für Symfony auf Oracle VM mit Debian und Windows als Host, Teil 3

Nun kommen wir Symfony einen Schritt näher. Da Symfony zunächst einmal eine große Sammlung verschiedenster PHP-Dateien ist, benötigen wir die Anwendung composer. Diese hilft uns – hier und im Weiteren – verschiedene PHP-Anwendungen zu installieren. Vorher müssen noch einige zusätzliche Befehle installiert werden. Wir gehen wie folgt vor:

sudo apt update # Linux-Pakete auf den neuesten Stand bringen
sudo apt install wget php-cli php-zip unzip php-xml # was sonst noch gebraucht wird
cd ~
wget -O composer-setup.php https://getcomposer.org/installer
sudo php composer-setup.php --install-dir=/usr/local/bin --filename=composer
sudo composer self-update # composer selbst auf den neusten Stand bringen
composer --version # die aktuelle Versionsnummer herausgeben
rm composer-setup.php # kann gelöscht werden

PHP 8 installieren

Aktuell wird PHP 7.1 oder höher benötigt, um Symfony zu nutzen. Wir installieren also gleich PHP 8. Ich folge dieser Anleitung: https://computingforgeeks.com/how-to-install-php-on-debian-linux/

sudo apt update
sudo apt -y upgrade
sudo reboot # falls es Kernel-Upgrades gab
sudo apt install -y lsb-release ca-certificates apt-transport-https software-properties-common gnupg2
echo "deb https://packages.sury.org/php/ $(lsb_release -sc) main" | sudo tee /etc/apt/sources.list.d/sury-php.list
wget -qO - https://packages.sury.org/php/apt.gpg | sudo apt-key add -
sudo apt update
sudo apt install php8.0
sudo update-alternatives --set php /usr/bin/php8.0 #  PHP 8 als Default PHP Version aktivieren
sudo apt install php8.0-{mysql,cli,common,imap,ldap,xml,fpm,curl,mbstring,zip}
sudo apt install php8.0-intl
sudo apt install php8.0-xsl
sudo apt install php8.0-amqp
sudo apt install php8.0-gd
php -v # PHP-Version ausgeben
php -m # zeigt die erfolgreich installierten Module an

So, jetzt geht es ans Eingemachte. Wir erstellen unser erstes Symfony-Projekt. Es erhält den Namen testproject. Wenn im Laufe des Procederes die Frage gestellt wird, ob man für Docker eine Konfiguration anlegen möchte, so kann man das getrost verneinen.

cd /var/www/html # hier wird installiert
composer create-project symfony/website-skeleton testproject

Wir rufen im Browser folgende Adresse auf: http://masch3/testproject/public/

Das ist doch schonmal ein schöner Erfolg. Werfen wir mal einen Blick in das von composer erzeugte Verzeichnis:

Im Browser sieht das Verzeichnis folgendermaßen aus:

Entwicklungsstudio VSCodium

Natürlich könnte man jetzt auch mit einem simplen Text-Editor arbeiten. Aber das wäre bei einem komplexen Framework wie Symfony so, als würde man versuchen, mit den Füßen einen Faden in ein Nadelöhr einzufädeln: möglich, aber sehr mühselig.

Daher installieren wir uns auf unserem Windows-Rechner den von mir favorisierten Editor VSCodium. VSCodium ist die OpenSource Alternative zu Visual Studio Code von Microsoft und ähnelt diesem komplett, bis auf die Tatsache, dass keine Nutzungsdaten an Microsoft sendet.

Für meine Windows-Version nutze ich: https://github.com/VSCodium/vscodium/releases/download/1.63.2/VSCodium-x64-1.63.2.msi

VSCodium nach dem ersten Start

Wenn wir im Editor nun auf unser Projekt-Verzeichnis S:\html\testproject zugreifen (File→Open Folder …), werden wir mit einer kleinen Sicherheitsabfrage konfrontiert, die wir getrost bejahen können, solange nur wir mit dieser Entwicklungsumgebung arbeiten.

Danach sieht es im Editor so aus:

Es gibt einige Erweiterungen (Extensions) für VSCodium, die wir uns noch installieren sollten. Das geht ganz einfacher über den eingebauten Extension Marktplatz.

Folgende Erweiterungen werden benötigt:

  • PHP Intelephense
  • Twig Language 2
  • Symfony for VSCode

Nun möchte ich noch das Paket profiler installieren, dieses bietet umfangreiche, unverzichtbare Debug-Werkzeuge, die direkt vom Browser aufgerufen werden können. Dazu wechseln wir auf die Konsole unserer Maschine und geben Folgendes ein:

cd /var/www/html/testproject # Wichtig, da profiler für jedes Symfony-Projekt extra installiert werden muss
composer require --dev symfony/profiler-pack

Pfad-Probleme mit Apache

Leider kann es passieren, dass der Apache-Webserver für die Nutzung von Symfony nicht optimal installiert ist – zumindest ist das bei Debian und Ubuntu der Fall. Dort kann es passieren, dass die Pfade in der URL nicht korrekt erkannt werden.

Um diesem Problem zu begegnen müssen wir die Apache-Konfigurationsdatei /etc/apache2/apache2.conf bearbeiten.

sudo nano /etc/apache2/apache2.conf

Wir suchen nach folgenden Zeilen:

<Directory /var/www/>
        Options Indexes FollowSymLinks
        AllowOverride None
        Require all granted
</Directory>

und ersetzen AllowOverride None durch AllowOverride All.

So sollte der Abschnitt jetzt aussehen:

<Directory /var/www/>
        Options Indexes FollowSymLinks
        AllowOverride All
        Require all granted
</Directory>

Jetzt müssen noch folgende Befehle ausgeführt werden:

sudo a2enmod rewrite
sudo systemctl restart apache2

Und anschließend noch für jedes Symfony-Projekt einzel:

cd /var/www/html/testproject
composer require symfony/apache-pack

Jetzt haben wir auf der Startseite unten links den Profiler aktiviert.

Nun steht den ersten aktiven Schritten in Symfony nichts mehr im Wege. Ich würde aber noch empfehlen, eine vernünftige Server-Konfigurationsumgebung, wie bspw. Webmin zu installieren. Ich beschreibe das in meinem Beitrag: Webmin für Debian installieren.

Was noch fehlt

Um die letzten, noch nützlichen Teile für Symfony zu installieren, benötigen wir zunächst einmal die CLI für Symfony.

echo 'deb [trusted=yes] https://repo.symfony.com/apt/ /' | sudo tee /etc/apt/sources.list.d/symfony-cli.list
 sudo apt update
 sudo apt install symfony-cli

Entwicklungsumgebung für Symfony auf Oracle VM mit Debian und Windows als Host, Teil 2

Nachdem wir uns im ersten Teil um die Grundinstallation unserer virtuellen Maschine gekümmert haben, müssen wir nun erstmal testen, ob diese Maschine vom Windows-Gastsystem über das Netzwerk überhaupt zu erreichen ist. Alles andere wäre zu mühselig, denn wir wollen nicht direkt auf der Maschine unseren PHP/Symfony-Code schreiben, sondern lediglich dort ablegen und zum Laufen bringen.

Um unsere Maschine im Netzwerk kenntlich zu machen, müssen wir einige Einstellungen im Oracle VM Manager vollziehen, und zwar in den Netzwerkeinstellungen. Wichtig: Die Maschine darf noch nicht gestartet sein. Sollte sie schon gestartet sein, dann bitte vorher herunterfahren.

Bitte einfach den Angaben aus dem Screenshot übernehmen. Sollte der angezeigte Name nicht in der Auflistung auftauchen, dann einfach irgendeinen wählen. Bisher habe ich keinen Unterschied dabei entdecken können. Wichtig ist der Punkt: „Promiscous-Modus: erlauben für alle VMs“

Wenn wir jetzt dann die Maschine wieder starten, können wir mit dem Linux-Befehl hostname unsere IP im Netz ermitteln.

hostname -I

Nun prüfen wir noch, ob a) der Webserver auf unserer Maschine korrekt läuft und b) ob der Name (hier: masch3) korrekt aufgelöst wird. Dazu geben wir einfach http://masch3 im Browser unserer Wahl ein. Und siehe da: Es klappt.

Ein Samba share

Wir werden jetzt schauen, wie wir mithilfe eines Samba-Servers uns über Windows direkt mit der Maschine verbinden können. Wir legen dazu einen Samba share an. Somit können wir zukünftig schreibend und lesend auf Verzeichnisse im Entwicklungsserver, und zwar über einen frei zu wählenden Laufwerksbuchstaben, zugreifen. Das ist sehr viel komfortabler, als die Dateien per FTP zu befördern.

Wir loggen uns in gestartete Maschine ein und geben folgende Befehle ein. (nicht wundern, man wird öfters aus Sicherheitsgründen bei Nutzung des sudo-Befehls dazu gezwungen, das Passwort einzugeben.

sudo apt-get install samba # der Server, alles per Default akzeptieren
sudo cp /etc/samba/smb.conf /etc/samba/smb.conf_backup # Kopie schadet nie
systemctl status smbd # Status prüfen

Der Befehl systemctl status smbd zeigt uns, ob der Samba Server korrekt läuft. Dann sollte die Ausgabe wie folgt aussehen (oder zumindest sehr ähnlich, wobei grüner Text immer gut ist).

Der erste Schritt wäre getan. Nun geht es an die Konfiguration.

MERKE: Für Samba müssen wir extra (mindestens) einen Benutzer anlegen. Dieser Benutzer sollte einen korrespondierenden Nutzer auf der Linux-Ebene haben. Leider übernimmt Samba nicht direkt die Nutzerdatenbank von Linux. Es hat so seine Zeit gedauert, bis ich das verstanden habe.

Wir öffnen die Konfigurationsdatei

sudo nano /etc/samba/smb.conf

und fügen ganz am Ende folgenden Code hinzu:

[www]
  comment = Web Root Dir
  path = /var/www
  valid users = <username>
  browseable = yes
  public = no
  writable = yes
  printable = no
  create mode = 0644
  directory mode = 0775
  force group = <username>
  force user = <username>

Und natürlich muss statt <username> euer Benutzername stehen. Diese Angaben ermöglichen den Zugriff eines Nutzers <username> auf den Samba Share /var/www, wobei neue Dateien mit den Zugriffsrechten 0664 angelegt werden und neue Ordner mit 0775. Jede neue Datei und jeder Ordner wird dem Nutzer <username> und der Gruppe <username> zugewiesen.

Nun müssen wir einen Samba Benutzer anlegen:

sudo smbpasswd -a <username> # bitte das Passwort merken

Der Samba share (und alle darin befindlichen Dateien) muss auch dem Benutzer und der Benutzergruppe zugewiesen werden.

sudo chown -R <username>:<username> /var/www

Wir starten den Samba Server neu:

sudo service smbd restart

Netzwerk verbinden

Nun geht es daran, das Samba share übers Netz mit einem Laufwerksbuchstaben von Windows zu verbinden.

  1. Den Windows Explorer öffnen und auf „Dieser PC“ klicken
  2. Jetzt im Menü auf „Netzlaufwerk verbinden“ klicken.
  3. Einen passenden Laufwerksbuchstaben auswählen und folgende Ordner-Angabe eintragen: \\masch3\www
  4. Das Häkchen bei „Verbindung bei Anmeldung wiederherstellen“ kann gesetzt werden.
  5. Nach Klick auf OK müssen die Samba-Verbindungsdaten eingegeben werden, die vorher mit smbpasswd festgelegt wurden.

Wir können nun als (in meinem Fall) über den Laufwerksbuchstaben S: auf den Ordner /var/www unserer virtuellen Maschine zugreifen.

Ein kleiner Test noch, um auch die Schreibrechte zu prüfen. Wir öffnen mit einem normalen Editor – der Microsoft Editor (=Notepad) tut es auch – die Datei S:\html\index.html und setzen hinter den Text „It works!“ eine Ergänzung. Speichern nicht vergessen!

Wir öffnen wieder den Browser mit der Adresse http://masch3 und schauen, ob sich der Text geändert hat. Und siehe da: Es hat geklappt. Wir haben nun von Windows aus einen vollen Zugriff auf den Ordner unserer Maschine /var/www.

In Teil 3 werden wir dann endlich Symfony installieren.

Entwicklungsumgebung für Symfony auf Oracle VM mit Debian und Windows als Host, Teil 1

Orcale VM VirtualBox Manager

Ich beschreibe, wie man eine komplette Entwicklungsumgebung für Symfony aufsetzt. Zum Einsatz kommen eine virtuelle Maschine auf Basis von Oracle VM. Gastsystem ist Windows 10.

Download und installieren von Oracle VM VirtualBox Manager: https://www.virtualbox.org/wiki/Downloads

Nach der Installation (bzw. dem Update) die automatisch angemahnten Extension Packs per Default herunterladen und installieren. Die Source-Dateien können am Schluss gelöscht werden.

Virtuelle Maschine erzeugen

Name, Typ und Version (Bspw. Linux Debian 64 Bit) festlegen.

RAM Speichergröße: min. 4096 MB

Festplatte erzeugen → VDI → feste Größe, mindestens 20 GB sollten es sein

So könnten die Details aussehen.

Installations-ISO-Datei laden

Ausgangspunkt ist folgende Übersicht: https://www.debian.org/CD/http-ftp/#stable.

Dort gelangt man zu https://cdimage.debian.org/debian-cd/current/amd64/iso-cd/ und schließlich zum aktuellsten CD-ISO-Image der stabilen Version.

DOWNLOAD: debian-11.2.0-amd64-netinst.iso (Anmerkung: wenn Sie das lesen, kann die Version natürlich schon überholt sein.)

Das heruntergeladene ISO-Abbild wie oben abgebildet auswählen und die Maschine starten.

Installation von Debian

Wir wählen die normale Installation, ohne grafische Desktop-Unterstützung.

Um später keine Probleme mit Datumsangaben und/oder Zeitzonen zu haben, kann man beruhigt eine komplett deutsche Umgebung auswählen. Auf produktiven Systemen kann man natürlich andere Einstellungen wählen.

Der Einfachheit halber wähle ich als Rechnername immer den Namen der virtuellen Maschine. Aber auch das kann jeder für dich selbst entscheiden. In meinem Falle wähle ich also „masch3“.

Der Domain-Name im nächsten Schritt kann für unsere Zwecke leer bleiben. Es sei denn, es bestehen dringende Gründe dagegen.

Nun braucht es noch ein schönes Root-Passwort (mit Bestätigung). Das darf – wenn man möchte – ruhig kompliziert sein. Und ein Nutzer, mit dem man arbeiten kann, darf natürlich auch nicht fehlen. Ich empfehle ein einprägsames Passwort, da man am Anfang als sudo-fähiger Benutzer (erkläre ich später) öfter danach gefragt wird.

Wenn es ans Einrichten der in der virtuellen Maschine genutzten Festplatte geht, wählen wir natürlich den Punkt „Geführt – vollständige Festplatte verwenden“. Alles andere macht keinen großen Sinn und würde später, wenn die Festplatte doch zu klein werden sollte, zu viele Probleme (Repartitionierung etc.) mit sich bringen.

Auch bei den nächsten Angaben zur Festplattennutzung bitte die Default-Einstellungen wählen.

Am Schluss klicken wir: „Partitionierung beenden und Änderungen übernehmen“

Und auf die Frage „Änderungen auf die Festplatte schreiben“ wählen wir jetzt natürlich „Ja“ aus, denn sonst würden wir wieder am vorherigen Punkt landen und uns im Kreis drehen.

Auf die Frage, ob man noch CDs oder DVDs einlesen möchte, bitte mit „Nein“ antworten.

Für den Paketmanager wählen wir einen deutschen Spiegelserver. Dazu wieder die Default-Angaben akzeptieren.

Ich nutze keinen Proxy-Server, daher kann (bei mir) das nächste Feld leer bleiben.

Ob man an der sogenannten Paketverwendungserfassung (ich liebe die deutsche Sprache) teilnehmen möchte, bleibt jedem selbst überlassen.

Wenn es an die Softwareauswahl geht, benötigen wir lediglich die Punkte: „Web Server“, „SSH Server“ und „Standard-Systemwerkzeuge“. Es wird für unsere Zwecke nicht notwendig sein, einen Desktop zu installieren, der auf virtuellen Maschinen meist nur träge läuft und unnötig Speicherplatz benötigt. Und einen Drucker-Server benötigen wir erst recht nicht.

Da Debian in unserem Falle das einzige Betriebssystem auf der virtuellen Festplatte sein wird, können wir den Bootlader in den Master Boot Record der Festplatte installieren, somit sparen wir beim Start der Maschinen Zeit.

Vorsicht: bei der nächsten Abfrage bei den zweiten Punkt wählen: „/dev/sda (…)“

Jetzt sind wir fast fertig. Bevor wir im nächsten Schritt aber die Maschine wie erforderlich neu starten, müssen wir das ISO-Abbild wieder aus dem virtuellen CD-Laufwerk auswerfen, da sonst die Installation von vorn beginnen würde.

Sollte das ISO-Abbild noch nicht ausgeworfen sein, so holen wir das jetzt nach.

Klicken und im Menü-Popup „Medium entfernen“ wählen.

Jetzt erst dürfen wir in der virtuellen Maschine auf „Weiter“ klicken. Diese startet sich neu und nach wenigen Augenblicken erscheint das bekannte Linux-Login.

Sudo & Co

Damit wir zukünftig mit dem normalen Nutzer (in meinem Falle „juergen“) vernünftig arbeiten können, muss der Nutzer der „sudo“-Gruppe hinzugefügt werden.

Was ist sudo? Sudo ist ein Befehl, der dazu benutzt wird, Prozesse mit den Rechten eines anderen Benutzers (z. B. des Superusers root) zu starten.

Da sudo standardmäßig nicht installiert wird – was mich eigentlich verwundert – müssen wir es nun erst einmal selbst installieren. Aber, aufgemerkt, das müssen wir als root tun, da wir es als normaler Nutzer selbst (noch) nicht dürfen. Denn um das zu können, benötigen wir ja erst sudo. Ein kleiner Teufelskreis, den wir aber mit der Einwahl als root durchbrechen.

Sind wir also als root eingewählt, geben wir jetzt die folgenden Befehle ein:

apt-get install sudo

Nun fügen wir den während der Installation angelegten Nutzer der Gruppe „sudo“ hinzu: adduser <username> sudo. In meinem Falle also den Nutzer „juergen“

adduser juergen sudo

Mit dem Befehl groups <username> kann man prüfen, ob das Hinzufügen tatsächlich geklappt hat.

groups juergen

Jetzt wäre es an der Zeit, im Oracle VM VirtualBox Manager einen Sicherungspunkt zu erstellen. Sicherungspunkte sind – besonders für Neueinsteiger – eine großartige Methode, um zu einem vorher festgelegten stabilen Zustand der virtuellen Maschine zurückzukehren. Sollte es im weiteren Verlauf zu Problemen kommen, sei es wegen falscher Paket-Abhängigkeiten, versehentlich gelöschten Dateien oder (noch schlimmer) einer zerstörten Partition, kann man (buchstäblich) mit einem Klick wieder zum stabilen Ausgangspunkt zurück.

Wir nutzen den Menüpunkt: Maschine→Werkzeuge→Sicherungspunkte und vergeben für unseren ersten Sicherungspunkt einen Namen und eine kleine Beschreibung.

Am Ende sollte es so aussehen.

Das Herunterfahren der virtuellen Maschine erledigt sich (wie ich finde) am bequemsten und auch sichersten über „die virtuelle Maschine mittels ACPI-Event herunterfahren“. Die Maschine wird also komplett heruntergefahren. Wer aber Zeit sparen möchte, kann selbstverständlich den Punkt „den Zustand der virtuellen Maschine speichern“ wählen. Ich rate aber davon ab, da es sonst durchaus passieren kann, dass die Maschine beim nächsten Mal beim alten Datum bzw. der alten Uhrzeit verbleibt. Beim vollständigen Herunterfahren passiert das nicht, da die Maschine beim vollständigen Neustart das aktuelle Datum (plus Uhrzeit natürlich) vom gastgebenden Windows-Rechner erhält.

Die ist Teil 1 meines kleinen Kurses. In Teil 2 geht es weiter, wenn wir dann wirklich Symfony installieren.

Salesrank über Amazon API abfragen

Bis Anfang 2020 konnte man noch mit aws_signed_request.php Anfragen an Amazon stellen, um gezielt Produktdetails zu erfragen, bspw. den Preis, die Verpackungsgröße oder den Salesrank, also den Platzierung eines Produktes in der eigenen Kategorie.

Aber natürlich musste Amazon, wie so viele Anbieter, auch mal wieder die API-Schnittstellen ändern. Warum auch nicht, wir Entwickler haben ja sowieso zu viel Zeit.

Für die neues API-Version 5.0 ist jetzt alles anders. Für euch (und auch für mich als Gedächtnisstütze) schreibe ich hier eine Schritt-für-Schritt-Anleitung auf, wie man jetzt an die Sache herangeht.

Aufgabe:

  • ermitteln des Salesrank eines (oder mehrerer) Produkte aus dem Amazon-Katalog.

1. Registrierung für die Product Advertising API

Schritt 1: Anmeldung/Registrierung zum Partnerprogramm von Amazon https://partnernet.amazon.de/home

Schritt 2: Anmeldung/Registrierung für den eigentlichen API-Zugang https://partnernet.amazon.de/assoc_credentials/home

Schritt 3: Auf obiger Website zum Punkt Verwalte Deine Zugangsdaten scrollen und dort neue Zugangsdaten generieren lassen. Also auf den Button Zugangsdaten hinzufügen klicken und die eingeblendeten Access und Secret Key kopieren.

So ungefähr sollte es aussehen, wenn das Schlüsselpaar fertig generiert ist.

Mit Hilfe dieses Schlüsselpaares kann man nun über das Scrachtpad direkt fertigen PHP Code erzeugen.

Schritt 4: Auf https://webservices.amazon.de/paapi5/scratchpad/ in der linken Leiste ITEM->GetItems anklicken. Dann öffnet sich rechts ein Formularbereich. Bei den roten Pfeilen im Screenshot das Schlüsselpaar eingeben

Schritt 5: Eine bekannte Amazon-ASIN eingeben und auf Run Request klicken. Das Feld für Add a new parameter kann leer bleiben.

Schritt 6: Weiter unten erhält man dann folgenden PHP-Code, den man gleich kopieren kann bzw. sollte.

Die Sternchen beim roten Pfeil müssen natürlich den den Secret Key ersetzt werden.

Dieser Code sollte einwandfrei laufen und ein Ergebnis im JSON-Format liefern:

Bekannte Probleme

Wenn es zu folgender Fehlermeldung kommt:

„The request was denied due to request throttling. Please verify the number of requests made per second to the Amazon Product Advertising API.“

Dann könnte es sein, dass die Anforderungen von Amazon nicht erfüllt sind. Und die sehen u.a. vor, einen historischen Mindestumsatz über das Partnerprogramm generiert zu haben.

Informationen und Links

https://webservices.amazon.com/paapi5/documentation/register-for-pa-api.html

Ein Child-Theme anlegen, schnell und einfach

Jeder, der in WordPress mehr möchte, als nur fremd-produzierte Themes zu administrieren, kommt früher oder später dazu, ein Child Theme zu bearbeiten bzw. herzustellen.

Was ist ein Child Theme?

Ein Child Theme ist zunächst einmal ein Abkömmling (eben das „Child“) eines anderen Themes. Ist man mit dem bisher genutztes Theme für WordPress nicht zufrieden, ist ein Child Theme der beste Ansatzpunkt, um individuelle Lösungen einzubinden.

Das Child Theme übernimmt alle Eigenschaften des Eltern Themes – solange sie nicht im Child Theme expliziert überschrieben werden (was ja Sinn der ganzen Sache ist).

Das (Child)-Theme darf man dann ohne Gefahr manipulieren, wobei das Eltern Theme niemals angefasst wird. Dies hat mehrere Vorteile:

  1. Falls eine Änderung (vielleicht unwiederbringlich) misslingen, kann man das Child Theme einfach verwerfen und auf das Eltern Theme zurückgehen – oder einfach ein neues Child Theme anlegen.
  2. Sollte das Eltern Theme durch ein Update aufgefrischt werden, so gehen die eigenen Änderungsmaßnahmen im Child Theme nicht verloren, denn dieses Theme bleibt von Updates unberührt.
  3. Wenn man sich zwischen zwei (oder mehr) Änderungen nicht entscheiden kann, so legt man einfach weitere Child Themes an, um schnell zwischen die Änderungen hin- und herzuspringen.

Wichtige Regel daher: NIEMALS im Eltern Theme Änderungen vornehmen. NIEMALS NIEMALS NIEMALS

Was kann man im Child Theme machen?

Das child Theme bietet zwei große Gebiete, auf denen man sich nach Belieben austoben darf.

Design in Child Theme

HTML, CSS und Mediendateien

Im Child Theme darf (sollte) man den HTML Code anpassen. Aber nicht nur. Auch CSS Styles dürfen geändert werden. Ebenso liegt hier die beste Möglichkeit vor, Bilder, z.B Background-Images, oder andere Mediendateien permanent einzubinden. So erspart man sich den Umweg über den Medien-Upload von WordPress.

PHP Funktionalität

Ebenso lassen sich auch Funktionalitäten nachrüsten, die man sonst in einem extra anzulegenden Plugin speichern müsste. PHP-Code-lastige Teile des Themes kann man wunderbar in einer Datei namens functions.php auslagern, die man im Hauptverzeichnis des Child Themes anlegt.

Child Theme angelegen – Schritt für Schritt

1. Verzeichnis anlegen

  • per FTP mit dem Server verbinden
  •  im Verzeichnis wp-content/themes/ ein Verzeichnis anlegen. Dieses Verzeichnis bekannt den Namen des um die Endung -child erweiterten Namens des Eltern Themes. Heißt das Verzeichnis des Eltern Themes twentytwenty, so landet das Child Theme im Verzeichnis twentytwenty-child.
Wordpress Child Theme

2. Style Datei anlegen

Die wichtigsten Informationen über das Child Theme werden (vielleicht ungewohnterweise) in der anzulegenden Datei style.css eingefügt. Der Kopf der Datei sollte folgendermaßen aussehen:

/*
 Theme Name:   Twenty Twenty Child
 Description:  Ein Child Theme
 Author:       Clark Kent
 Author URI:   https://domain.de
 Template:     twentytwenty
 Version:      1.0
 Text Domain:  twenty-twenty-child
*/

Nicht alle diese Angaben sind verpflichtend. Lediglich zwei davon sind absolut notwendig:

Theme Name – Muss eindeutig sein.

Template – Der Verzeichnisname des Eltern Themes (hier also twentytwenty)

3. functions.php anlegen

In der Datei functions.php wird PHP Code eingebunden, der gezielt nur für dieses Child Theme zur Anwendung kommt. Zunächst einmal begnügen wir uns mit den befehlen zum Einbinden des Style Sheets der Eltern. Das Style Sheet des Child Themes wird automatisch korrekt eingebunden

<?php
/**
* Style sheets des Eltern Themes einbinden
*/
function my_child_theme_styles() {
	wp_enqueue_style( 'parent-style', get_template_directory_uri() . '/style.css' );
}
add_action( 'wp_enqueue_scripts', 'my_child_theme_styles' );
?>

Jetzt sollte unser Verzeichnis so aussehen.

Wordpress Child Theme

4. Screenshot anlegen

Ich lege gerne eine Screenshot Datei an, um bei mehreren Themes nicht die Übersicht zu verlieren. Am schnellsten geht es, wenn man die Datei screenshot.png aus dem Verzeichnis des Eltern Themes anpasst.

Wordpress Child Theme

Das Verzeichnis sieht jetzt so aus:

Wordpress Child Theme

Jetzt können wir unsere noch „nacktes“ Child Theme erstmalig in WordPress auswählen.

Wordpress Child Theme

Wenn wir jetzt den Source Code unserer Seite im Browser anzeigen lassen (in der Regel mit dem Tastaturbefehl STRG+U) sollte es genau so aussehen:

Der Source Code unserer Website unter Verwendung eines Child Theme

Wie man sehen kann, werden hier die Style Sheet des Parent Themes und des Child Themes eingebunden.

Das war es für jetzt. Wir werden im Weiteren noch lernen, wie man im Child Theme eigene CSS Styles einbindet bzw. die des Eltern Themes anpasst und/oder überschreibt.