Categories Uncomplicated

Find Shopify App — it's free
BACK

How to deploy the Categories Uncomplicated liquid to your theme (Classic example)

good evening this is a short screencast,demonstrating how to deploy,uncomplicated categories in a new theme,I've just had a sport request come,through asking for some help in,deploying the uncomplicated categories,category list in the classic theme so I,thought I would demonstrate the entire,process and here's my site this is the,uncomplicated categories demo site and,you can see we've got a few products,here set up in a few categories this is,currently using the supply thing if I,want to install it in a new theme I need,to go into online store theme so I'm,here inside the admin section of my site,I've gone into themes and you can see,I've currently got supply set up I'm now,going to visit the theme store and from,the theme store do a search for classic,and select nice it like that I'll be,fine,install the theme and I'm going to,publish as my shops theme now that's,quite crucial because it is crucial,because if you do it only as a preview,that uncomplicated categories doesn't,get visibility at the fact that you're,previewing one theme it can only see the,theme that you've actually got set up on,your site so given we want and come to,care categories to be able to install,its liquid into the theme we need to,have the theme set up as our published,theme so now go to the theme manager,here are looking at classic I edit HTML,CSS and Here I am with with all the,different bits that make up the site so,the process I would go through now be to,try and work out where within this theme,the left sidebar is set up I'd look at,collection liquid and have a quick,search in here for sidebar there's,nothing in there I'd have a quick look,at theme liquid and have a search for,sidebar and I see that's where I set up,so here we can see it's enabled if if,the sidebar is enabled or if it's been,turned on then we want to include a,snippet called sidebar so I'm not going,to go down here and from the snippets,I'm gonna look for the one that's,mentioned here sidebar liquid so I open,that up and this is a sidebar,at this point I find it quite useful to,cross-reference the liquid in HTML it's,being displayed here with what's,actually shown on the site so I'm gonna,go back to the front page of my site,refresh and by refreshing I'm now seeing,my site using the classic theme if I,look here at the left hand side this is,broadly where I want to put my content,so shop my collection shop by type I'm,going to create a new thing here which,is going to be called shop by category,and to do that I'm gonna try and,cross-reference the visual rendered HTML,I'm saying here in the front end of site,with the liquid that I'm seeing here,this is the part here where it says shop,by collection so I'm going to duplicate,this structure and I want my shop by,categories to go here at the top so I do,click start and put it up at the top I'm,going to change the title of that to be,shop by category and then underneath it,I'm going to start I want to actually,pull in the liquid from uncomplicated,countri

The above is a brief introduction to Categories Uncomplicated

Let's move on to the first section of Categories Uncomplicated

Categories Uncomplicated for Shopify, how to set up categories from scratch

Categories Uncomplicated for Shopify, how to set up categories from scratch

good morning this is a screencast that,demonstrate how to set up uncomplicated,categories on a new site it's,straightforward to set up uncomplicated,categories on an existing site but the,purpose of this screencast is to go into,more detail about what it takes to set,up from scratch so here I have a Shopify,development store it is absolutely,brand-new there's nothing in it as no,products no navigation no nothing and,what I'm going to do is to demonstrate,how you go through the process of,setting up a store from scratch using,uncomplicated categories first step is,to get some products so I'm going to go,into the products page I'm going to,import some products I've got a CSV file,here that contains an array of products,import this will take a couple of,moments just to bring in all those,products great so that's complete now,and you can see here a list of the,products I've imported there's about 50,or so of them in a variety of different,types different types technology the,next stage here is to set up the,navigation now in the navigation I want,to have my category lists so if I go,through here to online store navigation,I've got a main menu and a footer these,are just lists of links that appear on,the site at the moment the main menu,appears at the top so let's have a,little look at the site in its current,state uncomplicated my shop viacom which,is our demo site so here we've got some,products imported into the site but,that's not what's showing here on the,front page the front page at the moment,is completely unconvicted there's,nothing in the front page collection,which is why we're getting this list it,says add some products and so on we're,not going to any products that,collection now for now we're just going,to look at the catalog which is all of,the products in our site to check,they're there and we're seeing a good,array of products that's four pages of,them but at this stage no categories,this is the main menu and down here at,the bottom here we've got the footer,menu next step is to actually create our,category lists so see that I'm going to,go add link list and I want to create,here the top level of my categories so,I'm going to call this list categories,and I'm going to add some links in here,this very arbitrary bit just gives a,sense of what these categories might,look like now at the moment these are,all linking to the storefront page and,that's because we haven't got any,product collections what I'm going to do,after I've created all my categories is,to go on and create collections and then,link them in but for now I'm just,creating all the categories of sale if I,go back to the navigation page I can see,I've got my category list here after,I've created my top-level categories I,want to create the subcategories that,sit inside them and to do that I just,create linked lists with each of these,titles so if I had to create the first,linked list and call it photography this,will logically sit underneath the,photography top-level category

After seeing the first section, I believe you have a general understanding of Categories Uncomplicated

Continue the next second section about Categories Uncomplicated

Menus Uncomplicated for Shopify, how to set up categories in your menu from scratch

Menus Uncomplicated for Shopify, how to set up categories in your menu from scratch

good morning this is a screencast about,uncomplicated menus uncomplicated menus,is an app that helps you organize a site,into categories range of products to,make it easier for your customers to,find them and then display that category,list at the top of every page as part of,your menu so start off by clicking on my,complicated menus and it takes me into,this the admin screen what we're going,to do here is progressively build up a,set of menus for our website and here is,what that website looks like at the,moment so this is my site,it's absolutely freshly installed from,Shopify so there is absolutely nothing,here in fact I'm getting this clue,message at the bottom from Shopify,saying add a product what I'm going to,do is show that we can change this menu,here into uncomplicated menu with a,category tree in it by using the app so,over here on the left hand side it's,asking me for my storefront password,it's detected that my store isn't open,yet and so I have a storefront password,this is not my admin user password and,said the storefront password is held,here in Shopify and it's configured,independently so I'm going to use that,password in all these dialogues as soon,as I take this password off and actually,launch my store then when I go back in,to uncomplicated menus it will no longer,ask for storefront password because it's,detected that that's not relevant,anymore instead there's just this,refresh but for now I'm going to,configure a storefront password because,my store is pre-launch as I imagine many,of my customers store are when they,first adopt the app right so the next,thing is to build up a set of menus and,complicated menus works entirely with,Shopify menus and the native menu,systems there's no special configuration,instead if I go and click this edit link,it takes me into the Shopify store,navigation which of course can be,accessed here through that I've done,menu and I can see that I've got two,menus configured at the moment footer,menu and a main menu what I'm going to,do is I'm going to edit the main menu,and start setting up a structure for my,categories at the top of that I'm going,to create an item categories,Shopify has a feature where if you,create a menu which has the same name as,a menu item it allows you to effectively,create a submenu so if I add a menu and,give it that same title cathegories I'll,put a few items in here such as its,ography technology film on TV and home,audio and I save that menu then already,I've created my top-level category which,is called categories I forget the,navigation you can see that here,category sits in the main menu at the,very top and then I've created my first,set of categories Photography technology,film TV and home audio I'm just going to,go a little bit further at this stage,and create a subcategory I want this,subcategory to be of technology so I'm,going to create a menu with the title,technology and I want my subcategory to,be called computers I'll save that menu,go back up to the top l

After seeing the second section, I believe you have a general understanding of Categories Uncomplicated

Continue the next third section about Categories Uncomplicated

Show sub-category icons in each collection using Shopify Theme Editor and 2.0 themes

Show sub-category icons in each collection using Shopify Theme Editor and 2.0 themes

good afternoon this is a short,screencast explaining how to use,category icons which are part of,categories uncomplicated here i have a,vanilla store what i've done in here is,i've installed some products i've,installed some collections and,navigation i've recorded a screencast to,demonstrate how to do that stuff how to,set up shopify in that way and what,we're going to do now is we're going to,install,a new application so i go through to,apps and click on customize your store,it brings me into shopify's app store,and in here i'm looking for the,categories and complicated app so i'll,just do a search for categories,and we're here at the head of the list,give that a click,i'm going to install the app,so that brings us through to this,permission page where we're being asked,to accept the permissions that the app,will be given as it's installed in our,store i click install app and it takes,me through to the billing page,and sets up the,recurring billing i'm going to approve,that subscription,i'm doing it in a test store so this is,only a test charge that means that i,won't be billed for it but if this,development store were to become a real,store then a new subscription page would,be opened up to accept a real billing,agreement,and that then brings me into the app,here we've got the getting started video,i'll hide that one away and what we can,see here is that there are currently no,categories refreshed so i'm going to,enter my storefront password i click,refresh and i'm going to bring through,the category list,this is pulling it from shopify,navigation as i mentioned at the start,of the call we've already got the,navigation set up as well as the,products and collections which is why,this is such an expedient and,straightforward process,so here i've got my category list i can,see that actually i've got,several duplicates of the same,categories this is all deliberate it's,something i cover in another screencast,if you'd like more information on that,and what i'm going to do is i'm going to,select from my,top level category as categories that's,my categories menu and it's going to,take a second to re-render,and then it's going to show me a smaller,list here which is just the categories,i'm interested in if i were to refresh,the page then it will rerun the category,advisor and it will tell me that there,are no duplicates because this is a,well-formed category list,so at this point ready to actually,install it into our theme and to do that,we can use shopify's theme editor these,new 2.0 themes have got a fantastic,shopify theme editor set up which means,that we don't have to go,messing with code or installing things,using liquid embeds or anything like,that instead we can go into the theme,editor and here we have a vanilla,version of our store just to give you a,quick sense of what this looks like if i,flick across to my storefront this is,what i'm starting with and i'm going to,go into the technology collection to,show that there's currently nothing,sh

After seeing the third section, I believe you have a general understanding of Categories Uncomplicated

Continue the next fourth section about Categories Uncomplicated

How to show or hide product counts in Categories Uncomplicated list

How to show or hide product counts in Categories Uncomplicated list

good morning this is a screencast to,demonstrate a new feature in,uncomplicated categories this is a,feature that arrives as standard and,uncomplicated categories if you like it,it's not something you have to do,anything to enable it's enabled by,default but I'm also going to show you,your way of turning off in case it,doesn't suit your site or your customers,so over here on the right hand side,you'll notice this is my category list,if I click refresh here it goes back to,the site it pulls an up-to-date list of,all your categories and now in brackets,you'll notice how these numbers these,are the product counts for each category,where a category doesn't have any,products in such as photography or,computers then there's no product count,shown and it's possible to show the,zeros there if you'd like I can talk,about that in a second but next to the,categories that do have products you'll,notice that there is a number this,category list as it appears on this,right-hand side is the same as the one I,see when I go to the front end of the,site so here I am on the laptops page,and you'll notice here on the left hand,side is the laptops with four products,in it if I go to tablets the tablets,collection has five products in the,desktops collection has three and as I,said earlier on the computers collection,currently has no products in the,purposes feature is to make it easy for,your customers to browse through the,store and get a sense of where your,products are especially because this,category can treat this category may,contain a lot of products in some areas,and only a few in others much like my,demo store here and that's quite helpful,to be able to show customers so they can,find the categories that are populated,now I mentioned that it's possible to,turn this off the way to do that is very,straightforward we go into the embed,code which of course lives in the theme,so I'm going to go into my online store,themes and edit the HTML and CSS I,showed in a previous screencast how to,add the uncomplicated categories liquid,to your theme and so that's what I'm,going to edit here so here we are in the,supply theme I'm going to go into,collection liquid and this is where we,made some changes I put the breadcrumb,in but that's not always changing today,the supply theme uses a snippet called,collection sidebar so I'm going to,scroll down to snippets and open,collections sidebar and it was in here,that we put in the uncomplicated,categories catalyst category list and,set up the way we wanted to be displayed,which was the default show path back,it's actually this show class that's,used to modify the product counts so if,I want to remove them I'm going to set,the show no PC and save that and now,when I return to the front end of the,site and refresh you'll notice that,those product counts have gone if I want,to rename all those product counts it's,very straightforward and this works with,whatever display I'm using for the shop,so if I take away show no PC so we're,ba

After seeing the fourth section, I believe you have a general understanding of Categories Uncomplicated

Continue the next fifth section about Categories Uncomplicated

Sub-category icons for Shopify, how to set up icons for your Categories Uncomplicated

Sub-category icons for Shopify, how to set up icons for your Categories Uncomplicated

good morning this is a screen cast to,demonstrate how to set up subcategory,icons within your site so here I've got,a demo site conveniently title,uncomplicated categories the demo site,has a menu I've already installed a,breadcrumb I've already installed a,category list in the left-hand sidebar,but the purpose of this screencast is to,focus on actually bringing those,categories to life if I go to one of my,top level categories such as technology,I haven't got any products in this,category because all the products live,within sub categories such as this sub,sub category called desktops or laptops,but when I'm in one of those pairing,categories at the moment they're a,little bit dead I could add products to,them I could add all the products from,all the sub categories and that'd be a,good way forward but alternatively I,could demonstrate within this body of,the page that I have subcategories by,introducing subcategory icons so to do,that I'm going to go into my theme I'm,going to check though i've already,installed either on icons uncomplicated,or categories uncomplicated so if i go,into my admin area here in apps I've got,categories uncomplicated installed I've,already set up my category list if you'd,like any help with that there's a,screencast separate screencast just for,that we've already set up my category,list I've said why top level it's been,refreshed then it's let's put it in as,categories at the top level it's going,to refresh yourself to rebuild things we,need so the next step from here is to,actually embed the subcategory icons,code in exactly the same way we did for,any of these other things so in the,previous example I talked about the,breadcrumb here I talked about the,category list both of those are embedded,within the theme so if i go into online,store themes i can edit my HTML and CSS,i'm using the supply theme for this,purpose and if i go into,you snippets collection sidebar then in,here I've already added the HTML,required for the category list what I,want to do now is work out the right,place to place my subcategory icons,there are a handful of different ways of,doing this I like to use a tool called,Firebug and so I'm using Firebug to scan,the page and to work out the structure,of my page essentially I want to put it,in above the product grid which is here,in grid a uniform this will vary from,theme to theme and so if you're not a,theme designer or a web designer you,might like to consult your web designer,for this alternatively I can show you,where it goes for for this theme and,because we offer a ten day free trial if,you want to experiment with it for your,own theme then please of course feel,free there's no charge if you uninstall,within the 10 days and you can see how,it lands for you right now I'm going to,go into my theme so in the theme I'm,going to go to my collection page which,that's the page where I really want this,to show up and I'm going to scan down,through the collection page to find the,place where those ca

After seeing the fifth section, I believe you have a general understanding of Categories Uncomplicated

Continue the next sixth section about Categories Uncomplicated

Getting started with Shopify products, collections and navigation to make categories

Getting started with Shopify products, collections and navigation to make categories

good morning this is a short screencast,to show you how to configure a brand new,store in Shopify this screencast forms,the basis of several other screencasts I,thought I would release this section by,itself for anyone who's interested just,in using the Shopify admin screens to,create the products collections and,navigation that you need to set up your,store from scratch here we have an,absolutely vanilla store there's nothing,in it whatsoever,I've created as a development store it's,got a title generally uncomplicated and,the process we're about to go through is,very much the same four or more or less,all of the uncomplicated apps we're,going to use Shopify's products,collections and navigations admin user,interfaces or have menu eyes to create,products collections of navigation this,section of screencast is designed to,show you how to use shop provides admin,screens they are a little bit,complicated we're going to move between,several different screens they are prone,to change in design because Shopify does,this it evolves its design it evolves as,you eyes and so if you're looking at the,screencast and you notice that it's,slightly different from what shop fire,using now the essence of it is very much,the same we're using it to create,product collections and navigation and,the while the screens might change a,little bit the essence is very much,going to be stable within Shopify those,are the basic elements for creating,products and organizing them so your,customers can find them,this is interface if you say is created,by Shopify all the changes are,orchestrated by shop fire it's nothing,to do with my apps but I provide the,screencast to try to give you that,holistic view make it really easy to get,set up for your store so shops tend to,feature loads of these elements or any,single shop will probably have loads of,products loads of collections loads of,navigation in providing this screencast,I didn't want to do this hundreds of,times I didn't think it was useful to,show you the same thing over and over,again so I'm going to create a few,products a few collections a bit of,navigation and demonstrate the principle,then I'm going to skip through the,repetitive bit where I do it lots of,times in order to build out the rest of,my store because I don't think it's,meaningful or interesting to show you,that but when you're creating your,products collections and navigation I,encourage you to do it a few at a time,there are some bad interfaces so we're,going to,you do use those betting spaces to,create lots of products for example but,when creating collections and navigation,I think it's a really good process to,create a few things,check it out in your front the front end,of your store your storefront and make,sure that it looks the way you want it,to look so when working with one of the,uncomplicated apps follow this process a,little bit and then move into the app,have a look at the impact and we're,going to do that in this screencast so,first thing is p

After seeing the sixth section, I believe you have a general understanding of Categories Uncomplicated

Continue the next seventh section about Categories Uncomplicated

Set default collections for products in multiple categories using short-form URLs and metafields

Set default collections for products in multiple categories using short-form URLs and metafields

good morning this is a short screencast,about breadcrumbs so here i'm looking at,a product page and what it's displaying,is a product inside the correct category,ie inside smartphones which of course is,nested inside some other categories now,i'm looking at this as part of my,shopify store and,i'm looking at a page that has the,long-form url so you can see up here,it's got the long-form url that includes,collections and as a result it's able to,identify which collection i want to show,this product in however the problem here,is that not all themes produce these,long-form urls here if i go to my front,page i have a link on here to view a,product,and link to your collection if i go into,the view product link i'll go to a short,form url you can see up here there is no,reference to the collection and as a,result it's dropped this phone into the,my best deals category not the category,i'd like it displaying displaying by,default,now the product here is being shown in a,collection that's not the right,collection and that's why the breadcrumb,isn't correct the issue is created by my,theme it's because my theme is using,these short form urls,now if i go into a collection,i,am using the long form urls and that's,because in this collection i've enabled,inside my shopify theme editor i've,enabled,the short link fix the shortlink fix is,one of those things i can do inside,the category breadcrumbs settings if i,go up here into the default collection,page i can show that for the breadcrumbs,that appear on these collection pages,i'm just going to select that same,collection we were looking at a second,ago,smart phones,four breadcrumbs that appear on these,collection pages if i go to,um the settings for category breadcrumbs,i can choose to enable the short link,fix and the shortlink fix um allows me,to take the the default settings of the,theme i either this theme produces short,links,really this stuff should be fixed in the,theme but i'm not going to get into that,in a moment it takes these short,links and it converts them to long form,links so if i click on a product from a,collection page it goes to the long form,link and that means that i'm seeing now,this doesn't affect seo,um because all of this stuff is being,done over the top in javascript the seo,benefits of having content in one place,are a little bit undecided duplicate,content can impact um uh your google,ranking and so one of the things that,people have been encouraged to do is to,have their content just in one place or,better to use the um,rel equals canonical tag and actually,identify all these long form pages as,going to a single page that's what these,themes should be doing but they're not,anyway we have the situation what i'm,trying to do here is just help you cope,with that situation in a really good way,that doesn't impact your seo,so,we've seen that the problem isn't a is,is all right for links that come from,collection pages when we're using the,sort link fix however that doesn't solve,it f

After seeing the seventh section, I believe you have a general understanding of Categories Uncomplicated

Continue the next eighth section about Categories Uncomplicated

Creating categories from Shopify pages

Creating categories from Shopify pages

good morning this is a short screencast,to demonstrate a feature of,uncomplicated countries and,uncompetitive breadcrumbs so here I am,in my store what I'd like to do is go,into the Shopify navigation this is,where we set up all the categories and,in previous screencasts I've been,through and set up categories what I,want to demonstrate is a feature where,we can create categories from,collections which all we have already,but also from pages so here if I go add,menu I'm going to call this called,synthetic ok to agree and then here I'm,going to put a few pages,and I'm gonna link those pages not to,collections I was previously but just,two pages so instead of selecting,collection in here and then going,through and selecting a collection as I,haven't previous class and going through,and selecting page and I'm just going to,point more at a single page for now,because it's just an illustration so,there we go this menu has four items in,it page one through to page four I'm now,going to go back and create another menu,for page two and the page two menu is,going to have a few items in it two,point one to point two and two point,three and again I'll link those three,two pages so again I'm making them all,just point at their bounce whoops at the,about Us page and we're glitching shop,further,there we go sorted and I'll save the,menu now to illustrate one point I'm,actually going to say that one of these,pages is a sub page this one I've,curated here called test page I'm going,to pretend that is my sub page and I,save the menu and then go back into,navigation so here in navigation I've,now got the two menus they're just,created synthetic category with all,those pages in it and page one start,page two with those sub pages in it I'm,going to add synthetic category to my,master list of categories so here where,it says categories that's the list I'm,working to I'm gonna edit that menu I'm,going to put the synthetic category I,think this small C category and we'll,link that to a page as well and just use,the about Us page safe okay,so I've created the menu items there the,next stage is actually to create pages,so here I did some linking all using the,about Us page which is a bit of a hack,just to get through that stage what I'm,going to go and do now is create a page,for each one of those and then we're,going to go back into the menu and you,know create another page over then after,that we're going to get back into the,menu and link those pages together,so those are my four top first level,pages almost her page 2.1 another page,page to point to another page page 2.3,and finally I'm going to create the top,level page which I'm going to call sin,the dick category save back into,navigation this time the navigation back,to those menus who created and I'm going,to edit the menus and link them to the,proper pages so here page 1 links to,page 1 page 2 page 2 and so on a few,glitches in shop fire this morning,I'm pressure that's well there we go,save that menu I'm gonna

After seeing the eighth section, I believe you have a general understanding of Categories Uncomplicated

Continue the next ninth section about Categories Uncomplicated

How to show multiple top-level categories in your Shopify storefront menu

How to show multiple top-level categories in your Shopify storefront menu

this is a screencast demonstrating how,to set up uncomplicated categories in,the menu navigation of your site and,this is will also include how to set up,multiple top-level categories to show up,in that menu on the uncomplicated demo,site I've already set it up so that I've,deployed the category list here on the,left hand side and you find information,on that in a previous screencast now I'm,going to focus much more on this main,menu all the navigation is sorted,through shopper wise main navigation,pages so if I go into my admin section,and then into online store navigation I,can see here all of the link lists that,make up my navigation now we've been,through this in previous screencasts as,you can see here this is where all the,categories are defined well you'll,notice at the moment is that my main,menu doesn't refer to any of my other,menus it it has this link to products,but products is just a link to a single,collection what I'm going to do now is,I'm going to change the main menu so,that instead of using products it,actually uses categories and I'm going,to make it refer to that collection,that's fine because it's the link name,that's important here,so what uncomplicated categories will,now do if I go into apps uncomplicated,categories is it will allow me to select,the bait the the root of my category,treat now that hasn't changed this,category is still descended from,categories these are the categories I,want to see on the site,however when I scroll down now you'll,notice that we're currently looking at,the old version of the links and that's,because I haven't clicked refresh so I,click refresh and it goes off to Shopify,pulls the latest version of those of,those navigation elements those link,lists so now when I go to categories I,can see that the categories menu is that,should be merged into the main menu so,I'm still got category selected as my,top-level and that means that this,category list is still going to appear,the same but it's also part of the main,menu now the supply theme is set up such,that if it finds a a category that,contains subcategories in the main menu,it will display,the front end of the site so if I go now,back into the front end you'll notice,that this where it was a single static,link for has now become a submenu and in,that submenu are each of the top-level,categories so by clicking on those top,couple of categories I'd go to that that,section of the site and this is thing,that this is something we've shown in,the previous screencast what I'd like to,do next is actually make it so that this,top-level menu features several of these,top-level categories if I go back to the,admin section then I'm going to change,my main menu to refer to some of those,top-level categories the ones I'd like,to include our photography technology,and film on TV so main menu here I'm,going to change what was categories into,photography and I'm gonna link it to its,collection so I have a collection called,photography I'm gonna add a couple

Congratulation! You bave finally finished reading Categories Uncomplicated and believe you bave enougb understending Categories Uncomplicated

Come on and read the rest of the article!

I am a shopify merchant, I am opening several shopify stores. I use ppspy to find Shopify stores and track competitor stores. PPSPY really helped me a lot, I also subscribe to PPSPY's service, I hope more people can like PPSPY! — Ecomvy

Join PPSPY to find the shopify store & products

To make it happen in 3 seconds.

Sign Up
App rating
4.9
Shopify Store
2M+
Trusted Customers
1000+
No complicated
No difficulty
Free trial