Child-Theme installieren

Das Child-Theme Plugin wird als eigenständiges Plugin gesehen und dient lediglich als Vorlage für den erfahrenen Programmierer. Es wird zusätzlich zum Parent-Theme installiert. Sie können das .zip File hier herunterladen.

Eigenes Javascript & CSS

Im Child-Theme sind beide Dateien bereits enthalten. Bitte fügen Sie die jeweiligen Anpassungen ausschließlich den folgenden beiden Dateien hinzu:

  • Javascript: /src/Resources/app/storefront/dist/storefront/js/rhweb-childtheme.js
  • SCSS (CSS): /src/Resources/app/storefront/src/scss/base.scss

Blöcke im Template überschreiben/erweitern

Damit Sie individuelle Anpassungen am Template durchführen können, ohne, dass bei einem Theme-Update die geänderten Einstellungen überschrieben werden, können Sie bestehende Blöcke erweitern oder sogar gänzlich überschreiben. In diesem Beispiel überschreiben wir den Block base_header aus der Datei src/Resources/views/storefront/base.html.twig

Legen Sie also eine base.html.twig in der gleichen Ordnerstruktur, wie die des Parent-Themes an und fügen Sie folgenden Code hinzu:


{% sw_extends '@MyTheme/storefront/base.html.twig' %}

{% block base_header %}
	<div class="mein-container">
		<p>Mein Content</p>
	</div>
	{{ parent() }} // Erbt den Inhalt des Blocks vom Parent-Theme
{% endblock %}

Sie erben in diesem Fall nur von @MyTheme, da die Datei bereits im Parent-Theme verfügbar ist. Andernfalls nutzen Sie bitte {% sw_extends '@Storefront/storefront/base.html.twig' %} um vom Core zu erben.