Designing A Clothing Store With Dawn Theme OS 2 0

hello everyone, christian, here and today we're designing a clothing store from scratch and we'll be using shopify's newest theme, dawn, you know, the one with all the fancy new juicy features from os 2.0. yeah, let's get started now. if you didn't know, dawn is the first free os 2.0 theme released by stopper5. now, if you really don't know, online store 2.0- it's the future. i made a video about this so you can check it out right here. dawn is a flexible theme that includes an adaptable layout, site-wide cross-selling sections and media optimized product pages. with this new theme, you can add sections to every single page, which is pretty awesome. now in this video, we're going to go over the home page. so we're going to design the home page from scratch for a new boutique called shibby's boutique- completely fictional, but yeah, step number one: install the theme. so now that we're here in our totally nineties kid shop, what we're gonna do? we're gonna use totally nine. it's good, but we're gonna still make shippies inside of toilet 90s kid just for the purpose of um convenience. we're gonna go to online store under themes. we already have it installed already, but we're gonna go through the process. so you know, we're gonna click on explore free themes and then should be probably one of the first ones. so you'll see, dawn, it's free and it's from os 2.0, so that means they have some of the newest and greatest features that shopify has released. now you'll see, like some of these old other ones don't have the os 2.0 um badge, so you want to make sure that you get that one. that's the one that we're going to be designing on and moving forward, and i would i highly recommend to start using some of these os 2.0 themes and if you have an older one that you paid for, you might want to check with the back end of your website because you might have the opportunity to upgrade to the new os 2.0. so everyone's going to be upgrading these and i believe by the end of this year everyone should have os 2.0 themes on their store. we click on try theme and this will automatikally download the theme to our store. that way we can manipulate it and start using it. you can have a bunch of different themes installed on your actual backend and dashboard, and that's what we're doing. so right now we have this live theme, which act. it's actually totally nice kid, but what we're gonna do is we have this theme live library down here, and these are all the themes that we have installed right here on on this totally united skit website, and what you can do is you can customize these themes and you can make them your own, and once you're ready to publish that, then you go to actions and then you publish and that will bring this partikular theme all the way to the top and put this one right here down here at the theme library. so just keep that in mind when you're creating new websites. all right, so since that one's still installing, i'm gonna go and manipulate this one. oh, never mind, it just added. so we're gonna actually click on customize and this is where we'll start designing our website. now, when you start designing on shopify, you'll see here that on the left hand side you'll have all the sections broken down and in here you'll have a preview of what your store looks like right now. up here you can actually change it to the mobile version or full screen to see how that really looks, and then here at the very top you can change between all the pages or templates that you have that you can manipulate. for this partikular tutorial, we're going to go over the homepage: how to design it and how to make it look good for a clothing store, all right, so we're going to start from the top and go all the way through the bottom. right now, every time you install a new theme, it will show you sort of a different sections, right, all with just dummy content. some of your content will actually show up in here, but for the most part it's going to be sort of this black and white, very wireframe looking, just so you have an idea of some of the sections that this theme actually has. right, so you're not starting completely from scratch. you at least have something to look at in here. but we can actually get rid of all that and start from scratch or manipulate some of these, because we'll probably end up using some of these, all right, so, like i said, we're gonna start from the top and we're gonna go with the announcement bar. so in the announcement bar- uh, keep in mind that all these sections now are broken down into- um, these care looking things, so that you can actually break it down a little bit further, right, so there's an announcement bar. when you click on announcement bar, it doesn't have any other customizable settings, but some of these sections actually do, so you want to keep that into consideration. for example, this announcement bar has this right here, which i believe- yeah, it's just a text block, essentially- so that says welcome to our store. for this partikular store, we're going to be offering free shipping. so i'm going to actually add that to the very top. but some of our recommendations is: don't do just free shipping for all orders, do free shipping starting at some kind of price point. so we're gonna do free shipping on orders over 95 dollars. all right, so now, color scheme for this partikular section. we have different options in here. i will show you actually where to change the color scheme. um, because for this partikular theme, it only allows you to change it between these, and the color scheme is somewhere else right here within the the editor. so right now, let's just leave it like this, just to see how it might look. i actually let's go. i think this one, yes, a little grayed out, so let's do that. um, you could also add a link if you wanted to, but we're just going to leave it like that. this is more of an announcement, as you can see here. what i was toking about earlier is that you can actually add more blocks, more content to these sections and you can manipulate them a little bit better, where you might be able to now move things around. so this button: if we go right here, you can actually move that button on top of the actual heading. you don't really want to do that, but, um, just kind of let you know that you have more flexibility, more freedom with these new os 2.0 themes and, depending on how the thin theme builders build these themes, you might be able to do even more things. so this is sort of the tip of the iceberg when it comes to designing stores. all right, so now that we have that, let's go into the header. header typically holds the navigation and the logo and some of the search and cart options here. so for this one, we are going to leave background one, which is the white, and then we're gonna select an image, and i've already uploaded a few things in here. so you have the logo right there. now that logo looks very, very small. so right here we have the option to make it bigger. i think i want to do 220.. yeah, that looks good, and then we can also manipulate where the logo goes. um, for this partikular store, because we're not going to change this um, i'm going to leave it right here on the left-hand side, but if we start to get a lot more navigation items right here on the top, then it might be a good idea to move that logo to the top, and i believe i can do that. yeah, top center. so that gives a little bit more room right for more navigation items to um be right here underneath the logo. so it's less about aesthetiks and more about, um, what's more functional right for your website. but as a maybe another recommendation would be on your navigation, i would highly suggest maybe not having your home link, like it's like, right here, and then collections and chop. if they're going to your shopify store. more than likely all they want to do is shop right. so i would encourage you to just add some of your categories so you should have something like new arrivals, dresses, tops, shoes, bottoms. so all of your navigation at the very top should be products that you're selling, not necessarily the about or contact or home, home.

HOW TO SET UP DAWN THEME MEGA MENU IN SHOPIFY | TUTORIAL 2022

welcome back graduates. today i'm going to teach you how to change your ugly old dawn theme menu and give it a snazzy, fancy mega menu. now, the reason why we like mega menus: they're just beautiful. they make things a lot easier. it allows your customer to actually go find it, find your, your menu and actually find the products you're looking for all the time. we see these stores where they have these massive menus, all these different multiple menu items on their store. it's, it's all stacked and it just it's very confusing and annoying and nine times out of ten your customer will look at your menu. if it's that complex and annoying and they're just gonna leave. they're gonna go find somebody else, because you know everyone. what's the one thing that we don't have a lot of? that's time. we don't have a lot of time. that's the most valuable thing on this planet is time, and your objective is to save people time, deliver the products that they actually want without causing any friction, any disconnects, nothing like that. so, anyways, nothing. enough of me rambling about how amazing mega menus are. we're going to get right to it. so, firstly, what i'm going to show you is how to structure your menu so that way it actually works with this mega menu system- a little different than other apps out there- and themes. this is going to be built into your store, so, without further ado, let's get right to it. so this is the admin backend. you should all be acquainted with it by now. if you're not, why are you watching this video? so, anyways, we're going to click on online store, we're going to click on navigation and then we're going to go to the main menu, because that's that's what it is. it's the main menu. now, one thing i want you to take note of is you have these. so when i'm i'm going to be toking, i'm going to be saying i'm saying things like you know, parent, child, grandchild. you're probably going to think i'm toking about your family. i'm not, i swear to god. i'm toking about this. these are called link lists and they have a parent item, they have a child item and then they have grandchild, child, children items. again, it's tongue twister, right. so: parent, child, grandchild. so now the first item is the mega menu. the second item is brew by type. the brew, the trio right here, and then you have these items right here. so now we have our mega menu. we have brew type. so here's the, the parent, the child, and then here's its grandchildren, right. so now, where this is how you have to, you know, structure things, you can make this clickable right here, where it goes to your home page, and this item would actually go to. well, these would actually go to products. we don't have them set up like that. they're just examples for you. um, now let's let's figure out how. how are we going to change this image when, once, we actually have the mega menu capabilities? so what you want to do is you want to go to settings, click on settings. i want to show you we're going to change this image out to something else. so, once you go to settings, you're going to go and find files, and this is where you can upload all kinds of different files: pdfs, images, whatever you want. now let's change it to, let's change it to this, we'll change it to this image. so now we're going to do is we're going to go and edit again. let's look at this real quick. you see how there's browse latest arrivals, and then there's an image. you're going to see how that works right here: browse latest arrivals and you can use an emoji, whatever you want here, and then you use the pipe character. you always have to split up the items- the image and the title- with this pipe character. we're going to replace this last url with the new link that we just copied over from the files. i'm going to paste that in, apply changes and make sure you save. i re recorded this video earlier trying to figure out why my image wasn't updating. i never hit save, so this is like take three of this video. alright, so now let's refresh. it might take a little bit. sometimes it does. yep, it takes a little bit unless i pick the same image. could i pick the same image? all right, so that's so. the image should should look like that. let's refresh this again. menu. all right, there we go. so it updated. it's that easy. now let's go update the title. i'm just going to update this and show you how this works. so, um, browse latest. i'll just get rid of browse latest and you know what we'll do. we'll do this. first off, let me copy this, because i do like outlook. i'm going to get rid of the word arrival, so i'm going to change this to assembly my changes and again hit save. there you go, browse latest. so, just like that. it's really easy. i know it might look like an extra step that you have to go through. trust me, it's well worth it. so now you understand the structuring of the menu. you've got your- let me apply- hit save, you've got your parent mega menu item right here, which all you do is just make a menu like that. then you got your, your, your, uh, children and then, underneath those, you got your grandchildren. so this is basically the main title for this menu. this is the subtitles of all the different items in the menu, and then these are all of the element, all of the items beneath the sub items. really simple, it's not that difficult, if you do. if you do have any issues, as always, guys, make sure you comment below or you can reach out to us through our facebook page, facebookcom. forward slash ecom graduates or join our group, ecom graduates, or you can send us an email support ecom graduates dot com. but easiest way is just drop a comment below. also, make sure you like, comment and subscribe on these videos for us to keep making this amazing content for you all. right? so now we're going to get into the actual code, part of how we're going to go and actually add this mega mini to our, our store. so right now we have this ugly looking menu. it's all kinds of broken. don't freak out. this is. this is completely normal. we're going to fix this in literally just a few minutes. so close out of this. we don't need this anymore. and i'm going to close out of this. now we're going to go, click on online store, find that- your theme that you want to edit. i'm going to edit this one edit code and now what i got here is: i have you, when you download this file, you're going to get an html file. just open this up in your browser. very easy, just open, download the file, open it and you're going to have a tutorial right here. so, and all you got to do is follow along. so now the first step is find sections header, right? so let's close out all these folders like we normally do, and we're just going to go in sections and we're going to find header. we'll find sections header. so now you want to find the style tag and then we're just going to copy all this. so you're going to find that closing style tag right here, which you can't miss it. it's right here, usually around around line 67. we're going to delete that. we're just going to paste. paste the code that we just copied. paste, all, right. now the next step, next step, next step is: we have to find this. so we're just going to copy this and, just like the last video, i taught you how to find items or find you know string of text inside of the editor. you just do ctrl f or command f and then you paste the what you're looking for. now, be careful, you don't want to, you don't want to go and highlight this for this one right here. you want to grab the top, the top, most unordered list tag, right there. okay, we're going to highlight this ul and let's go and grab the code we actually need right here and we're just going to copy all that right click, copy back over to here and let's just uh, delete this right now. we're just going to paste what we just deleted and replace it with this. now what we can do is: uh, now the mobile version of this won't be functional if you hit save right now. so i'm going to hit save and show you. i mean not the mobile version, the desktop version won't work, so let's refresh. you've got the mega menu, so the desktop version is not working. let's see what it looks like on mobile: it's coming toget.

More:How To Make $500 A Day Online At 15 Or 16 Years Old

HOW TO SET UP DAWN 7 THEME MEGA MENU IN SHOPIFY | TUTORIAL 2022

welcome back graduates. now, today I'm going to show you how to set up and configure your mega menu for Don 7.. the reason why we are having this video is because Don 7 has kind of changed the way it's laid out and their and their code and and everything. so it is different than the older versions of Don. so if you do have an older version of Don, go check out the other menu on the other Mega menu- how to install that. but for this, this is specifically for Dawn seven. now there are three simple steps for this and, as always, we give you a readme file, a zip file that has, you know, the readme file installation guide, and then also the RTF for you to just copy and paste. so let's get right into it. so what it's going to look like is this is the dawn 7 version right now and it's going to be exactly the same as before. however, the only difference is how to install it, because Don has changed up so much. now when you go in here, you have the, the image. here it's pulling the image and a link and as well as on mobile, just like this. so what I'm going to do is I'm going to get a clean version of Don 7, and you can simply do that by going into free themes and Dawn and add it to your theme Library. so that's what I'm gonna do, just to show you. everything's all nice and clean. there's no Snippets, no other features. so now Don 7 has been installed properly. it's all nice and clean and there's no mega menu. so to check that out, we're just going to go to preview and right over here it looks weird and it looks wonky. so let's go into your edit code, as always, and the first step of the readme file is gonna. it's gonna tell us to add the EG Mega menu image Js from in in my assets. what I'm going to do is go into my code here so I can close out of these code here, and I'm going to go down to my assets and I'm going to add a new asset, create a blank one and select JS. now the file right over here, we're going to provide it for you and all you're going to have to do is open that. so I'm just going to copy this foreign and I'm also just going to open this up, copy and paste, and I'm all set with that. so the next thing I'm going to do is go into my theme dot liquid and right under the closing body tag I'm going to add this script right over here, I'm going to add the script and I'm going to go into my themeliquid- at the very bottom- it's usually at the very, very, very bottom, so right after the end, if I'm going to paste that and I'm gonna just make sure there are no spaces with everything like this and I'm going to click save. now the next step is going. I'm going to go into my customizer and from here- this is a crucial step- I'm going to go into my header right over here, and I'm going to select desktop menu type and I'm going to select Mega menu. so once I click save, it should start populating the image, which it does, which is great. now, if you haven't had this, if you haven't done this step yet, you have to go into the navigation so it automatikally pulls in this image, because I've already had a set. but if you don't know, you're going to go into your navigation and it's going to be under the second nested menu. so this is the first, this is the second and under here is the third: parent, child and grandchild, as what they say. so under the um child you're going to have in your readme file some kind of title, a character pipe and then the image URL, an example of this: latest arrivals. you can have Emoji after that, but you always need the character pipe and then the tik and then the link of the image here. that's what I did right over here. and then, going to going into your theme editor, you assign that menu with the mega menu that you created with that link and you sign it and then it should populate just like. so, going into here again, I'm going to preview and it should work just like the example I showed you on the first right here and there you go. I hope you like this video. I don't know, this is again specifically only for Dawn 7 installation because Don has changed the way it laid out for its code. so I hope you like this video. please make sure to like, subscribe and share so we can make helpful videos like this.

More:LinkedIn Company Pages: How to Create a High-Converting Page

Shopify Store Best Practices [Dawn Theme]

Well, everyone Christian here- that you know beautiful design and excellent user experience can increase the perceived value of your Shopify store. I want to go over best practikes, Why they actually matter, And I'm actually going to show you hands on how to get it done. on the dawn theme, Stik around, It takes point zero, 5 seconds for a customer to decide if they're going to shop on your site or not. That's insane if you think about it. So it's very, very important that you are doing everything in your power to stand out and make a great first impression. Now we're going to categorize best practikes into four main categories that define a great e-commerce website experience. Number one is going to be esthetikally pleasing- The be esthetikally pleasing category. So, first off, your Shopify store needs to impress the customer right. So a good visual appeal is a must If you're going to capture their attention. and 50 milliseconds. So what are some best practikes to ensure that your website is esthetikally pleasing? Well, I'm glad you asked. The first one is to display your product photography with a clean white background and also include lifestyle photos of your products being used. That's like the gold standard. You don't necessarily have to follow it verbatim, but I'm telling you these are best practikes. So maybe you don't have a white background, maybe you have a slight gray background, maybe you have a pan background. The important thing here is to make sure that your photography is on point, that your photography looks great, crisp. you can actually appreciate the product. We've actually toked on several videos on different examples of different websites who are doing great product photography and they don't necessarily follow this white background- gold standard. Now, if you want to follow this, then the number one app that I would recommend is removed Dot be, as you can see. remove that bag, remove the image background of any image, 100%, automatikally and free, if you do want to use. removed the iPhone, iPhone for iPhone 14 or iPhone 16.. I was just came out with an awesome feature that if you take your photography with your iPhone, you can just tap, hold it will cut it out for you and you can pace of whatever you want. So there are ways to clean up your photos very, very easily. And again, obviously you want to have awesome lighting with all your photos. but cutting them up, putting them in some clean backgrounds- Again, gold standard- Best practike number two is to limit your website to two main colors. Use them wisely Now in order to pick your colors. you want to make sure that you have some sort of either brand guidelines or brand kit for your whole company, Right? It's not just coming up with a logo. A lot of times, the logos are just black and white and they don't show a lot of color. So it's very important that you pick some sort of color palette that showcases the personality of the brand, It showcases who the brand really is and it helps tell the story of your partikular brand. Now, if you don't have a color palette in place, you could have up to five colors tiknically, But what we're telling you right now is used to make colors as sort of your go to when it comes to the website. You don't want to necessarily plague your website with a bunch of different colors. Just use two and use them wisely. When I say using wisely- and I've toked about this before- where the at the car button and the back button are super, super important, That's where you want to want people to pay most attention to. So it's important to for those two buttons- the at the car or maybe the car button- to be very unique, Right, And not use that color anywhere else on the website. If you have two colors and we have black and white and then two, four colors. one of those colors you want make sure that that's the unique color that you use for your at the car. But if you don't have colors picked out, then I would suggest to do something like coolers. coolers that SEO and super fast. You can just make some color palettes in here. You can go to the palette generator here just by using here Spacebar is tap, and you can actually see different variations of different color palettes. things that look good, actually kind of light, that that looks nice, Right. And even if you don't necessarily like all these colors like they are, you can delete some. You could add more if you wanted to. You could also just slightly change the hue or the different shades of that partikular color. So maybe you like this one a little bit better and this one actually looks better over here, right? So overall, that's what you want to do. You want to get a color palette. Figure out what your brand colors are, Use them wisely on your website. Now, as with colors, it's best practike to also stik to two font and create a hierarchy between them. There is a link here that I'm going to include in the description below, It's from Canva. So if you're not using Canva, Canva is a great tool. If you can't pay, you can't afford something like Photoshop. Canva gives you a blog post here with the ultimate guide to font pairing. and you may be thinking like Christian, I'm just trying to sell products online. I don't care about any of that stuff, But at the end of the day, it's just important to know the information. You don't necessarily have to maybe take action immediately, but just know the information, know the anatomy of typography, know how to properly put two different fonts together. I mean, as a solopreneur or as an entrepreneur or just starting out, you have to do a lot of these things right. So if you get just a little bit of knowledge on what looks good together, you may not have that creative design eye to see at a glance like that looks good, That doesn't look good. But if you just have a little bit of knowledge on how to put it together and make it look good, that's all you need. So that's the only reason I'm giving you this resource here: Just to make sure that you at least know a little bit so that you can put those two fonts together. Now let me go into here on the dang theme, because I did say that I wanted to show you here on down theme, And what we're going to do is we're going to go to theme settings And within the theme settings, that's the colors in typography are going to be right in here. So, colors: if I click right here, you'll see the primary colors. We have solid button labels. That's that one color that I'm telling you. You need to make sure that it's very unique. We also have different accent colors. We have accent gradients. So, for example, if these two colors look good on a gradient, then that may be something that I use for for my store, So you can actually set up different gradients in here. Now we also have secondary colors, so you have a lot of different options with background colors, background links, text color, etc. Number one thing with color is to make sure that they're that you're paying attention to the accessibility portion of it, Right. Not everyone can discern different colors, So it's important to make sure that you have good, high quality contrast between text and background color so that it's very easy to read text on your website. That will be my biggest advice there. Now, same with color typography. You can find it right here And then, with typography, you have headings and then you have body. So those are the two fonts that you'll be able to pick on on your website. Now in this guide, it toks about what looks good as far as headings and and the paragraph, or the body copy as they call it here, And that's what you want to do in here. You also had the opportunity here to change to the hierarchy right. So the hierarchy is like: headings are usually bigger, body copies each a little bit smaller. So you can change that in here and you can also change the font by just going through their library. Or if you know a partikular font that you use for your company, then

What Is The Best Free Theme For Shopify? Colorblock Vs. Dawn

color block or dawn? which free shopify theme should you be using in your store? let's find out. yo, what's up everybody and welcome back to the channel if you're brand new here. i want to welcome you and say hi. my name's carrie, i'm the founder of shirt school and i created this channel to bring you the best strategy, secrets and hacks to grow your online t-shirt, apparel or print-on-demand business. you're probably already aware that shopify has transitioned fully over to online store 2.0, which was a complete overhaul of the shopify system. they released brand new themes and also recently they released shopify editions, which was this huge collection of new features which i want to tok about more on the channel. but when they initially transition over to online store 2.0, they put out a few free themes, new free themes. i've toked about those on the channel and i've told you that one of my favorite themes is called dawn, which i've been using in my stores and i've been recommending to most of my students to use that dawn theme. well, a little while after that, they came out with a few more free themes and one of those is called color block. so i've been eager to review this theme on the channel and kind of put it up against the dawn theme because, according to shopify, they say color block is a good one to choose for apparel brands and, as you know, i like to tok about apparel brands. it's what i've built in my own businesses and what i help my students with. so today i want to tok about color block. is it better than dawn? is this the one you should be using if you have an apparel or a t-shirt or a print-on-demand business? so that's what we're going to dive into today. so, looking at the free shopify themes page, what? what themes they have right now? you see studio dawn, which i've toked about a lot, sense, refresh, taste, crave. color block, which we're also going to tok about today, ride and then craft. so, as i mentioned, a few of these came out initially and then they added more and most of these are- uh, they're positioned for certain categories. so if you have a beauty brand, you know you might want to go with the one that's really designed for beauty, like sense, this one, you know. you see hardware and automotive, health and beauty, pet supplies. so these themes are designed for certain types of stores, to be better for each of those. so the two that we really focus on in clothing are dawn, and then this color block theme. so i want to break those down. so let's start with the color block theme. as we go just to their uh page here, that kind of shows us what color block is all about and explains it. you see some of the main features right here: confident and colorful design, so it's very colorful, ideal for a large catalog. so it's got this kind of menu system and it says it has expanded menu navigation. so if you have a lot of products, if you have maybe a big apparel store, this might be a good one to go with. and then you see advanced customization options. so that's flexible design, customization settings to achieve your desired vision. yada, yada. you get the point. as we scroll down here we see a little bit more right here. this, as i found, was actually just kind of standard throughout the themes. if we go over to dawn theme just to kind of compare and contrast, obviously you see some different pictures and everything here. the main things that it's going to highlight: chic and minimalist design. media, forward product page, so it has large media to help your customers see what the products look like. that's been a topic of conversation in our community. and then the advanced customization options is actually the same exact thing that it says on the color block theme and if we scroll down, this is the same as what we see on the color block theme. so even though it says features, they're kind of just copy and pasting the same text here, so right on these pages. you know, the biggest difference here is what that you're going to see just up front is you're going to see that the design is different, so like one is more colorful where one is more minimalistik and chic, they say, and then you're going to see that the color block- ideal for large catalogs, whereas the dawn theme might be, you know more. they're highlighting kind of the media forward product page where there's bigger pictures and more media. i guess you could say, and we'll tok more about that. the next thing i want to do is i want to look at their demo stores. so here we have the color block demo store- i'll actually go back over to the main page- and then we have the dawn uh store. i'll go back over to the main page. can i give you a free guide that will help you build your shopify store in a matter of just a couple hours? we've put together a cheat sheet that has 13 steps that you need to go through before opening your shopify to the public. it's extremely helpful and we've had thousands of people download it and the best part is it's completely free. if you'd like to download that, that shopify cheat sheet, just go over to shirtschoolcom cheat cheat and get your copy completely free. now one of the things i think can be a little bit deceiving here when you're looking at these free themes- i've toked about this on the channel before- is that you know shopify has professional designers that they're paying a lot of money to design really beautiful demo stores and oftentimes it's hard for us as smaller shopify sellers to make our stores look as good as these, because you know the shopify store builders, that they have the pros. number one, they're really really good at making these look good, but number two, they have really high-end media like this. you know really professional pictures on both of these. you'll see that the pictures are just really professionals, professional and one of the big differences between a store that looks like junk and a store that looks really good is simply just higher quality photos. you know a more professional logo and some of the color selections, so i think that's something to consider that. you know, even though these stores are beautiful here on the demo stores, you know i wouldn't necessarily expect your store to look that beautiful unless you're really a pro designer. that's not to say that, you know you can't make your store look awesome, but i just want you to keep that in mind, that it's always a little bit deceiving to compare these pro stores. so if we look at these two stores, what's the difference? as you see, color block, as they mentioned, it has these really vibrant colors, uh on it and so that's the biggest difference. you see, like these pastel kind of colors, yellow and this kind of, uh, blue and this pinkish kind of color, uh, with just these really nice color blocking. obviously, as the name says. you know, that's one of the things that is different. over on the dawn theme, it just looks more, i guess, modern and, like it said, chic or, you know, minimalistik. you can see it's more, more kind of like high-end fashion maybe, you know, has that kind of look on here. so that's really the difference that i see right, right off the bat. um, i do want to go over to the product pages, because the product page is one of the most important uh places, um, in your entire store. it's where most people are gonna land. if you're running traffic like paid ads or even from social media, you always want to be sending people to your product page, and so i want to look at the difference between those two. so let's go over to maybe like sandals and click on one of these and look at how they differ. now these are the demo stores, and we're gonna dive into the actual editor here in just a moment. um, but just looking at the demo stores, um, here's kind of the difference is that on the color block theme, you're gonna see this drop down menu and you're going to see only an add to cart button and you're going to see some more of that color blocking here with like kind of this light pastely looking color, right. if we go over to the dawn theme, you're going to see these large photos- right, they really want to accentuate the th.

Shopify Online Store 2.0 Tutorial: (Shopify Dawn theme tutorial + Metafields)

today's video is about the biggest and boldest update in shopify's history ever. this update is actually an extremely good news to anyone who uses shopify, because it allows us much more flexibility and it gives us the ability to customize our stores way better and easier than before. hi there, i am rehab, and on this youtube channel, i share with you videos related to e-commerce, entrepreneurship and more, and today's video is about shopify online store 2.0 and how you can use this update to enhance your store and make it look better. this video is a step-by-step tutorial on how to use this new update and how you can profit from it. but before jumping to my pc to start working on this new update, i just need to tell you that, up until now, not everyone has this new update available on their stores. also, it's very important to know that all shopify themes will be updated in order to be compatible with this new upgrade of shopify. so just wait for it, and soon it will be live on your store. to be able to use this update, you must choose the new theme provided by shopify and it's called on, and it's a very friendly user theme. we are going to use it right now, but you have to know that all of your themes will be updated in order to be compatible with this new upgrade from shopify. so soon you will see a new update of your theme and you will need to use it in order to be able to use the new shopify online store 2.0 update. so i'm here inside of my developer store. i have added some products, created some collections in order to show you how you can use this new update. so the first visual upgrade you will be able to see is the difference in the theme editor. it's a big deal because if you were using this before, you will notike the difference. so here i am inside of the home page, and we are used to the idea that home pages are usually highly customizable depending on the theme you are using, but usually on all themes the home page is highly customizable. you can add sections, you can add images, text, whatever you want, and usually you can do a lot on this page. however, this case doesn't apply to other pages. so before this upgrade, we were able to modify the home page as much as we want, but we weren't able to modify the product pages a lot or the collection pages a lot, and now we are able to do that. i'm going to tok about product pages and how you will be able to customize them now, but first let's start by taking a small tour around the new shopify editor dashboard and see how things are now way different. so here i am, inside of the home page, and these are the default sections provided by the theme. if i go in here here, i start to see the difference. okay, this is not. this is not how things used to look inside of the editor. so first, if i scroll up, this is the first section i'm changing. i'm changing the image banner, so i can add heading, i can add buttons and i can also add a text. sure, here, this is my limitation: i can add only three elements. okay, so let me go to buttons, for example, to see if i can add two buttons. so this is the first button. i can actually add a second button, which was not an option allowed by many of the shopify themes. so, going back in here, what else can i find? if i scroll down in here, i have the feature collection. if i scroll down in here, i have the image. also, the same idea. if i want to add sections, i can click in here and add sections. as i told you before, this is this level of customization we were used to in the home page, but we weren't used to this level of customization in the product pages, and this is actually the best thing about the new shopify update. so now let me take you through a product page and let's see how things are actually way different than before. before continuing with this tutorial and seeing the other features of the new update, i want to invite you to go down to the description and to sign up to my free workshop. in this video workshop, i show you how you can create a sustainable ecommerce business. i show you how you can attract, convert and retain your customers. so if you are struggling to maintain your success and if you are struggling to grow your ecommerce business, i highly recommend you to go down and to sign up to this free workshop. it's 100 free and you don't need to pay anything. just go down and sign up and i'm pretty sure you will get a lot of interesting ideas out of this free workshop and it will greatly help you to move your business to the next level- and it is 100 free. now let's get back to our topic and let's continue with a new update. this is the product page and, as you see in here, shopify is asking me- asking me whether i want to change the default product or to create a new template, and this is literally a big deal. so what does this mean? this means that i can create different templates for my product pages, so i can have a product page a which is totally different than product page b, and this is very useful. before this update, we were able to do that, but we needed a little bit of coding to do that and it was way complicated than now. now we can do that with few clicks. so let me show you how this works. i'm going here to click on default product and this is the default template. so if i don't change the product template, this is what i'm going to find and see inside of my product page. so, as you can see in here, this is way different than before. so this is my product. this is the product information section as you can see it from here. this is here. if i scroll down like this, i can move to the other sections of the page. okay, and i'm going to show you how you can modify these sections. so let me start first with the product information. okay, and let's see how much we can customize in here. okay. so first we have a text, then another text, then we have the price. when it comes to price, we can't change a lot for sure. then, if we go down, we have the title, the variant, the quantity selector, the buy button and the description. so now, for example, if i want to move my description up, i can do that by simply dragging it up like this. so, as you can see, now my description is above the the button. also, i can take it back because it looks better here. then i can add a new block. so let's say, i want to add a new text, or i want to add a tab, or i want to add a pop-up. i can do that. let's add a tab, because this is actually something i like to add. i will tok a little bit more about this in a while, about the dynamic sources, which is also something very, very good about this new update, but so in here i'm adding a new tab. let me show you how it looks. this is the tab. i can, in here, change the con, choose the content, and i can, in here, select a page and i can change the mark image. let's say, for example, i want to add books, i can change it in here. let's say, in here, i want to add the shipping page, i can select it from here. so now i have my shipping tab. i can call it in here, shipping, for example, and i have my new tab. well, the way i did this tab, now this step will be common between all of my product pages, because i'm adding it inside of the template, inside of the default template, and i'm adding a statik tab. however, i can change that. i can add a dynamic tab, which means a tab that can change between different product pages. let me show you this. so let's say, in here, instead of creating a statik tab and choosing a page, i click in here, this is insert dynamic source. so let me click in here, and in here i can pick a meta field. let me explain you what is a meta field. meta field is like a new characteristik that you can add to your product other than the normal one, which are the title, the descriptions and things like that and the price. now i have the ability to add a special characteristik for each of my product, okay, and i can't link to this characteristik inside of any section i want. so i'm going to click on add meta field and i'm going in here to products and i'm going to create a new meta field, so let's call this, for example, shipping information. let's say, i have different shipping conditions depending on the