[Color Swatches Shopify] - How To Add Color Swatches on Shopify Dawn Theme

  Рет қаралды 16,656

WebSensePro

WebSensePro

Күн бұрын

Пікірлер: 106
@WebSensePro
@WebSensePro Жыл бұрын
Checkout our latest video for updated Dawn 9.0.0 kzbin.info/www/bejne/ZpXKoGame62Sg9U
@tourofthanh
@tourofthanh 2 жыл бұрын
Im not very experienced when it comes to coding but I am stuck around 6:00. I copied the line from the code but Its not able to find it when I paste it in search on the main product liquid page
@WebSensePro
@WebSensePro 2 жыл бұрын
Contact info@websensepro.com for paid support. Thanks for watching our video
@theleafytreetop
@theleafytreetop Жыл бұрын
Thank you so much for the tutorial. I noticed in the comments that this can't be done with size variants. Is there a way to do it with also having size variants. Thank you for your time!
@WebSensePro
@WebSensePro Жыл бұрын
Great suggestion, will create a tutorial for that
@barak499
@barak499 Жыл бұрын
great video! its working on my dwan theme but 1 problem -the shape of the swatches is not rounded till the end its mix of Round and rectangular how can change to circale shape?
@WebSensePro
@WebSensePro Жыл бұрын
Small change in CSS code would make it work
@barak499
@barak499 Жыл бұрын
@@WebSensePro 1. can you pls do a tutorial on this? 2. can you pls do a tutorial on how to create filters on the collections page with Metafield without any apps?
@WebSensePro
@WebSensePro Жыл бұрын
Sure, will create tutorial if it's demanded by audience
@barak499
@barak499 Жыл бұрын
@@WebSensePro about 2 its must! :) It can help other people to upgrade there skills & the collection page :)
@franzship8073
@franzship8073 10 ай бұрын
Hi :) It´s a very helpful video but unfortunately i can´t do the last step (changing the code) because in the dawn-theme 10.0 the code doesn´t exist like explained in the video. Is there any other possibility to change the code? Thank you, Vanessa
@WebSensePro
@WebSensePro 10 ай бұрын
Yes will post updated video soon
@kartikeyakhandelwal7687
@kartikeyakhandelwal7687 Жыл бұрын
are these color swatches also visible on product listing(before opening the product) so that the viewer knows that there are color variants available???
@WebSensePro
@WebSensePro Жыл бұрын
No its for product page only
@jennylam8920
@jennylam8920 Жыл бұрын
Thanks for the tutorial. I am using Dawn v8.0.1 and I am unable to search the code to replace.
@WebSensePro
@WebSensePro Жыл бұрын
Updated version coming shortly. Subscribe to stay notified
@melisahogg8546
@melisahogg8546 Жыл бұрын
H! This is not working for Dawn 8.0 - could you share the new code?
@WebSensePro
@WebSensePro Жыл бұрын
Coming next week with more stylish look
@maorid4218
@maorid4218 2 жыл бұрын
Works perfectly with Refresh 2.0.0 theme. Thanks a lot!
@WebSensePro
@WebSensePro 2 жыл бұрын
Thanks for testing on Refresh Theme
@PilosopoTasio
@PilosopoTasio 2 жыл бұрын
How do I get the search field for the code page where I can paste the code to be replaced?
@WebSensePro
@WebSensePro 2 жыл бұрын
Pretty easy in liquid I will create a separate video for that
@mdshohaibsarker5835
@mdshohaibsarker5835 Жыл бұрын
Question for you, is it working together color with size? or just for only color.
@WebSensePro
@WebSensePro Жыл бұрын
Yes it will show up swatches when you have size drop down
@tomascouto2005
@tomascouto2005 Жыл бұрын
Could you do for multiple varients pls? I love your content
@WebSensePro
@WebSensePro Жыл бұрын
Sure, in progress will come soon
@damienrogers4572
@damienrogers4572 Жыл бұрын
Has anyone find out how to save this issue.. Thankyou
@6lake162
@6lake162 2 жыл бұрын
Is there a way for the color name to show also when choosing a swatch?
@WebSensePro
@WebSensePro 2 жыл бұрын
Yes add in color.option in liquid code
@ABOVETHECROWDBOUTIQUE
@ABOVETHECROWDBOUTIQUE Жыл бұрын
Hi, I'm working on swatches on product page in shopify, and unable to find the code I have to replace on main_product.liquid file. Using version 12 of Down theme. Any ideas why?
@WebSensePro
@WebSensePro Жыл бұрын
Watch the updated video here kzbin.info/www/bejne/ZpXKoGame62Sg9U
@ABOVETHECROWDBOUTIQUE
@ABOVETHECROWDBOUTIQUE Жыл бұрын
Thank you, it worked
@WebSensePro
@WebSensePro Жыл бұрын
Thanks for appreciation, if this video/channel helped in any way please support by Subscribing and Hit the Like button.
@khanhlinh9320
@khanhlinh9320 2 жыл бұрын
Hi I've followed the steps but the swatches dont appear. Can you please check the code? Thanks
@WebSensePro
@WebSensePro 2 жыл бұрын
Whats your theme name and version?
@khanhlinh9320
@khanhlinh9320 2 жыл бұрын
@@WebSensePro Dawn version 7.0.1 here is
@tesskelly5790
@tesskelly5790 2 жыл бұрын
Is there a way to change to a different product page when a color swatch is clicked? I have each color on a different product page.
@WebSensePro
@WebSensePro 2 жыл бұрын
Yes it is, please contact info@websensepro.com for premium support
@Jeannie_Hernandez
@Jeannie_Hernandez 2 жыл бұрын
I followed your instructions on the Dawn 2.0 theme using the option.position link and it shows the colors but not able to click on them. Please help.
@WebSensePro
@WebSensePro 2 жыл бұрын
Try option.name
@Jeannie_Hernandez
@Jeannie_Hernandez 2 жыл бұрын
I tried re doing it but it says Key is in use for product variant metafields on the color namespace. I can't move past this section and now all my products look weird. They only highlight on one color name & size and material are highlighted too.
@WebSensePro
@WebSensePro 2 жыл бұрын
@@Jeannie_Hernandez You didn't delete Metafield values when deleting metafields
@Jeannie_Hernandez
@Jeannie_Hernandez 2 жыл бұрын
@@WebSensePro what about the other code I already inserted? Can I leave it like that?
@Jeannie_Hernandez
@Jeannie_Hernandez 2 жыл бұрын
@@WebSensePro I am in so much trouble. I think when I tired to replace it. I accidently deleted the the product file. What can I do now??
@Joeboetheasian
@Joeboetheasian 2 жыл бұрын
See my pictures wont switch when i click the color any help?
@WebSensePro
@WebSensePro 2 жыл бұрын
Hi Joseph, Can't debug your issue without more information. For more help please contact info@websensepro.com
@rahulbhadauriya438
@rahulbhadauriya438 2 жыл бұрын
Thanks for this code
@WebSensePro
@WebSensePro 2 жыл бұрын
Your welcome
@clotildedanan-attia9903
@clotildedanan-attia9903 2 жыл бұрын
Hi, is it still working on dawn theme 2.5 ? i've followed all the instructions but it doesn't work. Many thks for your help
@WebSensePro
@WebSensePro 2 жыл бұрын
Yes it does but on latest dawn version.
@WebSensePro
@WebSensePro 2 жыл бұрын
2.5 dawn is old version it will work on 4.0+
@chhaviaggarwal4677
@chhaviaggarwal4677 2 жыл бұрын
Hi, is there any way to get in touch with you?
@WebSensePro
@WebSensePro 2 жыл бұрын
Yes you can contact via email websensepro@gmail.com
@melaniesurmon2802
@melaniesurmon2802 2 жыл бұрын
Hi, what if I want to add custom swatch colours that are hair colours for example If I upload a colour variant for a product then go to the product, the colour i uploaded for the variant is huge and just replaces the main product image. Then you can't click out of it to get rid of it. Any advice on how to put this right
@WebSensePro
@WebSensePro 2 жыл бұрын
Please contact info@websensepro.com for our premium support
@nicolaikaasgaard7231
@nicolaikaasgaard7231 2 жыл бұрын
Hi WebSensePro:) I have been using your tutorials a few times before with great succes. However i just cant get this one to work... The tutorial seems pretty straight forward, and im able to add the meta fields and the custom code. But yet the variations wont swap from text to color. I honestly dont know what it is i am doing wrong. Is there something in the newer version of dawn that i need to be observant on maybe?
@WebSensePro
@WebSensePro 2 жыл бұрын
Which version of Dawn theme you are using?
@nicolaikaasgaard7231
@nicolaikaasgaard7231 2 жыл бұрын
@@WebSensePro Thank you for replying. I’m using Dawn version 6.0.2
@WebSensePro
@WebSensePro 2 жыл бұрын
@@nicolaikaasgaard7231 try implementing on a fresh dawn theme and make sure you deavtivate all apps for the time being
@WebSensePro
@WebSensePro 2 жыл бұрын
@@nicolaikaasgaard7231 Please send your store link and access to websensepro@gmail.com so we can look out the issue for you
@nicolaikaasgaard7231
@nicolaikaasgaard7231 2 жыл бұрын
@@WebSensePro Hi again:) After a little digging i found the solution. I just made a "brain fart" in the translation setting, that's all😅 But it seems to work now. Thank u for responding tho, very kind of you👍
@becky-Sharpe
@becky-Sharpe 2 жыл бұрын
What is the code to Add Color Swatches on shopify product page foe District theme please
@WebSensePro
@WebSensePro 2 жыл бұрын
Hi Becky, We will try to create a video tutorial for District theme if you want urgent service pls contact info@websensepro.com
@traderjohn255
@traderjohn255 2 жыл бұрын
Hi, it's doesn't work. It shows colors but when I click on it it does not select. Did exactly as you showed.
@WebSensePro
@WebSensePro 2 жыл бұрын
Which shopify theme are you using? If it's dawn theme can you check it's version
@traderjohn255
@traderjohn255 2 жыл бұрын
@@WebSensePro Down theme. I have fixed it. They Have changed the code: instead of {{ option.name }} must be {{ option.position }}
@mmbm263
@mmbm263 2 жыл бұрын
@@traderjohn255 thanks a loat bro
@larondathompson2241
@larondathompson2241 2 жыл бұрын
@@WebSensePro I am having the same issue I am on Dawn Version 5.0
@WebSensePro
@WebSensePro 2 жыл бұрын
@@larondathompson2241 This code is tested upto Dawn 6.0 so there shouldn't be a problem. If you are looking for premium support, please contact info@websensepro.com
@ol220938
@ol220938 Жыл бұрын
I need help with my Shopify store can I hire you
@WebSensePro
@WebSensePro Жыл бұрын
Sure, contact websensepro@gmail.com
@sophieho8364
@sophieho8364 2 жыл бұрын
I can't fine code {{ value }} on dawn theme 6.0.2.
@WebSensePro
@WebSensePro 2 жыл бұрын
Try search for {{ value }} only make sure you are in main-product.liquid file
@umerilyas9545
@umerilyas9545 2 жыл бұрын
I am also Can not Find this Code.
@WebSensePro
@WebSensePro 2 жыл бұрын
@@umerilyas9545 check which theme and version yoi are using it works with dawn 6.0.2
@umerilyas9545
@umerilyas9545 2 жыл бұрын
@@WebSensePro please Help Me How Can I add Color Swatches in Kalles 3.2.0
@joshsamuels8139
@joshsamuels8139 2 жыл бұрын
How do I do this with images instead of colours?
@WebSensePro
@WebSensePro 2 жыл бұрын
Please share store link
@joshsamuels8139
@joshsamuels8139 2 жыл бұрын
Thank for your response. I'm mid way through setting up my shop - is there a way I can privately send you the link and password?
@WebSensePro
@WebSensePro 2 жыл бұрын
@@joshsamuels8139 email to websensepro@gmail.com
@chhaviaggarwal4677
@chhaviaggarwal4677 2 жыл бұрын
Hi, I followed the steps, but the colour is not showing
@WebSensePro
@WebSensePro 2 жыл бұрын
Which theme and version you are using?
@SuggestRobby
@SuggestRobby 2 жыл бұрын
@@WebSensePro Same for me i'm using Dawn version 6.0.2
@WebSensePro
@WebSensePro 2 жыл бұрын
@@SuggestRobby Tutorial is suitable for Dawn 7.0.1
@joshjpierce
@joshjpierce 2 жыл бұрын
Using Dawn 5.0 Theme, not seeing the original code to be replaced at all.
@WebSensePro
@WebSensePro 2 жыл бұрын
Its for latest version Dawn 6.0.2
@joshjpierce
@joshjpierce 2 жыл бұрын
@@WebSensePro cant seem to update to 6.0.2
@WebSensePro
@WebSensePro 2 жыл бұрын
@@joshjpierce Add new and publish
@joshjpierce
@joshjpierce 2 жыл бұрын
@@WebSensePro i went to add the theme, its now their, but if i preview its a fresh theme, would publishing bring all my current edits over? ive done a ton of work to the 5.0 theme
@joshjpierce
@joshjpierce 2 жыл бұрын
@@WebSensePro oh wow i would have to entirely redo the site because i have custom code in the 5.0 / any chance you have figured out color swatches for 5.0?
@ttmmaacc
@ttmmaacc 2 жыл бұрын
The code has updated. It is now option.position, please update your code
@WebSensePro
@WebSensePro 2 жыл бұрын
Thanks for contribution, code is updated now.
@JGriffing
@JGriffing 2 жыл бұрын
@@WebSensePro The code is still outdated. Please update the code to be replaced with option.position. Without this, when users click on swatches nothing happens. Thanks for the original code to begin with.
@WebSensePro
@WebSensePro 2 жыл бұрын
@@JGriffing Updated the code, thanks for contributing
@kairifimberg
@kairifimberg 2 жыл бұрын
Thank you for the tutorial! I'm trying to figure out how to add the color swatches on the collection page as well. Any video on that for Dawn 2.0 theme? ;)
@WebSensePro
@WebSensePro 2 жыл бұрын
You mean as a Filter right?
@kairifimberg
@kairifimberg 2 жыл бұрын
@@WebSensePro I meant in description under product image where we have product name and price... for products that have many colors.
@WebSensePro
@WebSensePro 2 жыл бұрын
@@kairifimberg By following instructions on this video are you not able to add Color swatches on product page?
Shopify Tutorial - How To Add Color Swatches (beginner friendly)
17:57
Coding with Jan - Shopify Developer
Рет қаралды 55 М.
coco在求救? #小丑 #天使 #shorts
00:29
好人小丑
Рет қаралды 120 МЛН
Chain Game Strong ⛓️
00:21
Anwar Jibawi
Рет қаралды 41 МЛН
“Don’t stop the chances.”
00:44
ISSEI / いっせい
Рет қаралды 62 МЛН
Сестра обхитрила!
00:17
Victoria Portfolio
Рет қаралды 958 М.
Create CUSTOM PRODUCT OPTIONS on Shopify 2.0 Dawn Theme - Without the App for FREE
11:33
How To Add Color Swatches To Your Shopify Product Page
11:41
BitBranding
Рет қаралды 25 М.
Add Hover Effect to Header Menu - Dawn Theme Shopify
2:26
Will Misback
Рет қаралды 21 М.
How to set up custom and personalized products on Shopify (free)
37:40
Coding with Jan - Shopify Developer
Рет қаралды 130 М.
How To Add a Related Products Block to Your Product Page Without Apps - Shopify Dawn Theme
24:32
Ed Codes - Shopify DIY Tutorials
Рет қаралды 23 М.
Shopify Dawn Theme: Display Inventory On Product Page, No App
4:59
Ed Codes - Shopify DIY Tutorials
Рет қаралды 16 М.
coco在求救? #小丑 #天使 #shorts
00:29
好人小丑
Рет қаралды 120 МЛН