all right guys so in this video i'm,going to be showing you how you can go,ahead and,customize your debut theme within,shopify so debut theme,is the theme that all shopify stores,start out with,by default when you go ahead and start a,shopify store and if you haven't already,opened your shopify store yet you can,start your 14 day free trial by clicking,the first link in the description,so i figured i'd make this video because,debut theme,is one of the most commonly used themes,because it's the one that all stores,start out with and the view theme,actually looks,really good so right here we can see,that this is what debut theme looks like,when it's first installed with,absolutely nothing filled out,so we can see that we have where our,logo should be,we have a big header right here with,some text we have an image here,we have three images with text below,here we have,a uh empty collection and we have,another,um header type image right here another,wallpaper image,we have some testimonials and we have,three images down here,and then we have the footer so,right now we have a nice little template,but it's blank,so if you're looking to go ahead and,fill out,your um store using debut theme,the first thing you're going to want to,make sure you have is,a few key things so i'm going to bring,up a notepad and just make sure,because before you go ahead and start,the design process you're going to need,a couple things so the first one is,going to be a logo,so i assume you already have a logo at,this point if you're ready to start your,store design but if not,then make sure you get a logo first,because everything else is going to be,based around the logo,and then we're going to have a color,scheme selected,and normally this color scheme is going,to,be derived from colors from your logo,and typically,you're going to use one to two colors,to base your entire store around and,like i said these colors will be derived,from the logo and the next thing we're,going to need,is a couple wallpaper photos,so we can see we're going to need some,photos to go ahead and put back here in,this header,we need some photos to put back here and,this header as well,so if you have any large photos related,to your business,go ahead and upload them to your,computer or,put them all in one folder so we can go,ahead and,use them as backgrounds here and if you,don't you can use,different sites such as pixabay,to find free stock images that you can,go ahead and use,so let's just type in something like,fishing,so if you had a store related to fishing,you could go ahead and just,look for different stock photos here,or maybe you have something related to,yoga,or fitness you can type in a lot,of different niches depending on what,your store is based around,and you can use some of these wallpapers,to go ahead and put back here,now obviously i do think it's better if,you have your own,custom photos but uh you know not,everyone's gonna have that starting out,so if you don't you can go ahead and us
Let's move on to the first section of Statement Default theme shopify
Shopify CLI for Theme Development (How to use)
Shopify CLI for Theme Development (How to use)
hey everyone in this video we're going,to talk about shopify cli for themes,shopify cli stands for shopify command,line interface and is the latest,alternative to shopify theme kit,previously shopify cli was a tool that,helped users create and deploy shopify,apps but since the online store 2.0,announcements in june 2021 shopify have,extended the shopify cli to provide new,functions for theme development,including the ability to serve themes,locally,so in this video let's talk about how,the shopify cli works and how to include,it into your theme development workflow,before we get started talking about how,to use the shopify cli for theme,development i want to provide some,context here and talk about where this,tool fits in compared to the other,previous tools for developing shopify,themes,when i first started shopify theme,development back in 2019 there were two,tools available slate and theme kit,i believe it was theme kit that came,first but at shopify unite 2017 shopify,announced something called slate a new,build tool for shopify themes intended,to provide a more developer friendly,scaffold for building themes,slate did have some good points such as,the ability to split up scss into,multiple modular files and update css,changes locally but over time shopify,decided not to maintain the project and,eventually announced that they were,officially ending support for slate in,january 2020. therefore slate is not a,tool i recommend to anyone anymore in my,opinion the only reason to use slate is,if you have to i.e you have an existing,slate project that you're unable to or,unwilling to migrate that left us with,themekit a simple tool for uploading and,downloading theme files from your,shopify store making it possible to work,on themes locally,and now the latest option which is to,use the shopify cli for theme,development,chances are if you're watching this,video close to the release date you,might be using shopify themekit as,mentioned shopify themekit is a simple,tool for uploading and downloading theme,code from themes already hosted on your,shopify store we can do a one-time,download from themekit or a one-time,upload from themekit or we can run the,command theme watch and allow themekit,to detect and upload changes to the,theme as it exists on the shopify store,as soon as they happen for a full,tutorial on shopify themekit check out,the lesson in my skillshare class,shopify theme development how to build,and customize your own online store the,shopify cli by comparison is a bit,different with shopify cli you first,connect the tool to your online store by,running shopify login and from that,point you can begin to serve the theme,code you have on your computer locally,running shopify theme serve the cli will,take your theme code and generate a,development theme this development theme,will come with a theme id and a theme,editor but it won't exist in your,shopify store's theme library and it,will disappear after you run shopify,logout,running these s
After seeing the first section, I believe you have a general understanding of Statement Default theme shopify
Continue the next second section about Statement Default theme shopify
Shopify Dawn Theme Customization - Dawn Theme Design Tutorial (OS 2.0)
Shopify Dawn Theme Customization - Dawn Theme Design Tutorial (OS 2.0)
all right what's up guys this is jake in,this video i'm going to be showing you,how you can go ahead and customize and,build a store using the dawn theme with,shopify so dawn is the new default theme,whenever you set up a shopify store so,we're gonna go ahead and take a look at,how you can,set it up to make your store look good,so first thing you need to do if you,don't already have a store you can go,ahead and click the first link in the,description,and you'll be taken to this page right,here and you can just enter your email,address and go ahead and start your free,trial and we can go ahead and get,started setting up your store,so once you've went ahead and started,your trial,you're going to be taken to the back end,of the store right here and we can see,that by default the current theme is,going to be dawn so what we're going to,go ahead and do first is take a look at,the base template of this theme and then,we're actually going to start building,it out so i'm going to come over here to,actions and click on preview and now we,can go ahead and take a look at the base,skeleton that dawn provides us so we can,see here that we have a little,announcement bar up top we have our logo,we have our menu and we have the cart,and search icon we have a nice header,wallpaper right here along with a call,to action right here,we have another little,call to action with some information,right here we have,four featured products right here in,this section,and then we have a media collage that,includes a video,a collection and a product and then we,have a video section down here and then,we have a multi-column section which,includes three different text sections,right here and then we have the footer,so this is how dawn looks out of the box,and we're going to do a couple small,changes to it but mostly we're going to,be,building out this store using the base,skeleton of the theme to keep things as,simple as possible so with that said,we're going to go ahead and come back,over here and really quickly we're going,to take a look at the things you're,going to need to go ahead and build out,your store using this theme,so the first thing you're going to need,is a logo if you don't already have a,logo for your business or your brand you,can make one over here at logomaker.com,or you can come over here to fiverr.com,and search for a logo designer and get,one made for relatively cheap the next,thing you're going to need is some,wallpaper photos because we've seen,especially on the header you're going to,need some photos to use for that so,these are going to be pictures that are,related to your brand or your product,and if you don't have any of those,yourself you can go ahead over here to,pixabay.com or,unsplash.com to look for free stock,photos that are related to your product,or niche and then obviously we're going,to need product photos as well as,product details so this is something,that i assume you would already have,and then in this case we saw that there,was a video
After seeing the second section, I believe you have a general understanding of Statement Default theme shopify
Continue the next third section about Statement Default theme shopify
How to pass the Theme Review Process - Theme Store Requirements
How to pass the Theme Review Process - Theme Store Requirements
hey everyone jan here codingwithyan.com,today we are back with the second,episode of the build your own theme,series we are going to be covering what,gives you the best chances of getting,listed and also how to pass the review,process on the theme store so i hope,you're as excited as i am and then let's,have a look all right liam um yeah so,here we are again after an amazing round,of first questions the feedback has been,really good last time um yeah so what do,you think shall we answer a few more,today,let's go for it i'm super excited to,answer more questions,and you know share more insights on,everything shopify themes and the,shopify theme store,awesome sounds great and as you already,know today we've planned to dive a bit,deeper into the review and testing,process,getting your theme listed is quite a,challenge and if we can get the audience,or if we can give them the best chance,of doing so i'm sure they would,appreciate that,but maybe we should,backtrack for a second and talk about,the review process in general i'm sure,not everyone is aware of it um so would,you like to elaborate a bit,sure so essentially the theme store,review process is when your theme is,tested against our theme store,requirements to ensure that all,mandatory features are working correctly,and that the theme needs our performance,and accessibility,benchmarks so essentially the goal of,the theme review team is to help surface,as many bugs as they can so that when,the theme is published on the theme,store the experience for merchants who,install the theme is as smooth as,possible,so once a theme is submitted for review,which can be done via the partner,dashboard in the theme section,it will then be entered into a queueing,system for our theme review team to,evaluate and if your theme requires some,major changes that prevent us from,launching then you will receive an email,from our review team that contains a,private github gist where we will,outline the required changes that you,would need to make,we'll also include some notes some,general advice,and some you know opinions that we have,on how the theme could be improved,uh once you have actioned on the,uh advice that we've given um you know,if there's potentially some features,missing or you know some ux issues uh,you can make those changes and then,resubmit again,the same process through the partner,dashboard,okay so yeah maybe to summarize that,would you say the the review process is,to ensure that all the themes meet a,certain standard and that they are all,feature complete um just to give,merchants the best experience when,picking a theme from the theme store is,that right,exactly you know there is like a,baseline level set of features,and that we expect all themes in the,theme store to contain um and there's,also you know in terms of you know the,the performance and accessibility,benchmarks um there's you know a,specific high standard that,we feel all merchants are entitled to,okay awesome,and would you also like to
After seeing the third section, I believe you have a general understanding of Statement Default theme shopify
Continue the next fourth section about Statement Default theme shopify
Customize your Shopify Theme FAST | How to Design Shopify Store 2021
Customize your Shopify Theme FAST | How to Design Shopify Store 2021
let's be honest your store design,matters and if you have a really ugly,site people are just going to leave and,they're not going to purchase from you,so in this video i'm going to show you,exactly how to customize,your shopify store design,as soon as someone comes to your site,they only have about seven,seconds before they decide if they want,to look longer on your site or,leave so those seven seconds really,matter and design,matters when it comes to that you want,to make sure that your site is,eye-catching,and it really speaks to your ideal,customer so,how do you do this you really need to,pick out your shopify,theme and make sure that it works based,on what kind of,imagery you have if you have a lot of,really great big images,then pick a theme that's going to,highlight those but if you don't have a,lot of great product shots,then you want to make sure that you pick,a theme that's not going to be heavily,reliant on that,once you've chosen your shopify theme,then it's time to,customize it and this is where it's,important to create different assets,choose your fonts and colors,to make sure that it's appealing for,your ideal customer,so this is super important but a lot of,times people kind of overlook the design,step so i'm going to show you really,quickly how to,actually customize your design in the,back end of shopify for both your home,page,collection page and product page so to,get here you're going to click on,online store and then you'll see themes,there from the list,so now that we are on the themes page,you can see your live theme here,this is what your customers are actually,seeing whenever they come to your site,as well as your online store speed we've,done another video on how to speed up,your site so i will,link that in the description below and,in the info cards above as well,and you can also see the theme library,so you can,upload your theme if you've purchased it,somewhere else or you can explore the,different,theme options available so for example,if you click on,explore free themes you'll actually see,a pop-up of all of the different free,themes that are available here,the one problem with this is if you,click into it you can't really see,how the site overall looks as well as,how it looks on mobile you can just kind,of see the different styling aspects,so what i do recommend that you do is,actually visit the theme,store so if we just click on this here,you can see,the full theme store and this is both,free,and paid themes so what i like to do,whenever i'm trying to decide on a theme,for a shopify store,is i'll actually go to all themes up,here at the top,and then you can see the sidebar here of,sorting options so you can actually sort,through,and you can see you know based on you,just want to see,themes that are just for single products,so if you click on that,then it shows you just that product or,specifications on the right hand side so,you can better narrow down what kind of,theme that it is that you are looking,for,so if we u
After seeing the fourth section, I believe you have a general understanding of Statement Default theme shopify
Continue the next fifth section about Statement Default theme shopify
Customize your Shopify Email Notifications
Customize your Shopify Email Notifications
hi I'm Alma kin from curious themes web,development studio in Nashville,Tennessee and in this video tutorial I'm,going to show you how to customize your,order notifications in the Shopify,back-end,so I'm here under the notifications area,which you can get to by just going to,settings in this lower left-hand corner,and then choosing from there,notifications so as you can see here,there's a lot of different notifications,that you have both under order as well,as for shipping as well as of course the,customer in terms of inviting them,letting them create their password so,there's a lot of different options here,so they all have the default template as,well as the the design and the wording,that all of the Shopify notifications,have however if you want to have a,little bit more customized branding this,is my favorite way to do it so it's,actually using an app called klaviyo,and I think I'm saying that right but if,you go to their website it is que la vie,I y ou comm which you can see here and,I'll also put in a link in the,description below but you can sign up,for a free trial so they do have paid,email marketing options which would,actually have them be your email,marketing provider however and they you,know really connect in with your Shopify,store and do a lot of data stuff however,I don't really say that you have to do,that you can definitely use the free,trial here and customize your,notifications first and pull that into,Shopify without having to use one of,their paid plans so what you'll do first,is go into their website and sign up for,the free trial here and once you do that,once you log in I'm gonna go into my,dashboard area of klaviyo now or however,you say their name but you're going to,go to this left-hand menu called email,templates now I have a few already in,here as you can tell I really do like,using this software but what you're,going to do is you're going to click in,the top right hand corner to create,template now,the great thing about this is that it,connects directly with Shopify so you,can see here they have their basic,templates to let you stylize things but,they already have Shopify templates set,up so they have ones already set up for,order confirmation shipping confirmation,shipping update and order cancel so we,are going to just click on the order,confirmation and I'm just going to name,this test you can of course name it,whatever you want to and I'm gonna hit,create template so now it gives us this,overall design that you can see here of,you know setting up to put in an image,it's Auto populating the fields that are,coming in so anything that you see with,this dotted box around it like how you,see here the shipping name the date the,shipping address billing address all of,that is being Auto populated by Shopify,again this is for an order confirmation,so it'll pull in all of their order,information as well as you can see all,of the order details here and all of it,down here as well so you don't have to,really worry about a
After seeing the fifth section, I believe you have a general understanding of Statement Default theme shopify
Continue the next sixth section about Statement Default theme shopify
How to write an "if else" statement in Shopify 2.0 (Product Templates)
How to write an "if else" statement in Shopify 2.0 (Product Templates)
all right what's going on guys so in,this tutorial i'm going to show you,how i use an if statement in order to,solve a specific problem for a client,so,here's the situation,uh this client they're using they're,actually using shopify in a very unique,way they're,an agency and they have they provide,services like social media,ads all that kind of stuff,and but they also want to sell products,and they all they want to have it all,flow through shopify right,so,they wanted on some pages they wanted,there to be,um,the call to action would be going to,like a calendly link to schedule a,call and other links they wanted to or,other product pages they wanted to,you know have like a subscription so,like you could be on a retainer with,them as for their marketing services,um so yes you kind of just got to be,clever with how you set this up and,um if i if it were me running this site,i would probably do a little bit,different probably run it through,webflow or something and you know have,the e-commerce flow through here or flow,through webs,or just run it through webflow too i've,never done that but,um i'm sure it's doable to an extent,um,but,so for this back to the back to what,we're doing here,for this,specific case i had to create different,product templates for different,services that they have right,so for example one service had was for,seo so seo had specific you know pricing,right but then you wouldn't say like,um 500 bucks plus,um,ten percent of ad spend right or,something like that,um they want for for one of the services,they wanted to add that kind of language,on there but that specific product had,different variants,so the price had to be dynamic but that,language had to be the same,um,so,let me let me show you guys kind of,a little bit about like an example,um just so you can kind of see the,difference so this is like a base,product right so,for this for my dev store i'm using,shoes right to,show,um,the uh,to like demonstrate this,um i didn't want to use their stuff for,i basically just downloaded their their,theme and uploaded into my dev store,because i wanted to give them give them,some privacy,um didn't get their consent,for making a video about them,but,i learned something today so i wanted to,share with you guys,so,here you'll see this uh regular product,has pricing there you know there's no,additional text on top of it it's just,the,um it's just the the price,but,for,the product that i'm talking about,we have,the price but then we also had some,language that we wanted to add on as,well so,for this scenario i added um the use,case of like oh yeah but let's let's add,like we're having a sale we want to have,this language everywhere so,um you know let's add 20 off using,the code sauce,um,you can see that this is a dynamic price,because i,select one of the other variants you'll,see the price changes you'll select this,one and the price changes so,the way i did this,because,was by making two different product,templates,in shopify,so before i g
After seeing the sixth section, I believe you have a general understanding of Statement Default theme shopify
Continue the next seventh section about Statement Default theme shopify
The Best Shopify Theme In 2022 (Industry experts have voted)
The Best Shopify Theme In 2022 (Industry experts have voted)
which one is the best shopify theme in,2022,together with our good friends at,storetasker we wanted to find out,exactly that so over the last week we,interviewed various experts developers,agency owners from our network and from,storetasker's awesome freelancing,platform link in the description,and to our surprise we actually found,out way more than we expected so if you,listen to this you will not only,discover which one was the most upvoted,theme but you will also learn what makes,a theme great from a merchant's,perspective like what to pay attention,to when picking a good theme and you,will also learn what makes other,developers want to use your theme which,is a very interesting angle if you want,to build themes yourself and then,potentially sell them on the theme store,so here's what we discovered,all right patrick i'm super excited that,you're here today and yeah i actually,can't believe that we didn't do this,earlier um so would you like to,introduce yourself really quick,thank you jan for the invite um yeah my,name is patrick i'm the founder of the,agency eshop guide we are the fastest,growing agency in germany uh 2 million,in revenue 35 people,it's crazy people and we love shopify,and i'm happy to talk about the themes,that's awesome um okay maybe before we,get there would you also like to share,one or two sentences about the clients,that you typically work with this is,like smaller businesses larger,businesses yeah just,uh yes so we usually work with,existing businesses that,migrate to shopify,on woocommerce shopper or whatever,or with businesses who come,traditionally from a b2b space um and,who are dipping their toes into the d2c,world and just need their first job,rarely we work with real real startups,because that's usually,for them it doesn't make sense to work,with a with an established agency,because of the pricing,okay that's great and yeah as you know,today we wanted to talk about themes um,so you also do quite a few store setups,per month um so the question would be do,you guys have a favorite theme,yes um,so there are trends uh it's it's,actually quite quite funny uh from turbo,to prestige but now our favorite theme,is impulse um from archetype,um,the the story behind archetype is that,uh people who used to work for shopify,actually and um they really built the,themes,that you want them to build they they're,just awesome and they have good support,they've um they're,rather um fast in terms of performance,the themes they have a lot of um,features and they're usually,like right on top of the technological,curve what's possible with the themes,however at the moment because you you're,probably aware of that uh shopify 2.0,came out and with that um,shopify released a new standard theme,don,which really breaks records in terms of,performance and speed,and we don't see those numbers yet with,the um,paid themes,also not with imports,okay so yeah let me just wrap this up so,okay so you basically have,two favorite themes let's say impul
After seeing the seventh section, I believe you have a general understanding of Statement Default theme shopify
Continue the next eighth section about Statement Default theme shopify
How to create and use alternate layouts in Shopify themes using Liquid (Liquid Tricks)
How to create and use alternate layouts in Shopify themes using Liquid (Liquid Tricks)
hi this is care from Shopify in this,screencast we're going to have a look at,layout files I'm just going to open up,Safari I've got a test or kids test shop,set up already and a very basic starter,theme installed there's no styling going,on here and very minimal markup just so,we can see what's going on so I'm just,going to open up the editor by clicking,the three dots and edit HTML and CSS and,yeah we're going to have a look at,layouts so the layouts can be found in,the layout folder it's the first one,that you'll see in the sidebar here,you're not familiar with layouts the way,I like to describe them is there's a,master template for your entire store so,anything that's repeated throughout the,site such as your you know doctype head,maybe your navigation your side by your,footer can all live within the layout,file and what happens when Shopify,renders a page depending on the URL it,will know which type of template to,render within this layout file and it'll,do that when it encounters this,placeholder here content for layout so,let's say we're on a product page,Shopify would know this from the URL,structure it would grab themed liquid,and at the point where encountered,content for layout we'll go and grab,product or liquid or an alternate,template if that was specified as you,can see in this example there's quite a,lot going on we have some if statements,around the formatting of the title,you've got some descriptions we've got,customized ID and some classes that,we've created depending on the different,templates and so forth,apart from that you'll see that we've,got a header here with some cart,information a heading one just for the,shop name and some very very basic links,to output from a link list and what this,enables us to do is if we want to edit a,change then we'd like that affected,across the whole site if it's in the,layout file we only have to change it in,one place which makes maintenance very,very easy two things that you do require,to make a layout file valid for a theme,the first one is another placeholder tag,called content / header and this allows,the platform to inject things like,logins if you already logged into the,admin you'll have a bar that you can you,can log back into the admin from the,front-end and analytics and that kind of,stuff and as I said earlier the second,one,is content for layout this allows you to,position the provide the space therefore,the the templates from the templates,folder to be injected but what if you,wanted a different page a page that,wouldn't necessarily adhere to the,mark-up that you've got within the main,layout theme a code where you can,actually create an alternate layout file,in a similar way as you can alternate,template if you're in the admin here,it's very very simple to do you can just,go add a new layout and we can create it,from one that we've already got we've,only got one which is the default theme,so we will call this alternate and we,will create it so at this point it will,be identi
After seeing the eighth section, I believe you have a general understanding of Statement Default theme shopify
Continue the next ninth section about Statement Default theme shopify
Customizable Announcement Bar - Part 1 - Shopify Coding Tutorial
Customizable Announcement Bar - Part 1 - Shopify Coding Tutorial
hi everyone my name is sean welcome to,my first,shopify coding tutorial today we'll be,going over how to create your own custom,announcement bar,most themes nowadays come with an,announcement bar integrated already,however they're somewhat limited in what,you can do especially if you're building,this theme for our clients who might not,want to dive into,custom html they're much more,comfortable using the theme editor,shopify has,in this case this announcement bar you,can input your text,you can choose your color scheme and you,can input your link and,this is reflected right here however,there's not only these three options,so today what we're going to be doing is,creating our own custom announcement,bars i've created two here,free shipping orders fifty dollars plus,and spring sale ends today,we're going to be adding those and we're,going to be giving ourselves,a lot more options we can choose whether,we want it to be on the home page,we can choose whether we want the text,lowercase uh,uppercase we can change color bold text,and we can choose actually the height of,the announcement bar,and these are just a few customization,options we can add,we can add as many as we'd like but this,will give you a bit of an introduction,to shopify's liquid templating language,so if you're new to that,or you want to build this for your,client follow along,let's get started so first thing i like,to do is go into,shopify's theme backend going to online,stores and then themes,and we'll see our current theme here in,my case is called,dawn let's go ahead and click actions,and,click duplicate and that'll create an,exact copy,and place it within our theme library at,the bottom,i've gone to actions and rename and i've,renamed mine,dev theme custom announcement bar and,i've given it today's current date just,so i can reference it,once you've done that you've created a,duplicate of the live theme,and you've renamed it we'll go back into,actions and edit code,and we'll be brought to a page it looks,like this,here you'll see on the left all the,files that make up,your shopify theme one of the most,important ones is a file,called theme.liquid so let's click into,that and take a look,and you'll see if you scroll down a,little bit uh the basic,tags that you're quite familiar with on,every website we've got our head opening,and closing tags,we've got our body and,opening and closing html tags so this,page is rendered,on every single page of our website this,layout so it's very important,and within this we're actually going to,be rendering our announcement bar too,but we'll get to that in a moment,let's scroll down a little bit on the,left here and within our sections folder,we'll see,my theme comes with a file called,announcement bar we'll click into that,and take a look,here we have a bit of loops if,statements,uh switch cases and that's,all wrapping up some basic html and then,as bottom here,we have some schema as well we'll go,into what all this means in a moment,but we're goi
Congratulation! You bave finally finished reading Statement Default theme shopify and believe you bave enougb understending Statement Default theme shopify
No difficulty
