Designs
Ein Design ist eine Sammlung von Dateien, die die visuelle Darstellung Ihres Stores bestimmt. Bei der ersten Installation von Commerce basieren die Designelemente des Stores auf dem Design Standard. Zusätzlich zum anfänglichen Standarddesign, das mit Ihrer Commerce-Installation geliefert wird, gibt es eine Vielzahl von verfügbaren Designs, die Sie wie sie sind verwenden oder für Ihre Anforderungen ändern können.
Ein responsives Design passt das Seiten-Layout an den Ansichtsanschluss des Geräts an. Das Beispiel Design „Luma verfügt über ein flexibles, responsives Layout, das auf dem Desktop, Tablet oder Mobilgerät angezeigt werden kann.
Zu Commerce Designs gehören Layout-Dateien, Vorlagendateien, Übersetzungsdateien und Designs. Ein Design ist eine Sammlung unterstützender CSS-, Bild- und JavaScript-Dateien, die zusammen die visuelle Präsentation und die Interaktionen erstellen, die Ihren Kundinnen und Kunden beim Besuch Ihres Geschäfts angezeigt werden. Designs und Designs können von einem Entwickler oder Designprofi geändert und angepasst werden, der mit dem Design von Commerce vertraut ist und Zugriff auf Ihren Server hat. Weitere Informationen finden Sie im Frontend-Entwicklerhandbuch.
Das Standarddesign
Das Magento Blank
responsive Design rendert die Anzeige Ihrer Storefront für verschiedene Geräte und beinhaltet Best Practices für Desktop-, Tabellen- und Mobilgeräte. Einige Designs sind nur für die Verwendung mit bestimmten Geräten konzipiert. Wenn Commerce eine bestimmte Browser-ID oder einen Benutzeragenten erkennt, verwendet es das Design, das für den jeweiligen Browser konfiguriert ist. Die Suchzeichenfolge kann auch Perl-kompatible reguläre Ausdrücke (PCRE) enthalten.
Filtern des Design-Rasters
-
Navigieren Sie in Admin-Seitenleiste zu Content > Design>Themes.
-
Klicken Sie auf Filters.
-
Geben Sie einen ID-Bereich, einen Design-Namen (oder Titel), einen Ordnerpfad oder ein übergeordnetes Design ein.
-
Klicken Sie auf Apply Filters , um die Liste der Designs zu aktualisieren.
Aktuelle Design-Einstellungen anzeigen
-
Navigieren Sie in Admin-Seitenleiste zu Content > Design>Themes.
-
Suchen Sie in der Liste der installierten Designs das Design, das Sie untersuchen möchten, und klicken Sie auf die Zeile, um die Einstellungen anzuzeigen.
-
Um eine Beispielseite anzuzeigen, klicken Sie auf die Theme Preview Image.
Anwenden eines Standarddesigns
-
Navigieren Sie in Admin-Seitenleiste zu Content > Design>Configuration.
-
Suchen Sie die Store-Ansicht, die Sie konfigurieren möchten, und klicken Sie in der Spalte Action auf Edit.
-
Legen Sie unter Default Theme Applied Theme auf den Wert fest, den Sie für die aktuelle Ansicht verwenden möchten.
-
Klicken Sie abschließend auf Save Configuration.
Hinzufügen einer Benutzeragenten-Regel
-
Navigieren Sie in Admin-Seitenleiste zu Content > Design>Configuration.
-
Klicken Sie unter Design Rule auf Add New User Agent Rule.
-
Geben Sie Search String die Browser-ID für das jeweilige Gerät ein.
Suchzeichenfolgen werden in der Reihenfolge abgeglichen, in der sie eingegeben werden. Geben Sie beispielsweise für Firefox Folgendes ein:
/^mozilla/i
-
Um weitere Geräte einzugeben, wiederholen Sie den Vorgang.
-
Klicken Sie abschließend auf Save Configuration.