Link variant images to names in product drop down menu

Site URL: http://isisfibrearts.com/

Does anyone know how to get the dropdown menu in the product details page to automatically update when you click on a variant image? It's annoying for my customers if they like the image but don't know the colour name to select.

Also... is there a way to change the font in the variant drop down menu? I'd like it to match the font in the product description but I couldn't find a place to change it.

Thanks!! 

15 hours ago, isisfibrearts said:

Does anyone know how to get the dropdown menu in the product details page to automatically update when you click on a variant image?

There isn't a built-in feature to update the variant dropdown when an image is clicked, but there is a feature where the main image will change when the user chooses a different variant on the dropdown. I suspect that someone has purchased a plugin or extension to achieve this.

We don't have an extension that can to this, but we do offer a Product Thumbnail Filter extension that hides all the thumbnails that don't relate to the selected variant, making it easier for users to choose. You'll find details of our extension here:

Thanks for your help @paul2009, but I've seen this work on other people's Squarespace pages, so I'm hoping there's code out there that I can use. I don't want to hide the other variant images, just update the dropdown as the images are selected. I sell yarn so most people will click on the image as opposed to the dropdown, unless they have a specific colour in mind and they already know the name. 

6 minutes ago, isisfibrearts said:

I've seen this work on other people's Squarespace pages

Where have you seen this?

 @paul2009Try this: https://www.tanisfiberarts.com/products/purewashfingering 

When you click on the different images, the name in the drop down changes. 

Their site is using the Sync Product Variant Images plugin.

@paul2009 Thank you very  much Paul! I really appreciate the help!