Color Swatch Prestige Theme

milyz
New Member
15 0 0

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"

 

Im using the prestige theme and want to know if it's possible to rename the option name for variants. Because on default it's on ''color'' but all the variants on my store are under ''material''..

 

So I want to switch it out for ''material'' so I dont have to rename all the options in my store and name them ''color''.

 

Help would be greatly appreciated!

 

Kind regards,

Milton

0 Likes
laurenbienendav
New Member
1 0 0

HI! were you able to figure this out?

0 Likes
scottjcook
New Member
1 0 0

Hi there, did you figure this out if you can rename the color swatch?  If so, any information on how to do so would help.

0 Likes
Daniel-Anverso
Tourist
8 0 4

Go to snippets/product-form

Find this line of code:

{%- assign color_label = 'color,colour,couleur,colore,farbe,색,色,färg,farve,frame color' | split: ',' -%}

 

and you can add your custom swatch option name like this:
{%- assign color_label = 'new name,color,colour,couleur,colore,farbe,색,色,färg,farve,frame color' | split: ',' -%}

0 Likes
Stefan21
New Member
6 0 0

Hi there,

does anybody know how to change the color swatch icon to a round design?

 

Thank you!

0 Likes

Hi @Stefan21,

Which theme you're using?

Zeian Shahzad | Designer | Developer
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- Email: shopify.zeian@gmail.com
Cheers!!
0 Likes
Stefan21
New Member
6 0 0

Hi @Zeian_Shahzad ,

I am using Prestige

0 Likes

@Stefan21,

1. In your Shopify Admin go to: online store > themes > actions > edit code
2. Find Asset > theme.scss or theme.css and paste this at the bottom of the file.

.ColorSwatch {
  border-radius: 50%;
}

 Please let me know if you need any assistance.

Thanks You!

Zeian Shahzad | Designer | Developer
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- Email: shopify.zeian@gmail.com
Cheers!!
0 Likes
Stefan21
New Member
6 0 0

hi @Zeian_Shahzad ,

 

thank you very much for the answer!!!!

 

Is it possible when I select the color that the selection is round and not square as in the photo?

 

Bildschirmfoto 2021-04-20 um 14.07.07.png

0 Likes

@Stefan21,

Add this too.

.ColorSwatch__Radio:checked + .ColorSwatch::after {
    border-radius: 50%;
}

Also, Like the solution, if it works for you.

Thank You!

Zeian Shahzad | Designer | Developer
- Was my reply helpful? Click Like to let me know!
- Was your question answered? Mark it as an Accepted Solution
- Email: shopify.zeian@gmail.com
Cheers!!
0 Likes