Um Anpassungen an deinem Theme vorzunehmen, die über Hamburgs Optionen hinaus gehen, solltest du in jedem Fall ein Child Theme anlegen. Child Themes sind eine 100%ig sichere, von WordPress selbst bereit gestellte Methode, um eigene Änderungen und Ergänzungen zum aktiven Theme hinzuzufügen – und zwar ohne dass diese Gefahr laufen, bei einer Aktualisierung des Original-Theme überschrieben zu werden!

Child Themes zu verstehen, ist kinderleicht. Und selbst ohne großartige HTML-, CSS- oder PHP-Kenntnisse kannst du ein Child Theme selbst anlegen, oder von einem WordPress-Dienstleister anlegen lassen.

Child Theme für Hamburg anlegen

Hier gibt es ein Starter-Child-Theme und weitere Informationen.

Reihenfolge der Stylesheets

Wichtig: Es wird immer nur ein einziges Theme-Stylesheet geladen.

Um die Ladezeiten gering zu halten, lädt Hamburg standardmäßig die minifizierten Stylesheets (style.min.css, style.plus.woo.min.css usw.). Wenn du dich in einer Testumgebung befindest, kannst du die „normalen“ CSS-Dateien (ohne .min) laden, indem du folgende Zeile zu deiner wp-config.php hinzufügst:

Sobald du das minifizierte Stylesheet laden willst, entferne die Zeile wieder oder setze den Wert auf false. Nutze ein Tool wie CSS Shrink, um dein CSS zu minifizieren.

Je nachdem, ob WooCommerce aktiv ist und mit welchem Browser ein Nutzer deine Website aufruft, werden die folgenden Stylesheets geladen.

  • Internet Explorer 8:
    • WooCommerce aktiv: assets/css/style.plus.woo.ie.min.css
    • WooCommerce nicht aktiv: assets/css/style.ie.min.css
  • Alle anderen Browser:
    • WooCommerce aktiv: style.plus.woo.min.css
    • WooCommerce nicht aktiv: style.min.css

Template-Dateien

Hamburg stellt eine „atomare“ Template-Struktur bereit, die es dir erlaubt, einzelne Bereiche der HTML- und PHP-Ausgabe zu bearbeiten, indem du Dateien aus dem Theme in dein Child-Theme kopierst.

Wichtig: Behalte in deinem Child-Theme stets die Ordner-Struktur von Theme Hamburg bei!

Beispiel: HTML des Beitragstitels ändern

Kopiere die Datei parts/entry-header.php in den parts-Ordner deines Child-Theme. (Wenn es diesen noch nicht gibt, lege ihn jetzt neu an.)

Öffne die Datei zum Bearbeiten und mache beispielhalber aus der h1 eine h2:

Speichere die Datei und rufe einen Beitrag deiner Site auf. Im Quelltext kannst du deine Änderung nachvollziehen.