Really you are rock man. I always love your tutorial. Could you please do one more filtering system using color or size so that we can easily understand whats going on other Filter. Thanks in advance!
Chris do you think, after I take your advanced Shopify course, that I'll be able to code a simple upsell on a product page? Basically, imagine you're on a product page for a red t-shirt and there's an upsell for a red pair of shorts, if you click the checkbox next to the shorts and then click the add to Cart button, both the t-shirt and the shorts are added to the cart. Or even simpler, if you check the box then shorts are added to the Cart and if you uncheck the box then they are removed...
Hi Michael. With all my classes and tutorials I try to focus on fundamentals rather than teaching specific how-to's. The idea is that you can use your skills to figure out an appropriate solution rather than copy solutions from me. For the particular use case you mentioned, the main skill there is Javascript and working with the Cart AJAX API. Take a look at the curriculum of any of the classes and see if that matches up ;) Also, it worth mentioning that I recently covered what you're talking about here specifically on my Patreon. www.patreon.com/shopifydeveloper Skillshare class access is included in your membership ;)
@@CodewithChristheFreelancer Thanks Chris, I'm checking this out now. I really hope you continue teaching on Shopify 2.0 because it's not been easy to find quality tutorials. Yours are world class!!
Hmm that's interesting. Shouldn't matter what theme you're using when you're looking for those settings in the admin. Have a read of the documentation help.shopify.com/en/manual/online-store/themes/customizing-themes/storefront-filters#check-if-your-theme-supports-filtering
Awesome video as always... Thank you so much sir. Sir, can you please make a video on how to make a customizabel blog post frame work by editing the code.
The two parts to make them show on your theme are: 1) Turning them on inside the 'Navigation' part of your admin 2) Placing the required code into your theme. If you do both of those, it should work
Great video! I have a question: I am using the new Dawn theme and When I test the filters on the mobile and desktop under my customization it does not let me select the the filters. Could it be because of the coding that was not added?
Hi Chris:) I recently started looking into learning Shopify theme development after finishing a course on front end design and your videos have been a huge help, thank you for all the info!! I've seen a few designers selling Shopify themes/ templates on Etsy and I'm wondering if you know what platform they might be using to build them? I was going to try to build my designs on Webflow and convert them into themes from there using the Udesly app. Thanks again!!:)
Hi Aimee. I'm not sure what you mean by 'platform used to build them'. Theme development is just a combination of HTML, CSS, JS and Liquid code. I write mine in an IDE called VS Code. If you're asking if there is an app like Webflow for Shopify Theme Development where you can use a UI to build your theme, then I don't know. Haven't heard about any tool like that except for Webflow itself.
Ok awesome thank you for the reply. Would you be able to send a zip file of the theme you create in VS Code to someone via email and have them be able to customize it within shopify after uploading it? Just trying to figure out if I can create a theme in VS code and then sell the zip file on Etsy.
Yes. That's exactly how it works. For a detailed look at how to set up the customiser settings, take a look at the lesson on JSON Schemas inside my Skillshare class skl.sh/2AETO9r
Hi Chris, I have a unique use case I was wondering if it's possible. I work with automotive data like SKU, Year, Make, Model, Engine, etc and I have thousands of records per SKUs. I was wondering what the most efficient way to manage this data in Shopify. Currently, this data is hosted in a system that has an API I can a Year, Make, Model, Engine query and get back SKU results to filter products in Shopify, but I'm wondering if there's a way the dynamic Year Make Model filters can be added to Shopify, then call the API somehow. Love the videos, learned a ton on this one, but I am still trying to figure out a good solution.
For that, you would need to modify your collection template to include a nested loop. So something like: {% for product in collection.products %} {% for variant in product.variants %} [HTML Code here] {% endfor %} {% endfor %}
Hello Chris, I am new to this can you please tell me how can add different filter options under navigation filter, like you have brand, size, price, but i want to put there Material, Gender, Type etc, Can you help me with that please :)
You can combine filtering via tags with the storefront filters and metafields is an option for storefront filtering so I would say so. Why don't you test it and find out?
Ok. So you're asking if you can use filters on search in Shopify. Search is a completely different API and will land the user on a completely different page. shopify.dev/api/usage/search-syntax
@@CodewithChristheFreelancer yes I’ve been trying for a few days, but I think Shopify updated the theme code a few weeks ago so previous codes aren’t working .
You can either upload the file to the 'files' section of your Shopify settings or store it in the assets folder of your theme. Then use the background-image property to show it on your web page www.w3schools.com/cssref/pr_background-image.asp
@@CodewithChristheFreelancer can you make a video of the process cause I have tried everything already. As far as my knowledge just putting in the code at the bottom of the file just won’t work anymore.
Really you are rock man. I always love your tutorial. Could you please do one more filtering system using color or size so that we can easily understand whats going on other Filter. Thanks in advance!
on my side no collection-filters and no price range, that's weird because on the documentation there was a price range
GREAT JOB as always! wish you'd include the inks to the previous vids you refer too!
Ok thanks for the feedback! If you need any help finding videos let me know. I sometimes put the links mentioned in the description as well ;)
Chris do you think, after I take your advanced Shopify course, that I'll be able to code a simple upsell on a product page? Basically, imagine you're on a product page for a red t-shirt and there's an upsell for a red pair of shorts, if you click the checkbox next to the shorts and then click the add to Cart button, both the t-shirt and the shorts are added to the cart. Or even simpler, if you check the box then shorts are added to the Cart and if you uncheck the box then they are removed...
Hi Michael. With all my classes and tutorials I try to focus on fundamentals rather than teaching specific how-to's. The idea is that you can use your skills to figure out an appropriate solution rather than copy solutions from me.
For the particular use case you mentioned, the main skill there is Javascript and working with the Cart AJAX API. Take a look at the curriculum of any of the classes and see if that matches up ;)
Also, it worth mentioning that I recently covered what you're talking about here specifically on my Patreon.
www.patreon.com/shopifydeveloper
Skillshare class access is included in your membership ;)
@@CodewithChristheFreelancer Thanks Chris, I'm checking this out now. I really hope you continue teaching on Shopify 2.0 because it's not been easy to find quality tutorials. Yours are world class!!
Thanks a lot Chris for detailed explanation that really help ❤️❤️❤️❤️
Thanks for the video! I'm using the Prestige theme and on the Navigation page i only see "Menus", I don't see "collection and search filters". :(
Hmm that's interesting. Shouldn't matter what theme you're using when you're looking for those settings in the admin.
Have a read of the documentation
help.shopify.com/en/manual/online-store/themes/customizing-themes/storefront-filters#check-if-your-theme-supports-filtering
Awesome video as always... Thank you so much sir.
Sir, can you please make a video on how to make a customizabel blog post frame work by editing the code.
Thank you Dharmesh! Not sure what you mean by 'customizabel blog post frame work' though
Thanks for the video, excellent explanation 🤟
excellent tutorial...........
Hii Chris, Please make a video for Shopify Speed Optimization
hmm that's not a bad idea! I've added it to my list
@@CodewithChristheFreelancer Thank you, I am waiting
This is awesome! For some reason I don't see the collection and search filters on my end though.
The two parts to make them show on your theme are:
1) Turning them on inside the 'Navigation' part of your admin
2) Placing the required code into your theme.
If you do both of those, it should work
Thank you so much Chris, I have a question, How can I use paginate of liquid tag for response data in case I have more than 1000 product?
Great video! I have a question: I am using the new Dawn theme and When I test the filters on the mobile and desktop under my customization it does not let me select the the filters. Could it be because of the coding that was not added?
Hi Chris:) I recently started looking into learning Shopify theme development after finishing a course on front end design and your videos have been a huge help, thank you for all the info!! I've seen a few designers selling Shopify themes/ templates on Etsy and I'm wondering if you know what platform they might be using to build them? I was going to try to build my designs on Webflow and convert them into themes from there using the Udesly app. Thanks again!!:)
Hi Aimee. I'm not sure what you mean by 'platform used to build them'. Theme development is just a combination of HTML, CSS, JS and Liquid code. I write mine in an IDE called VS Code. If you're asking if there is an app like Webflow for Shopify Theme Development where you can use a UI to build your theme, then I don't know. Haven't heard about any tool like that except for Webflow itself.
Ok awesome thank you for the reply. Would you be able to send a zip file of the theme you create in VS Code to someone via email and have them be able to customize it within shopify after uploading it? Just trying to figure out if I can create a theme in VS code and then sell the zip file on Etsy.
Yes. That's exactly how it works.
For a detailed look at how to set up the customiser settings, take a look at the lesson on JSON Schemas inside my Skillshare class
skl.sh/2AETO9r
How to implement custom field range filtering , its hard to new
What do you mean by 'custom field range filtering' ?
What I mean is that I want to do a range filter by the product's meta field , the effect is the same as price@@CodewithChristheFreelancer
Custom Range Slider
Hi Chris, I have a unique use case I was wondering if it's possible. I work with automotive data like SKU, Year, Make, Model, Engine, etc and I have thousands of records per SKUs. I was wondering what the most efficient way to manage this data in Shopify.
Currently, this data is hosted in a system that has an API I can a Year, Make, Model, Engine query and get back SKU results to filter products in Shopify, but I'm wondering if there's a way the dynamic Year Make Model filters can be added to Shopify, then call the API somehow.
Love the videos, learned a ton on this one, but I am still trying to figure out a good solution.
Hi Wilson. What's the limitation you're experiencing? Are you saying the product list data isn't stored on Shopify?
@@CodewithChristheFreelancer It isn’t stored no.
Does it play well with tag based filtering urls? Thanks for the superb video.
Not sure what you mean by 'play well'. These are new filters. Tag filters are still current.
how to display variants as single products in collection page ?
For that, you would need to modify your collection template to include a nested loop. So something like:
{% for product in collection.products %}
{% for variant in product.variants %}
[HTML Code here]
{% endfor %}
{% endfor %}
du do ecom chris?
Hello Chris, I am new to this can you please tell me how can add different filter options under navigation filter, like you have brand, size, price, but i want to put there Material, Gender, Type etc, Can you help me with that please :)
This page on the official documentation should help
help.shopify.com/en/manual/online-store/themes/customizing-themes/storefront-filters
Thanks sir ,
but can I get your CSS styling source code, so as to style my filter with the same style as yours
If you skip to 15:31 you can see the CSS code that I'm using.
How does filtering and meta data effect SEO ?
Storefront filtering is based on query parameters so, given that there is a change in url, there should be an effect on SEO too.
@@CodewithChristheFreelancer will this lead to duplicate content issues ?
Not sure. You'd have to ask an SEO expert that question.
Is there any way so we can use tag filter and dynamic filter both of them together
Dynamic filter? If you're referring to the new storefront filters (discussed in the video) then yes, you can combine both at the same time.
@@CodewithChristheFreelancer Hello brother. Do we have a video on this?
Hi
Is it possible to hide search parameters from appending in URL
Don't think so. Why would you need to hide it?
Awesome tutorials.
can we filter collection/search by both Tag And Metafields ??
You can combine filtering via tags with the storefront filters and metafields is an option for storefront filtering so I would say so. Why don't you test it and find out?
Can we add a filter on any page on the dawn theme? I want to filter Globally.
What do you mean by 'filter globally'?
@@CodewithChristheFreelancer I want to filter on the home page when someone searches it. It will go to the
collection page
Ok. So you're asking if you can use filters on search in Shopify. Search is a completely different API and will land the user on a completely different page.
shopify.dev/api/usage/search-syntax
my filters stop working once I hit 1,000 items, shopify tells me that is the most you can filter.
Thanks for sharing!
How do I upload my background to Shopify dawn theme?
Your background? As in an image that you'd like to use as a background image on your website?
@@CodewithChristheFreelancer yes I’ve been trying for a few days, but I think Shopify updated the theme code a few weeks ago so previous codes aren’t working .
You can either upload the file to the 'files' section of your Shopify settings or store it in the assets folder of your theme.
Then use the background-image property to show it on your web page
www.w3schools.com/cssref/pr_background-image.asp
@@CodewithChristheFreelancer can you make a video of the process cause I have tried everything already. As far as my knowledge just putting in the code at the bottom of the file just won’t work anymore.