Kann ich mehrere Bilder mit einer Option verknüpfen?

Mit Shopify können Sie Bilder zu Produktoptionen hinzufügen, sodass Kunden sehen können, wie jede Auswahl aussieht. Aufgrund der Regulierung durch Shopify können Sie jedoch nur ein Bild mit einem Optionswert verknüpfen. Die Frage ist also: Wie können mehrere Bilder einer Option zugeordnet werden?

In Be Yours gibt es eine Antwort, in der Sie bestimmte Bilder für eine Option option value angeben können . Diese Funktion eignet sich besonders für die Farboption, Sie können sie jedoch auch für andere gewünschte Zwecke verwenden.

Schritte:

1. Anforderungen

   • Be Yours 4.0.0 oder höher

   • Sie müssen die Option „Medien anderer Varianten nach Auswahl einer Variante ausblenden“ deaktivieren . Diese Option ist mit dem nativen Shopify-Verhalten kompatibel – es wird nur ein Bild einem Optionswert zugeordnet.

     

     In Be Yours ist diese Option in den folgenden Abschnitten verfügbar:

     • Abschnitt „Empfohlene Produkte“.
     • Produktinformationsbereich (auf Produktseiten)
     • Produktinformationsbereich (auf Produktmodal)
2. Wählen Sie eine Option

   Schauen Sie sich Ihr Produkt in Ihrem Admin an und wählen Sie eine Option aus, mit der Sie Ihre Bilder klassifizieren möchten. Im folgenden Beispiel habe ich mich für Farbe entschieden. Mein Produkt ist in den Farben Weiß , Weizen und Schwarz erhältlich und ich möchte die entsprechenden Bilder nur anzeigen, wenn ein Benutzer einen Optionswert auswählt.

   

3. Bearbeiten Sie den ALT-Tag der Bilder

   Sie müssen das Alt-Tag bearbeiten, um den „Optionsnamen und Optionswert“ anzugeben, zu dem das Bild gehört:

   1. Bewegen Sie den Mauszeiger über das Bild und klicken Sie auf die Schaltfläche mit den sechs Punkten, um die Bildinformationen zu öffnen

      

   2. Geben Sie im Feld „Alt-Text“ Ihren Alternativtext ein, indem Sie den von Ihnen gewählten Optionsnamen in Kombination mit dem Optionswert verwenden. Die Syntax ist hier sehr wichtig und muss in der folgenden Reihenfolge vorliegen:

      # (Hashtag-Zeichen)
      option-name (Kleinbuchstaben, alle Leerzeichen durch Bindestriche ersetzen)
      _ (Unterstrichzeichen)
      option-value (Kleinbuchstaben, alle Leerzeichen durch Bindestriche ersetzen)

      
      

      Wenn ich beispielsweise die Option „Farbe“ wähle und ein Bild mit der Farbe Schwarz verknüpfen möchte, sollte der Alternativtext #color_black lauten

      

   
   

   Hinweise:

   Ab der Be Yours-Version 7.2.0 unterstützen wir mehrere Sprachen in unserer Funktion für mehrere Optionsbilder .

   Schauen Sie sich dieses Beispiel unten für Englisch und Französisch an. Der Optionsname ist „Color“ auf Englisch und „Couleur“ auf Französisch, der Optionswert ist „Black“ auf Englisch und „Noire“ auf Französisch.

   Nachdem Sie auf das Bild geklickt haben, dem Sie ALT-Text hinzufügen möchten, legen Sie den ALT-Text fest: #en:color_black,fr:couleur_noire

   

   So geht's:

   • Fügen Sie den Sprachcode ein : Fügen Sie vor jedem Farbnamen den Sprachcode gefolgt von einem Doppelpunkt (:) hinzu.
   • Trennen Sie jedes Sprachpaar durch ein Komma: Trennen Sie jedes Sprachpaar durch ein Komma (,). Dadurch wird das Ende eines Sprachpaars und der Beginn des nächsten angezeigt.
4. Klicken Sie auf Speichern, um die Änderungen zu speichern
5. Führen Sie den gleichen Vorgang für andere Bilder durch
6. Legen Sie meinen eigenen Alternativtext fest (oder behalten Sie ihn bei).

   Was ist, wenn ich meinen eigenen Alt für SEO-Zwecke festlegen (oder behalten) möchte? Fügen Sie einfach vor dem # -Zeichen etwas in das Alt-Feld ein, etwa so:

   

   ---

   Wir wissen, dass den meisten Kunden SEO am Herzen liegt, und Sie können Ihre SEO-Effizienz verbessern, indem Sie allen Bildern Alt-Tags gemäß den obigen Anweisungen hinzufügen.

   SEO: Image Optimizer Page Speed ​​von AVADA ist eine sehr empfehlenswerte App für Bild-SEO, die Ihnen hilft, Ihre Konkurrenten in den Suchergebnissen zu übertreffen. Diese App nutzt Ihre SEO auf einfache Weise durch Automatisierung durch:

   • Optimieren von Bild-ALT/Meta-Tags/JSON-LD, um für die Google-Suche geeignet zu sein.
   • Optimieren Sie die Bildgröße ohne Qualitätsverlust, um Ihre Website zu beschleunigen.

   >> Erfahren Sie noch heute mehr über SEO: Image Optimizer Page Speed !

* Die Bilder werden nur zu nichtkommerziellen Produktdemonstrationszwecken verwendet und sind ausschließlich für die Verwendung in der Anleitungsdokumentation zum Be Yours-Thema vorgesehen.

Benötigen Sie weitere Unterstützung

Wenn Sie auf Probleme stoßen oder zusätzliche Hilfe mit Ihrem BeYours-Theme benötigen, wenden Sie sich bitte innerhalb von 8 Stunden über unser Ticketsystem an unseren Support.

Scannen Sie den QR-Code unten, um unserer WhatsApp-Community für Updates, Neuigkeiten und Ankündigungen beizutreten.