Benutzerdefiniertes Design

Letzte Aktualisierung: 31. Januar 2025

Erstellt für:

  • Admin
  • Entwickler

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:

  1. Kopieren Sie den Code des Designs unter <Project root dir>/app/design/frontend für ein Storefront-Design oder <Project root dir>/app/design/adminhtml für ein Admin-Design. Stellen Sie sicher, dass der Ordner der obersten Ebene <VendorName> ist. Andernfalls wird das Design nicht ordnungsgemäß installiert.

    cp -r ExampleTheme <project-root>/app/design/frontend

  2. 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

  3. Dateien hinzufügen und übertragen.

    git add -A && git commit -m "Add theme"

  4. Übertragen Sie die Dateien in Ihre Verzweigung.

    git push origin <branch name>

  5. Warten Sie, bis die Bereitstellung abgeschlossen ist.

  6. Melden Sie sich beim Administrator an.

  7. 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:

  1. Kaufen Sie das Design von Commerce Marketplace.

  2. Rufen Sie den Namen des Designers ab.

  3. Wechseln Sie in Ihr Adobe Commerce-Stammverzeichnis und geben Sie den Befehl ein:

    composer require <vendor>/<name>:<version>

    Beispiel:

    composer require zero1/theme-fashionista-theme:1.0.0

  4. Warten Sie, bis die Abhängigkeiten aktualisiert werden.

  5. Geben Sie die folgenden Befehle ein:

    git add -A && git commit -m "Add theme"

    git push origin <branch name>

  6. Melden Sie sich beim Administrator an.

  7. 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.

recommendation-more-help