Wie richte ich Farbfelder ein?

Wenn Sie Farbfelder aktivieren , bietet Ihnen das Be Concept- Design zwei Optionen zum Anzeigen von Farbfeldern: Benutzerdefiniertes Bild und Variantenbild .

Bitte sehen Sie sich die folgende Tabelle an, um diesen Artikel leichter zu verstehen.

Anzeige von Farbmustern
Farbfelder deaktivieren Benutzerdefinierte Bilder Variantenbilder

Auf dieser Seite

  1. Wo ist diese Funktion?
  2. Wie funktioniert es?
  3. Benennen Sie Ihre Farbfelddateien
  4. Wo ist die Option „Dateien“ im Shopify-Adminbereich?

1. Wo ist diese Funktion?

Um die Option „Farbschemata“ für Ihre Seite anzupassen, richten Sie Folgendes ein:

  • Wählen Sie auf Ihrer Produktseite über den Theme-Editor den Variantenauswahlblock im Abschnitt Produktinformationen aus.

  • Unter Farbfeld > Farbfeldtyp gibt es zwei Optionen: Variantenbilder und Benutzerdefinierte Bilder .

2. Wie funktioniert es?

Aktivieren Sie zunächst die Farbmustereinstellungen und wählen Sie dann zur Anzeige zwischen Farbmuster oder Variantenbild .

2.1 Farbmuster

Konfigurieren Sie Ihr Farbfeld, indem Sie das Feld „Konfiguration“ einrichten. Informationen zur Funktionsweise dieser Funktion finden Sie in den folgenden Regeln:

  1. Sobald Sie diese Funktion aktiviert haben, sucht Be Concept in Ihren Designeinstellungen > Farbmuster > Konfigurationsfeld nach Farbwerten, die mit den Namen Ihrer Produktfarbvarianten übereinstimmen.

  2. Wenn der Farbwert gefunden wird, wird das Farbfeld mit diesem Wert angezeigt.

      • Beispiel 1 – Verwendung von HEX-Code : Das Konfigurationsfeld enthält den folgenden Wert: Black:#3a3a3a

        Dann wird das Farbfeld für Schwarz mit der Farbe #3a3a3a anstelle der Standardschwarzfarbe #000000 angezeigt.

      • Beispiel 2 – Verwendung einer hochgeladenen Datei : Das Konfigurationsfeld enthält den folgenden Wert: Crimson Shadow:crimson-shadow.webp

        Anschließend wird das Farbfeld für Crimson Shadow mithilfe des Bildes mit dem Namen crimson-shadow.webp angezeigt, das im Shopify-Admin-Dashboard/Content/File hochgeladen wird.

  3. Wenn der Farbwert nicht im Feld „Konfiguration“ gefunden wird, suchen Sie nach einer *.png Datei mit demselben Namen wie die Farbvariante.

    Beispiel : In diesem Fall verwendet diese Funktion eine *.png Datei mit dem Namen crimson-shadow.png für das Farbfeld.

  4. Wenn die *.png Datei nicht gefunden wird, zeigen Sie das Farbfeld an, indem Sie den CSS-Farbnamen für die Farbvariante verwenden.

    Beispiel : Wenn der Wert für die Farbvariante „Schwarz“ nicht gefunden wird, zeigt das Farbfeld die Standardfarbe Schwarz an, #000000 .

  5. Wenn die Farbe keinen Wert im Konfigurationsfeld, in einer PNG-Datei oder in einem HEX-Code hat, ist das Farbfeld leer.

    Beispiel : Die Farbe „Kastanienbraun“ hat keinen Wert, keine PNG-Datei oder keinen HEX-Code , sodass das Farbfeld leer ist.

2.2 Variantenbild

Sobald Sie die Farbmustereinstellungen aktiviert haben, sucht Concept nach jeder Variantenkategorie mit dem Namen „Farbe“ oder „Farbe“.

Um das Wort in etwas anderes als „Farbe/Farbe“ zu ändern (z. B.: Couleur auf Französisch), können Sie dies im Themenmenü Ihres Sprachbereichs > Standardthemeninhalt bearbeiten tun.

Geben Sie color_swatch_trigger in die Suchleiste ein, um die Einstellungen für den [Farbfeld-Trigger] zu finden.

Das Theme prüft dann die von Ihnen verwendeten Variantennamen, in diesem Fall:

  • Goldfarbener,
  • schwarzer,
  • kastanienbrauner
  • ,
  • purpurroter Schatten
  • und suchen Sie entweder nach einem HTML color name mit genau demselben Namen ODER nach einem chosen image unter Produkte > Varianten > Variantenbild aktualisieren .

    Goldton
    Schwarz
    Kastanie
    Marine
    Purpurner Schatten

    3. Benennen Sie Ihre Swatch-Dateien

    • Beispielsweise müssten die Farbfelder Black , Chestnut oder Navy den Namen black.png , chestnut.png oder navy.png erhalten (Großbuchstaben werden zu Kleinbuchstaben).
    • Die Farbfelder Gold Tone und Crimson Shadow müssen die Namen golde-tone.png und crimson-shadow.png haben (Großbuchstaben werden zu Kleinbuchstaben, Leerzeichen und andere Sonderzeichen werden zu Bindestrichen).

    4. Wo ist die Option „Dateien“ im Shopify-Adminbereich?

      • Öffnen Sie zunächst den Shopify-Adminbereich .
      • Gehen Sie zu Content , wählen Sie dann die Option Files und öffnen Sie sie. Klicken Daten hochladen um mit dem Hochladen Ihrer .png Farbfelddateien zu beginnen.