Designs

Ein Design ist eine Sammlung von Dateien, die die visuelle Präsentation Ihres Stores bestimmen. Bei der ersten Installation Commerce, basieren die Designelemente des Stores auf der Standard Design. Zusätzlich zum ursprünglichen Standarddesign, das mit Ihrem Commerce -Installation, gibt es eine Vielzahl von verfügbaren Designs, die Sie verwenden können as is oder ändern Sie Ihre Anforderungen.

Ein responsives Design passt das Seitenlayout an den Ansichtsport des Geräts an. Beispiel Luma Das Design hat ein flexibles, responsives Layout, das vom Desktop, Tablet oder Mobilgerät aus angezeigt werden kann.

Commerce Designs umfassen Layout-Dateien, Vorlagendateien, Übersetzungsdateien und Skins. Eine Skin ist eine Sammlung unterstützender CSS-, Bilder- und JavaScript-Dateien, die zusammen die visuelle Präsentation und Interaktionen erstellen, die Ihre Kunden beim Besuch Ihres Stores erleben. Designs und Skins können von einem Entwickler oder Designer angepasst werden, der das Design von Commerce-Designs versteht und Zugriff auf Ihren Server hat. Weitere Informationen finden Sie unter Frontend-Entwicklerhandbuch.

Luma-Design

Standarddesign

Die Magento Blank responsives Design rendert die Anzeige Ihrer Storefront für verschiedene Geräte und enthält Best Practices für Desktop, Tabelle und Mobilgeräte. Einige Designs sind nur für die Verwendung mit bestimmten Geräten vorgesehen. Wann Commerce eine bestimmte Browser-ID oder einen Benutzeragenten erkennt, wird das für den jeweiligen Browser konfigurierte Design verwendet. Die Suchzeichenfolge kann auch mit Perl-kompatible reguläre Ausdrücke (PCRE) enthalten.

Designs

Filtern des Themenrasters

  1. Im Admin Seitenleiste, navigieren Sie zu Content > Design>Themes.

  2. Klicken Filters.

  3. Geben Sie einen ID-Bereich, einen Designnamen (oder Titel), einen Ordnerpfad oder ein übergeordnetes Design ein.

  4. Klicks Apply Filters , um die Liste der Themen zu aktualisieren.

Aktuelle Designeinstellungen anzeigen

  1. Im Admin Seitenleiste, navigieren Sie zu Content > Design>Themes.

  2. Suchen Sie in der Liste der installierten Designs das Thema, das Sie untersuchen möchten, und klicken Sie auf die Zeile, um die Einstellungen anzuzeigen.

  3. Um eine Beispielseite anzuzeigen, klicken Sie auf die Theme Preview Image.

Vorschau-Design

Anwenden eines Standarddesigns

  1. Im Admin Seitenleiste, navigieren Sie zu Content > Design>Configuration.

  2. Suchen Sie die Store-Ansicht, die Sie konfigurieren möchten, und klicken Sie auf Edit im Action ​Spalte.

  3. under Default Theme, set Applied Theme ​zu dem Ordner hinzu, den Sie für die aktuelle Ansicht verwenden möchten.

    Angewandtes Design {width="600" modal="regular"}

  4. Wenn Sie fertig sind, klicken Sie auf Save Configuration.

Hinzufügen einer Benutzeragenten-Regel

  1. Im Admin Seitenleiste, navigieren Sie zu Content > Design>Configuration.

  2. under Design Rule ​klicken Add New User Agent Rule.

    Design-Regel {width="600" modal="regular"}

  3. Für Search String eingeben, geben Sie die Browser-ID für das jeweilige Gerät ein.

    Suchzeichenfolgen werden in der Reihenfolge ihrer Eingabe zugeordnet. Geben Sie beispielsweise für Firefox Folgendes ein:

    /^mozilla/i

  4. Wiederholen Sie den Vorgang, um weitere Geräte aufzurufen.

  5. Wenn Sie fertig sind, klicken Sie auf Save Configuration.

recommendation-more-help
2b0136b4-ef75-405f-9734-60d741f198de