Swatches when using Siblings- Palo Alto theme

Swatches when using Siblings- Palo Alto theme

NovaMae
Shopify Partner
5 0 2

I have set up siblings within my Palo Alto theme and all of my product color shades are set up as separate products. I love how it is going to look on the Product page but can't figure out how to target the little image/swatch that shows up for each product that I have linked. 

I would like it to show a custom swatch  for the product shade, is this possible (see screenshot)? Or does it automatically have to pull the first image from the Product listing itself? THanks!

 

Screenshot below:

Screenshot 2024-07-26 at 11.49.19 AM.png

 

Replies 5 (5)

tim
Shopify Partner
3926 399 1444

Hard to be 100% sure without seeing the liquid code, but block settings mention "product images or swatches" -- have you tried defining swatches as per https://palo-alto.presidiocreative.com/products/palo-alto-product-pages/custom-color-swatches?

If my post is helpful, consider liking it -- it will help others with similar problem to find a solution.
I can be reached via e-mail tairli@yahoo.com
NovaMae
Shopify Partner
5 0 2

Sorry for the delay responding. Yes I have tried everything in their documentation. But when I add the names to the json file it still doesn't pull in the hex code. It says in their documentation re. siblings: "A color variant isn't required as that will be replaced by image swatches and a metafield is used to display the color." But then there is nothing that shows us how to define this metafield for the colors.

tim
Shopify Partner
3926 399 1444

Unfortunately I do not have access to Palo Alto code at the moment, otherwise it should be possible to tell.

If my post is helpful, consider liking it -- it will help others with similar problem to find a solution.
I can be reached via e-mail tairli@yahoo.com
candeau
Visitor
2 0 0

Hi Nova, I managed to figure it out if you're still struggling. The things that I had to make sure were done to get it to show properly.

- make sure on the siblings block in the theme editor that you've unticked 'show images'
- upload the image you want as the swatch as an SVG to the assets folder in the theme code

- add the colour name to the json swatches file as per their instructions e.g. "black": "black-swatch.svg"
- add that colour as a variant on the product page variant -> colour -> black

Hope that helps.

candeau
Visitor
2 0 0

Hi Nova, did you manage to figure this out? I'm having the same issue. Also tried custom swatch colours but they're not showing either.