how to add filters to shopify collection

shopify 2.0 has completely changed the,way that filtering works,we now have a brand new filters section,under the navigation in the shopify,dashboard we can finally filter by price,we can filter by product options like,size without having to tag products with,the size or the price as we had to do,previously on the other hand we are,losing tag based filtering and i know,that's a big deal for many of you,especially if you have a large store,your entire,catalog may have been organized around,tags and now you have to rethink your,whole system it's maybe even a deal,breaker for you with upgrading to,shopify 2.0 but don't worry i'm going to,give you some tips on how you can,transition from the old tag based,filtering system to the new one in,general in this video i'll quickly,discuss the differences between the old,filtering system and the new one in,shopify 2.0 then i'll move on to kind of,a tutorial format i'll teach you,everything about setting up filters and,i'll show you lots of examples first i'm,going to show you how to set up basic,filters like size and price then i'll,show you how to create your own custom,filters using fields my example will be,filtering by fabric and you'll be able,to filter by cotton wool or polyester,and you can apply this knowledge to,whatever it is that you sell it's going,to be the same concept i'll also briefly,talk about color filters and why this is,the most difficult kind of filter to set,up and finally i'll discuss filtering,apps there are a couple of situations,when,filtering apps might be the best,solution for your store for example if,you still really need filtering by tag,and you also want filtering by price and,other advanced filters right then you,might need to use an app but first let's,talk about the difference between the,old filters and the new ones so finally,filters are now a built-in part of,shopify instead of being a feature of a,theme,that's very important difference this is,the reason why,the whole system has changed filtering,in shopify used to be done inside of the,theme some themes had filters and some,did not,so if you wanted filters firstly you had,to get a theme that actually offered,that feature and what you would do is,you tag your products and then you set,up the filters inside the theme,customizer not inside the shopify,dashboard but inside the theme right and,this was very inconvenient because every,theme had a different way of setting,them up you had to read the instructions,for that particular theme and then you,had to name your tags accordingly right,so,usually with underscores or dashes or,some specific format so that those,filters got grouped and they would show,up in the correct way this was bad for a,few reasons firstly it's confusing there,were many times when a client asked me,to help with a bug when really it was,just a matter of naming the filters,correctly it was also time consuming,because you had to manually tag all of,your products or you had to use some,kind of bulk editing app to do that you,know also you're just creating a whole,lot of tags on products which is kind of,messy and then lastly if you change,themes or if you even update the same,theme,but you have to set up the theme,settings again you also have to set up,the filters again right so in general it,was just hard to manage so now we,finally have filters built into the,shopify admin you can find them under,online store navigation page,and it's a lot easier to use at least,for basic filters it just makes sense,you simply tick what filters you want to,activate right you don't need to do a,whole bunch of tagging so you save time,your product stays cleaner,this also means that the filters are now,standardized and will work across themes,in exactly the same way except for color,filters but i'll get to that but still,now when you change or update themes,your filters stay intact there is a,separation between your themes,and the filtering you don't have to,worry about moving to a new theme your,filters will not break they will just,work there is a downside though for many,stores and that is that tag filtering,isn't really an option anymore so if,you're watching this video to confirm,that then yes it's true no more tag,filtering you will still be able to add,tags to products tags are not going,anywhere but they're more intended to be,used for internal,administration organization of your,store right,for things like automatic collections,for example and not so much for customer,facing things like filtering instead of,tags the new filters now use actual,product data,things like the price the product type,the vendor,the product options or the variants that,you have like size or color or whatever,you may have and of course meta fields,for those custom fields for those custom,filters if you don't know what meta,fields are i'll be teaching you in this,tutorial as well so let's talk about,each of those in a little bit more,detail okay so as you can see this,filters menu is kind of split up into,three sections we have this products,product options and meta fields,i'm going to talk about this one now i'm,calling it product properties because,it's properties that the product has,on its own without you adding anything,to it so like the price the availability,now it has these four properties,availability price type and vendor and,that's all there is to it you can't add,to these these are the default filters,that every shopify store will have the,most useful of these is probably the,price filter because this is the one,that was most painful to set up in older,themes so,here i've got actually here i've got a,price filter on the old version of turbo,and as you can see i had these tags like,under 25 and then 25 to 50 and then 50,to 75 those were the price ranges that,people could filter by,and then i had to tag all products with,this kind of pricing and if there were,two different variants and they were in,two different brackets then i had to add,two of these tags to them that was very,difficult to do,obviously not on my store because it's a,test store but i've definitely done this,on client stores and it was a pain and,look now the situation has changed,completely it's so easy you just tick,this box hit save and then you will have,the price filter appear on your theme it,will look differently on different,themes so in dawn we actually have to,enter a number right so i want all,products that are under eighty dollars i,would enter eighty dollars,we see this filter zero to eighty we can,go from forty or whatever anyway it just,works and you really don't have to do,anything besides check this filter so,my god so much easier and,saves so much time and the other one is,the product type that's something that,you should pay attention to as well i,know that a lot of stores,they don't even use this they don't even,fill this out because previously it was,not that useful but now it is one of the,major filtering types and shopify,obviously wants you to use that more so,you should think about naming your,product types in a way that actually,helps customers browse your store okay,so the next filter type that i want to,talk about is the product options now,these are actually dynamically taken,from the options or the variants that,are on your product so here i have a,size option right and that's where we're,getting size from here and if my,products did not have any options like,if it was a single option product like,this water bottle that i have here it,has no options,if all of my products had no options,then we would have nothing here so it's,possible that on your store you don't,have anything here at all and likewise,if i did add options for example,if this bottle,has two different variants you know it,has a one liter bottle and it has a 500,ml bottle for americans that's you know,32 and 16 ounces and so now this product,does have,variants or options if i save that,that's immediately going to be updated,if we refresh,that's immediately going to be updated,in the filters i'm now going to be able,to,add a capacity filter so there we go if,i check that that will add a capacity,filter to my store there's our new,filter and because,this collection contains the bottle,uh you know we can now filter by,capacity but notice that with this type,of filter,um,you know whichever one of these i filter,by this product will always show up,because,both of these capacities are on this one,product right here it is another thing,that you kind of have to be careful of,is that if you delete this product or if,you,delete these uh variants right,and we go back to having just the one,product and say like it's just a one,liter water bottle product,with no variance then those filters will,disappear so even though you may have,set up a filter before and you want that,filter on your store but you,accidentally you deleted a product you,will accidentally have deleted that,filter so that's all there really is to,product options,i know that color will also be a popular,one i'm going to talk about color a bit,later you might notice that i have color,as a product option filter and color as,a meta field filter as well,and usually i recommend using the meta,field and so i'm going to talk about,color filters a bit later because first,you need to understand what meta field,filters are and how they work all right,so i know that there is someone out,there watching this thinking we don't,sell something easy like t-shirts we,sell car parts we have like so many,different filters like diameter pressure,kilowatts you know all these custom,filters,and they're all based on tags without,tag based filtering our store is going,to be unusable and yeah i know that,that's a problem for many stores i think,the lack of tag filtering,is going to be a problem and possibly a,deal breaker when you're thinking about,upgrading to a shopify 2.0 theme that,you are otherwise very enthusiastic,about but i think it's okay i think,you're still going to be able to provide,all those types of filters but instead,of tags you're going to be using,metafields i've got a very simple,example on my store i've got this fabric,filter,and this isn't using a product option or,anything it's just a custom value which,is coming from a meta field okay so if,you're not sure what meta fields are,meta fields are basically custom fields,that you create,that show up at the bottom of the,product admin page so first we have to,set it up we define the meta field and,then that will show up on products and,they're just extra fields besides the,product title the description the price,the extra fields that you can use for,any custom value defining a meta field,is done through settings and then going,on meta fields,and it's where you create the meta field,and you say what it will be used for,after you define the meta field then,that meta field will appear on product,pages as a new field that can be filled,out so we're going to go into settings,meta fields and then we're going to go,into products because we want this field,to appear on the product admin page,and these are many fields i've already,created for different tutorials,but we're going to say add definition so,let's recreate this fabric filter that i,have we're going to be doing the same,thing but i'm just going to call it,material because i don't want to delete,this one,the name fabric is already taken so i'm,going to name it material,and then next we have this namespace and,key,now this is kind of just like an id it's,kind of for internal organization and,it's also what we use when we output a,meta fields value in code which we're,not going to be using today in this,tutorial but in other tutorials i show,you how to output meta fields in code,generally the namespace if i'm using it,for filters i will make the namespace,filters so filters.material that's a,logical kind of name or id for me and we,select a content type now the,description,sorry the description is uh,optional you can add a description and,that will show up here and it'll like,kind of help you remember what this is,for,but the main thing we should do is,select the content type and the content,type is going to be text,we are rarely going to have multi-line i,mean we're probably never going to have,multi-line text for a filter right it's,going to be always single line text and,the next thing you might want to do is,check this box that says accepts a list,of values now this is important uh you,have to make a decision of whether,your products can be filtered by,multiple values right,what do i mean by this well a common,example is the color actually if you're,using metafields for color,um,and like on this product for example i'm,not sure what color this is you know,this this could be beige it could be,like sand could be brown and uh i want,this product to show up whenever,a customer is filtering by any of those,so if they filter by brown i want this,product to show up or if they filter by,beige i want this product to show up,also,and that's why on this product i,actually have,multiple,values see beige and brown in a list,like this so this add item button on the,other hand for this fabric meta field,i don't have that so it only lets me,input one value and this is actually,wrong for fabric,because you know a product can be made,of a blend of fabrics right so now that,we're creating materials,i am actually going to,make it like this so that we can add you,know cotton and polyester blend so i'm,going to check accepts a list of values,and now we have validation as well you,usually won't need this for filters so,i'm not going to go into it too much but,one thing you might want is this limit,to preset choices so here you can define,some presets this is just going to make,it easier because you won't have to,type out cotton every time,it's going to actually give you a list,of things that you can choose from so,i'm going to add cotton polyester,100,organic cotton you know that's another,material,and,and wool so this is just going to be,easier to fill those things out,now i'm going to save,and as soon as i saved i can go back to,my product and i should be able to see,that new matter field up here on my,product page and as you can see it's,like select an option because we ticked,that box that said limit to preset,choices right so,if this product is a blend of cotton and,polyester i can actually add two i can,add cotton and polyester but actually,it's wrong that's wrong this particular,product is 100 organic cotton i'm going,to do that and i'll show you the blend,on,on a different product so this is pretty,easy right that's all there is to,metafields you create a definition,and then you fill it out the only,problem that you might have,is,doing this,on hundreds or thousands of products i,mean how are you gonna do that you have,to go into every product,right and then scroll down to the bottom,and then fill out this,material right that's that would be,crazy if you have thousands of products,like that if this is your situation that,you have like a lot of products and you,need to edit meta fields for all of them,there are a few different solutions for,this the first is that there is actually,a hack you can do with the bulk editor,but it doesn't work on all stores it's,kind of weird i made a different video,on it so i recommend checking out that,video and seeing if it still works on,your store but you may be able to enter,the bulk editor and actually edit meta,fields here you may not be able to,depending on if your store has been,updated by shopify this new update has,been rolled out that stops that hack,from working,so i'm going to recommend apps instead,as a fallback and there are three apps,that can help you out with this okay,the first is meta fields guru this is a,well-known app for editing meta fields,and,it has a whole bunch of features that,makes editing meta fields easier,but the one that you're looking for is,this excel like editor right and so it,gives us this whole spreadsheet of all,our products with our meta fields and if,i want to add you know,the meta fields we already set up to,this product i can go cotton,polyester,apply and then for example i can apply,this across the entire column like that,there's other things you can do as well,but the first app is meta fields guru,okay um the next app,is called,uh matrix fi,matrix fi is a very useful app when you,have a large store with lots of products,and it's not just for meta fields it,lets you,export and import a csv just like the,default shopify one but unlike the,default shopify one it lets you choose,which,columns or which product properties you,actually want to export and re-import,back in so the default shopify,export import to csv,when you import it completely overwrites,your products and that's kind of not,very safe to do,whereas matrix if i,when you re-import it actually doesn't,overwrite your products it only,overwrites that one column that one,property that you exported right,so,that could be really useful for you for,updating your meta fields in bulk uh you,know you would export this and just edit,in excel or in you know whatever google,sheets,uh and then re-import in a safe way okay,and the third app is called bulk product,edit i actually really like this app uh,because it's an automation app right it,works differently from this where you,edit a spreadsheet and this where it,gives you a spreadsheet inside of,shopify what this actually does is,it lets you create um automations or,tasks that run let's check this out we,just entered the meta field editor,and uh we can go into,we can select products that have the tag,of you know whatever you had before if,you're using some kind of tag like size,underscore eight or something like that,it looks for all products that have this,tag,and then you can say we're going to add,a meta field to all these products and,it's going to be filters,size you know or something like that and,it's going to be eight and then it will,bulk create metafields,or bulk fill out metafields preferably,that you've already defined,uh it will bulk fill out those metal,fields for all products that are tagged,like that and so that's,you know,if you've got a big store and you're,using tags currently then this is,exactly how you would migrate all of,your tags to meta fields,in bulk so yeah those are the three,options the three apps that might help,you edit meta fields inbox meta fields,guru matrix fi and bulk product edit,after you've filled out all of the,mirror fields for your products the last,step is super easy you're going to go,add filters and then you can add your,new meta field filter you can activate,it under meta fields here,click done and you will see that new,filter,on the front end of your store,there we go material obviously i haven't,filled it out for all products but let's,just take a look at these pans that are,cotton and polyester,so i can demonstrate how this works for,multiple,multiple matches and okay here we go,here's a good demonstration i filled out,cotton and polyester for this one and i,filled out 100 organic cotton and cotton,for this one so if we filter by cotton,we will see both of these but if we,remove just cotton and have this,we see the ones that are 100,likewise if we filter by polyester we,will see these,or if we filter by cotton we will also,see these so i hope this makes sense now,there is something important that i,skipped over and that is color filters,you may have noticed that on my store i,have color,uh in the filters set as a product,option right and i also have a color,filter meta field colors are pretty,complex so i'll be getting into this too,much um i will be making a separate,video so you might want to check my,channel check the shopify 2.0 playlist,if i've already made that since you're,watching this in the future,but i'm going to quickly summarize the,problems with color filters so that you,understand the issue,now the first problem is that some,products have very complicated color,names right so,these colors here,this is actually the,product options color filter and they,are pulling these color names directly,from the,um the product options right which are,the actual names of the colors flamingo,pink blue ridge you know these are very,confusing names and you might have an,even worse situation where you have,different shades of a color like you,might have blue ridge you might have,blue navy aqua ocean blue a royal blue,steel blue right,and you don't want all of these showing,up so that a customer is like forced to,click each one of those if they want,just you know any any blue like product,right and so for many stores the best,solution is to create a meta field for a,generic color which is what i've done,here right with the beige and the brown,this is a metal field that's set on,these pants and actually this is also,something you might want to do if your,product you know obviously these are,beige or brown but they don't have a,product option,uh they don't have color so if your,products are actually,you know different colors and they're as,separate products then this is also what,you want to do basically you would just,enter blue here,if you have products with lots of,different shades of blue and when a,customer filters by blue all those,products will show up when they just,select one of these generic colors,you will have tagged all of these,different,products with different colors with blue,so yeah that's one reason why you might,use a metal field instead of the,built-in product options for color now,the second problem with color filters is,that you probably want these filters to,show up with color swatches right and,not just as the color in plain text so,what's a color swatch it's something,like this,if you want swatches then depending on,what theme you're using you might be in,luck some themes offer swatches on the,filters and they're smart enough to,understand the word color as the heading,of that filter,and then they activate that swatch,regardless of if you're using the,product option or if you're using a,metafield so they see a metafield called,color and they activate the swatches,other themes,may not be smart enough to do that but,anyway i'll be going more into detail in,this on the other video on color filters,i'll tell you right away that dawn theme,for example the default theme for,shopify that i'm using does not offer,color swatches for filters so you just,have to have these plain text colors,unless you do some custom coding which i,might make a tutorial on later now we're,almost getting to the end you know,almost everything there is to know about,filtering in shopify 2.0 so all this,being said if the new filtering system,just doesn't suit your needs you can,still use an app okay so this is a,preview of a filtering app and as you,can see it's got a lot of advanced,filters so an app would often give you,the best of both worlds because you can,filter by price easily see we have this,price slider you can still filter by,tags,right so if you don't want to change,your tag based filtering system you can,still filter by tags using an app,and you can filter by price and get all,the new features as well and of course,they give you color swatches which are,easy to set up,you can upload each color as a little,file and it's a very friendly ui,so overall an app is sometimes just both,the easiest and the most advanced and,fully featured solution however as you,may know,the downside of apps is that they may,slow down your store a little bit uh,with the loading time when a collection,page is loaded right not your entire,store but just collection pages while,people are browsing them and you know,the other downside is obviously that,they cost money,on a monthly basis if you're going to,use an app for filtering then the one i,recommend is called product filter and,search by boost commerce you'll find the,link to this app in the description and,yes if you click it i will get paid a,small commission,however i'm not recommending something,that i wouldn't use myself,this is the app that i'm showing you,here this is the demo of the app this is,what i use on my client stores,and it works really well compared to,other filtering apps that i've used,which tend to be buggy it has the color,swatches it has the price it has some,interesting filters that you can create,like the shape for example and this,works in the same way that you would do,color swatches but you're able to upload,an icon,for each one of your filter options,right so this is very cool i think,you can also do things like,the percent sale yeah people can filter,by how much things are on sale,so yeah i genuinely really like this app,it's also like the leading app on the,shopify store it's got a bunch of,reviews so i'm not like recommending,something weird so if you do use that,link yeah you'll be supporting this,channel and i will be very grateful for,that and actually by the way if you want,a tutorial on how to set up filters,using this app then i'll be happy to do,that uh just let me know in the comments,if you're interested in that i can,actually show you how i'm using it on a,real store so that's it that concludes,this video i really hope it wasn't too,long because i also have to edit it,right now anyway i hope you found it,helpful if you're currently going,through the process of updating your,site from an older theme to shopify 2.0,then you might feel a bit stuck or,unsure about a couple of things i've,actually had people contacting me,recently,asking about how to update to shopify,2.0 in their specific situation,and they want like a bit of help a bit,of a consultation call or something like,that and a consultation with a developer,is usually quite expensive it would,usually cost whatever the developer's,hourly rate is,and if you're going to be talking to,them for an hour or a couple of hours or,you know enlisting their help then,you're obviously going to be paying,hundreds of dollars,however you might be interested to know,that i do have a more affordable option,for you if you're a smaller store,and that is a coaching group that i run,as a monthly membership and it's,currently just 40 dollars per month so,yeah it's group coaching it's a very,small group there are currently only a,few people in it,and it's basically discord chat room uh,with myself and this small group of,other shopify store owners and beginner,developers as well actually,and we discussed everything about,shopify 2.0 and about making code,changes to your theme and basically,everything that i do on this channel and,i provide a lot of very personalized,support and advice to those people in,that group so if that sounds good to you,you can find out more and maybe sign up,at buy me a coffee.com slash ed codes,this is like a donations platform but if,you click on the membership tab then you,can find out more about my,membership and the coaching group but,yeah that's all for today guys this,video is long enough,as usual please leave a like subscribe,if you haven't already,and if you have any questions just leave,a comment and i'll try to respond or,make a video for you that's all i'll see,you next time

Congratulation! You bave finally finished reading how to add filters to shopify collection and believe you bave enougb understending how to add filters to shopify collection

Come on and read the rest of the article!