Shopware 6 – Cheatsheet

von Der Atilla | Juli 28, 2021 | Alle, Shopware, Shopware 6, Shopware Entwicklung | 0 Kommentare

Da ist er – unser streng geheimer Shopware 6 Cheatsheet. Hier sammeln wir alle möglichen Code-Schnipsel, die man höchstwahrscheinlich mehr als einmal in seinem Leben verwenden wird. Hier findet man etwas für jeden Geschmack, wenn man sich für Shopware 6, Shopware Plugin Entwicklung und / oder Shopware 6 Theme Entwicklung interessiert.

Diesen Beitrag werden wir ständig erweitern, sodass wir gefundenes Geheimwissen nicht jedes Mal erneut suchen müssen. Die Liste ist noch relativ leer? Schreib uns ein paar deiner Tipps in die Kommentare, um gemeinsam den besten Shopware 6 Cheatsheet der Welt zu erstellen.

Übersicht – Shopware 6 Cheatsheet

1. In Plugins nach internen Einstellungen abfragen
2. SCSS Viewport Größen
3. Lighthouse Audit Optimierungen – Accessibility
4. Terminal Cheat-Sheet
5. Shopware 6 Icons
6. Template Dateien
7. Twig Schnipsel
8. Gemischtes
9. Datenbank Befehle
10. Shopware 6 Plugins sauber deinstallieren
11. Seiten in Pop-Ups
12. Konsolen-Cheatsheet
13. SCSS Snippets
14. Einstellungen für Entwickler
15. Mehrsprachige Inhalte in Twig
16. Entwicklermodus
17. PHP Versionen
18. Weiterführende Links

1. In Plugins nach internen Einstellungen abfragen

So wird beim Super Mega Slider abgefragt, ob bei der Slide Navigation ausgewählt wurde, dass die Navigationspfeile außerhalb der Slides angezeigt werden sollen:

{% if sliderConfig.navigationArrows.value == "outside" %} is-nav-next-outside{% endif %}

Und so könnte eine Doppel-Abfrage aussehen, in der wir gleich 2 Dinge prüfen:

{% if ( sliderConfig.navigationArrows.value == "outside" ) or ( sliderConfig.navigationArrows.value == "inside" ) %} is-double-cool {% endif %}

2. SCSS Viewport Größen

// AB 576px = SM / SMALL @include media-breakpoint-up(sm) {} // AB 768 = MD / MEDIUM @include media-breakpoint-up(md) {} // AB 992 = LG / LARGE @include media-breakpoint-up(lg) {} // AB 1200 = XL / XTRA LARGE @include media-breakpoint-up(xl) {}

3. Lighthouse Audit Optimierungen – Accessibility

Ein wichtiger Teil der Plugin-Erstellung, insbesondere wenn es darum geht sein Plugin in den Community-Store zu bekommen, sind die Werte bei der Prüfung mit dem Lighthouse Audit-Tool.

3.1 Aria Label

Für Slider Pfeile:
aria-label="Previous slide" aria-label="Next slide" aria-label="Go to slide {{ loop.index }}" aria-label="Pause autoplay"

4. Terminal Cheat-Sheet

SHOPWARE BEFEHLE

Cache leeren:
bin/console cache:clear

Theme kompilieren (voll):
php bin/build-storefront.sh bin/console theme:compile bin/console assets:install bin/console cache:clear

Plugin update — nur Admin-Build (ein Plugin):
Baut nur die Admin-Extension eines einzelnen Plugins neu. SHOPWARE_ADMIN_BUILD_ONLY_EXTENSIONS=1 sorgt dafür, dass nicht der gesamte Admin neu gebaut wird — deutlich schneller.
bin/console plugin:update GreatExperienceWorldSet SHOPWARE_ADMIN_BUILD_ONLY_EXTENSIONS=1 bin/build-administration.sh bin/console assets:install bin/console cache:clear

Admin komplett neu bauen (alle Plugins):
Baut den gesamten Admin neu — alle installierten Plugins inklusive. Nötig nach größeren Updates oder wenn mehrere Plugins Admin-Änderungen haben.
bin/build-administration.sh bin/console assets:install bin/console cache:clear

Plugin update — Admin + Storefront:
Wenn sowohl Admin als auch Storefront-Dateien eines Plugins geändert wurden.
bin/console plugin:update GreatExperienceWorldSet SHOPWARE_ADMIN_BUILD_ONLY_EXTENSIONS=1 bin/build-administration.sh bin/build-storefront.sh bin/console cache:clear

Plugin installieren & aktivieren:
bin/console plugin:install PluginName bin/console plugin:activate PluginName bin/console plugin:refresh

Plugin deaktivieren & deinstallieren:
bin/console plugin:deactivate PluginName bin/console plugin:uninstall PluginName

SEO URLs neu generieren:
bin/console dal:refresh:index

Migrations ausführen:
bin/console database:migrate --all

Shopware aktualisieren:
composer update bin/console system:update:finish bin/console cache:clear

Theme Dev-Modus (hot-proxy):
./psh.phar storefront:hot-proxy

Theme erstellen:
bin/console theme:create bin/console theme:change

VERZEICHNIS-BEFEHLE

$ pwd # aktuelles Verzeichnis anzeigen $ cd # ins Root wechseln $ cd .. # eine Ebene hoch $ cd stefan # in Ordner "stefan" wechseln $ ls # Ordner und Dateien anzeigen $ ls -a # inkl. versteckte Dateien

SERVER / BACKUPS / ENTPACKEN

$ ssh wp1071115@wp1071115.server-he.de # SSH Verbindung aufbauen $ tar cfzv backup.tar.gz test/ # Ordner packen $ cp -r test/ shop/testumgebung # Dateien kopieren $ mv shop/testumgebung /testumgebung # Dateien verschieben $ rm -r muell # Ordner löschen $ exit # Verbindung beenden $ unzip Test.zip # ZIP entpacken $ tar xfv Test.tar # TAR entpacken

5. Shopware 6 Icons

X Icon einbinden:
{% sw_icon 'x' %}

Icon stylen:
.mein-icon .icon > svg { width: 20px; height: 20px; color: var(--sw-color-brand-primary); }

Icon-Liste: Default Icons auf GitHub

6. Template Dateien

Verzeichnis für Storefront-Templates:
vendor/shopware/platform/src/Storefront/Resources/views/storefront/

Mit Dockware:
src/vendor/shopware/storefront/Resources/views/storefront/base.html.twig

7. Twig Schnipsel

Template vererben (Child-Theme):
{% sw_extends '@Storefront/storefront/base.html.twig' %}

Parent-Block einbinden:
{{ parent() }}

Kommentar:
{# Das ist ein Twig-Kommentar #}

Nur auf der Startseite anzeigen:
{% if activeRoute is same as("frontend.home.page") %} INHALT {% endif %}

Nur auf der Produkt-Detailseite anzeigen:
{% if activeRoute is same as("frontend.detail.page") %} INHALT {% endif %}

Nur in bestimmtem Sales Channel:
{% if salesChannel.id == "1438751ce3f0b496bbea293e096aec1fb" %} Test 123 {% else %} {{ parent() }} {% endif %}

Custom Fields ausgeben (debug):
{{ dump(page.header.navigation.active.customFields) }}

Textbaustein einbinden:
{{ 'mein.snippet.key'|trans }}

SW-Icon einbinden:
{% sw_icon 'x' %} {% sw_icon 'check' style={'size': 'sm'} %}

8. Gemischtes

– Dateien korrekt nachbauen
– Variablen für Hintergrundfarben verwenden
– Media Queries und Shopware Mixins verwenden
– Mobile First Approach
– Never use !important
– Avoid fixed values for width & height
– Für importierte Schriftarten: font-display: swap
– JS-Code nur in main.js, nie in Twig-Dateien
– {{ parent() }} verwenden
– SVGs statt Bilder als Icons verwenden (bessere Performance)

9. Datenbank Befehle

9.1 Verwaiste Medien finden:
SELECT * FROM `media` WHERE `mime_type` IS NULL AND `file_size` IS NULL;

9.2 Verwaiste Medien löschen:
DELETE FROM `media` WHERE `mime_type` IS NULL AND `file_size` IS NULL;

9.3 Custom Field per JSON entfernen:
UPDATE product_translation SET custom_fields = JSON_REMOVE(custom_fields, '$.mein_custom_field_key') WHERE JSON_CONTAINS_PATH(custom_fields, 'one', '$.mein_custom_field_key');

9.4 Produkte mit Custom Field-Wert finden:
SELECT product_id, custom_fields FROM product_translation WHERE JSON_UNQUOTE(JSON_EXTRACT(custom_fields, '$.mein_field')) = '1';

9.5 Alle Produkte löschen:
DELETE FROM product;

Der Befehl löscht alle Produkte im Shop. Gleichzeitig werden alle verknüpften Einträge in allen anderen relevanten Tabellen gelöscht.

9.6 Alle Produkte bis auf einige bestimmte löschen:
DELETE FROM product WHERE product_number NOT IN ( 'KPMS033', 'H2SA025', 'PVHY1302' );

9.7 Nicht mehr verwendete Produkt-Bilder finden:
SELECT * FROM media WHERE media_folder_id = UNHEX('0194F5EE5E1573728B359C77C5846564') AND id NOT IN (SELECT media_id FROM product_media);

9.8 SW5-Migration: Prüfsumme zurücksetzen:
UPDATE swag_migration_mapping SET checksum = null WHERE entity LIKE '%product%';

10. Plugins sauber deinstallieren

Shopware Academy: Uninstalling a Plugin

11. Seiten in Pop-Ups

So kann man über einen Link die Inhalte von bestimmten Seiten in einem Modal einbinden:

<a href="/meine-seite" data-toggle="modal" data-url="/meine-seite" data-modal-class="modal-lg"> Öffne als Popup </a>

12. Konsolen-Cheatsheet

bin/console theme:create bin/console theme:change bin/console cache:clear bin/console plugin:install PluginName bin/console plugin:activate PluginName bin/console plugin:uninstall PluginName bin/console plugin:deactivate PluginName bin/console dal:refresh:index

13. SCSS Snippets

4-spaltiger Footer:
@include media-breakpoint-up(md) { .footer-main .footer-column { flex: 0 0 25%; max-width: 25%; } }

Font-Display swap (wichtig für Lighthouse):
@font-face { font-family: 'MeineSchrift'; src: url('...'); font-display: swap; }

14. Einstellungen für Entwickler

In der .env Datei im Root-Verzeichnis:
APP_ENV=dev

Danach Cache leeren:
bin/console cache:clear

Logfiles:
var/log/dev.log # Dev-Modus var/log/prod.log # Produktiv

15. Mehrsprachige Inhalte in Twig

{% if page.header.activeLanguage.translationCode.code == 'de-DE' %} Registriere dich mit deinen Daten {% endif %} {% if page.header.activeLanguage.translationCode.code == 'en-GB' %} Register with your personal data {% endif %} {% if page.header.activeLanguage.translationCode.code == 'fr-FR' %} Enregistrement de vos informations personnelles {% endif %} {% if page.header.activeLanguage.translationCode.code == 'nl-NL' %} Registreer met je persoonlijke gegevens {% endif %}

16. Entwicklermodus

In der .env oder .env.local Datei im Root-Verzeichnis:

APP_ENV=prod ändern in: APP_ENV=dev

P.S.: Wenn die Datei nicht sichtbar ist, muss in FTP-Programm die Anzeige versteckter Dateien aktiviert werden.

17. Unterstützte PHP Versionen in Shopware 6

Shopware-Version	Unterstützte PHP-Versionen
6.4.x	PHP 7.4 (empfohlen), PHP 8.0 (ab 6.4.3)
6.5.x	PHP 8.0, PHP 8.1 (empfohlen ab 6.5.0), PHP 8.2 (ab 6.5.2)
6.6.x	PHP 8.1, PHP 8.2 (ab 6.6.0), PHP 8.3 (ab 6.6.1)
6.7.x	PHP 8.2, PHP 8.3, PHP 8.4