Benutzerdefiniertes Design
Sie können ein oder mehrere Designs installieren, die für einen oder alle Ihre Stores und Sites in Ihrem Projekt verwendet werden sollen. Designs umfassen mehrere statische Dateien, einschließlich Bilder, Schriftarten, CSS, JavaScript, PHP und mehr, um Ihre Stores vollständig zu gestalten. Sie können das Design hinzufügen, indem Sie entweder den Code in das Dateisystem extrahieren oder den Composer verwenden.
Manuelles Installieren eines Designs
Um ein Design manuell zu installieren, müssen Sie den Code des Designs in einem komprimierten Archiv oder in einer Verzeichnisstruktur ähnlich der folgenden haben:
<VendorName>
├── composer.json
├── etc
│ └── view.xml
├── media
├── registration.php
├── theme.xml
└── web
├── css
│ └── source
├── fonts
├── images
└── js
So installieren Sie ein Design manuell:
-
Kopieren Sie den Code des Designs unter
<Project root dir>/app/design/frontendfür ein Storefront-Design oder<Project root dir>/app/design/adminhtmlfür ein Admin-Design. Stellen Sie sicher, dass der Ordner der obersten Ebene<VendorName>ist. Andernfalls wird das Design nicht ordnungsgemäß installiert.code language-bash cp -r ExampleTheme <project-root>/app/design/frontend -
Bestätigen Sie, dass das Design an die richtige Stelle kopiert wurde.
- Storefront-Design:
ls <project-root>/app/design/frontend - Admin-Design:
ls <project-root>/app/design/adminhtml
Es folgt ein Beispiel:
ExampleTheme Adobe Commerce
- Storefront-Design:
-
Dateien hinzufügen und übertragen.
code language-bash git add -A && git commit -m "Add theme" -
Übertragen Sie die Dateien in Ihre Verzweigung.
code language-bash git push origin <branch name> -
Warten Sie, bis die Bereitstellung abgeschlossen ist.
-
Melden Sie sich beim Administrator an.
-
Klicken Sie Inhalt > Design > Designs.
Das Design wird im rechten Bereich angezeigt.
Installieren eines Designs mithilfe von Composer
Das Installieren eines Designs mit Composer entspricht dem Installieren einer anderen Erweiterung mit Composer. Siehe Installieren, Verwalten und Aktualisieren von Modulen für weitere Informationen.
So installieren Sie ein Design mit dem Composer:
-
Kaufen Sie das Design von Commerce Marketplace.
-
Rufen Sie den Namen des Designers ab.
-
Wechseln Sie in Ihr Adobe Commerce-Stammverzeichnis und geben Sie den Befehl ein:
code language-bash composer require <vendor>/<name>:<version>Beispiel:
code language-bash composer require zero1/theme-fashionista-theme:1.0.0 -
Warten Sie, bis die Abhängigkeiten aktualisiert werden.
-
Geben Sie die folgenden Befehle ein:
code language-bash git add -A && git commit -m "Add theme"code language-bash git push origin <branch name> -
Melden Sie sich beim Administrator an.
-
Klicken Sie Inhalt > Design > Designs.
Das Design wird im rechten Bereich angezeigt.
Mehrere Designs
Wenn Sie mehrere Designs verwenden, z. B. verschiedene Designs pro Gebietsschema, überprüfen Sie die SCD_MATRIX Umgebungsvariable , um die Designbereitstellung anzupassen. Siehe die Erstellen oder Bereitstellen in der Umgebungskonfiguration.