FROM CACHE - de_header

Produktvariante im Hover korrekt anzeigen?

Gelöst

Produktvariante im Hover korrekt anzeigen?

Alkana
Entdecker
17 2 3

Hallo zusammen,

 

ich habe einen Artikel in meinem Onlineshop und möchte nun gerne mehrere Varianten dieses Produkts hinzufügen. Da ich das Prestige Theme nutze habe ich außerdem die Option "Show second image on hover" aktiviert. Hier kommt das Problem ins Spiel: Der Color Swatch funktioniert zwar, allerdings wird mir beim "hovern" immer nur das zweite Bild der 1. Produktvariante angezeigt. 

 

Beispiel: 

Variante 1: Tshirt in weiß

Variante 2: Tshirt in grau

 

Color Swatch funktioniert und wechselt auch das Hauptbild entsprechend (siehe Bilder).

 

1.png

 

2.png

 

 

Beim "Hoverbild" wird mir allerdings IMMER nur das zweite Bild des Tshirts in weiß angezeigt und nicht in grau.

 

3.png

 

4.png

 

 

Ich hoffe das Problem ist einigermaßen verständlich erklärt und das mir jemand helfen kann.

 

PS: Ich nutze das Prestige Theme und die ShopURL lautet www.dropsize.store.

 

Vielen Dank vorab.

 

LG

1 AKZEPTIERTE LÖSUNG
Gabe
Shopify Staff
18409 2886 4250

Erfolg.

Hey @Alkana 

 

Sorry für die verspätete Rückmeldung. Merkwürdig: Über deinen Link sehe ich immer noch nur einen color swatch:

 

image.png

 

Frage: hast du die Theme Entwickler über diese Form erreichen können denn mir scheint das immer mehr ein Bug des Theme zu sein?

 

---
Lass auch wissen, wenn du weitere Fragen hast zum Shop und Business und gerne können wir das hier weiter besprechen! Halte bitte Ausschau in deiner E-Mail auf Notifications zu Antworten auf deine Fragen in der Community.

 

giphy (1).gif

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog

Lösung in ursprünglichem Beitrag anzeigen

3 ANTWORTEN 3

Gabe
Shopify Staff
18409 2886 4250

Hey @Alkana 

 

Danke für die Bilder und das ist schwer zu sagen denn es sieht m. E. nach dem erwarteten Systemverhalten aus des Prestige Themes wo wichtig ist wie du die Produkte und Varianten im Backend eingepflegt wird.

 

Ich habe aber jetzt nach den Beispielen in deinen Bildern gesucht und konnte sie nicht finden um sie selber zu testen:

 

image.png

Haben dir die Prestige Anleitungen helfen können den Colour Swatch richtig einzurichten? Siehe diese hier:

Da steht beispielsweise folgendes:

 

1

 

You will need first to create variants whose option is "Color". To do that, simply open the product in your Shopify admin, and create a new option called "Color":

 

 

image.png

 

 

In the "option values", indicate all the product's colors. For the sake of this example, let's say that we have one variant color called "Black Metal" (rock on baby!). Make sure to write the name of your color variants, we will need them later.

 

2

The second step is to create your images in your favourite image editor (like Photoshop, Gimp, Pixelmator...). Because color swatch are small, you should create small images. An image of 64x64 pixels is usually enough to ensure a good quality. The image MUST be in PNG format.

Save your image. But  PAY ATTENTION TO THE NAME of the image, this is very important. It must be the handleized version of the color's name you have used in your product.

To convert a name to a handle, you must:

  1. Replace any space by a dash.
  2. Transform everything to lowercase.

For instance, the handle for our option "Black Metal" would be "black-metal" (spaces to dash, and everything to lowercase). Special characters must be removed. For instance, if your color is "Black / Metal", the handle for our option is still "black-metal" (and not black-/-metal)!

Because those images must be in PNG format, the final image must be named, in this example, "black-metal.png" (make sure that .png extension is in lowercase as well). Simple isn't it?

 

3

Now, we must "link" the image we have created to the color by uploading the images you have created to the theme.

 

 

---
Lass auch wissen, wenn du weitere Fragen hast zum Shop und Business und gerne können wir das hier weiter besprechen! Halte bitte Ausschau in deiner E-Mail auf Notifications zu Antworten auf deine Fragen in der Community.

 

giphy (1).gif

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog

Alkana
Entdecker
17 2 3

Hallo @Gabe,

 

vorab vielen Dank für die Rückmeldung. Ich habe das nur zeitweise an einem Beispiel getestet und hier hochgeladen, damit das Problem verdeutlicht wird. Ich habe das jetzt wieder so eingestellt, wie ich es für richtig halte und zwar für ein Produkt auf dieser Seite:

https://dropsize.store/collections/t-shirt

 

Screenshot.png

 

Könntest du das eventuell erneut prüfen? Und am besten gleich über den o.g. Link zur Seite gelangen. Wenn man nämlich nach dem Produktnamen über die Schnellsuche geht, dann wird einem erst gar nicht die Color Swatch Sicht angezeigt.

 

Wie gesagt: Bei Klick auf den grauen Color Swatch wird mir das graue Tshirt zwar angezeigt. Beim Hovern wird mir aber nur das zweite Produktbild vom weißen Tshirt angezeigt. 

 

Meine Einstellungen teile ich ebenfalls gleich mit:

Screenshot 2022-12-12 204224.png

 

Screenshot 2022-12-12 204138.png

 

Screenshot 2022-12-12 204123.png

 

LG

Gabe
Shopify Staff
18409 2886 4250

Erfolg.

Hey @Alkana 

 

Sorry für die verspätete Rückmeldung. Merkwürdig: Über deinen Link sehe ich immer noch nur einen color swatch:

 

image.png

 

Frage: hast du die Theme Entwickler über diese Form erreichen können denn mir scheint das immer mehr ein Bug des Theme zu sein?

 

---
Lass auch wissen, wenn du weitere Fragen hast zum Shop und Business und gerne können wir das hier weiter besprechen! Halte bitte Ausschau in deiner E-Mail auf Notifications zu Antworten auf deine Fragen in der Community.

 

giphy (1).gif

Gabe | Social Care @ Shopify
 - War meine Antwort hilfreich? Klicke Like um es mich wissen zu lassen! 
 - Wurde deine Frage beantwortet? Markiere es als Akzeptierte Lösung 
 - Um mehr zu erfahren, besuche das Shopify Help Center oder den Shopify Blog